:root{--blue-50:#eaf3ff;--blue-100:#d2e5ff;--blue-200:#a6caff;--blue-300:#6eaaff;--blue-400:#3b8cff;--blue-500:#1a73ff;--blue-600:#0a5ce6;--blue-700:#0747b8;--blue-800:#08378a;--blue-900:#0a275e;--white:#fff;--gray-50:#f5f7fa;--gray-100:#eceff4;--gray-200:#dde2ea;--gray-300:#c3cad6;--gray-500:#7a8597;--gray-700:#3d4554;--gray-900:#151a23;--ink-900:#050608;--ink-800:#0c0f15;--ink-700:#141924;--success:#16a34a;--warning:#f59e0b;--danger:#dc2626;--color-primary:var(--blue-500);--color-primary-hover:var(--blue-600);--color-primary-soft:var(--blue-50);--color-bg:var(--gray-50);--color-surface:var(--white);--color-text:var(--gray-900);--color-text-muted:var(--gray-500);--color-border:var(--gray-200);--color-dark:var(--ink-900);--gradient-brand:linear-gradient(135deg, var(--blue-400) 0%, var(--blue-600) 100%);--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--shadow-sm:0 1px 2px #0a275e0f;--shadow-md:0 6px 20px #0a275e1a;--content-max:1600px;--font:"Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif}*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font);background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,input,select{font:inherit}.container{width:100%;max-width:var(--content-max);margin:0 auto;padding:0 24px}.btn{border-radius:var(--radius-md);cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;padding:10px 18px;font-weight:600;transition:background .15s,transform 50ms;display:inline-flex}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--color-primary);color:var(--white)}.btn-primary:hover{background:var(--color-primary-hover)}.btn-primary:disabled{background:var(--gray-300);cursor:not-allowed}.btn-ghost{color:var(--color-primary);border:1px solid var(--color-primary);background:0 0}.btn-ghost:hover{background:var(--color-primary-soft)}.sidebar{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);flex-direction:column;align-self:start;gap:20px;padding:16px;display:flex;position:sticky;top:120px}.sidebar__group h2{margin:0 0 8px;font-size:.95rem}.sidebar__group ul{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.sidebar__group li button{border-radius:var(--radius-sm);width:100%;color:var(--gray-700);text-align:left;cursor:pointer;background:0 0;border:none;justify-content:space-between;padding:6px 8px;font-size:.88rem;display:flex}.sidebar__group li button span{color:var(--color-text-muted);font-size:.8rem}.sidebar__group li button:hover{color:var(--color-primary);background:var(--color-primary-soft)}.sidebar__group li button.is-active{color:var(--color-primary);background:var(--color-primary-soft);font-weight:700}.sidebar__check{cursor:pointer;align-items:center;gap:8px;font-size:.88rem;display:flex}.sidebar__check input{accent-color:var(--color-primary)}.footer{background:var(--color-dark);color:var(--gray-300);text-align:center;padding:20px 0;font-size:.8rem}.header{z-index:10;background:var(--white);color:var(--color-text);border-bottom:1px solid var(--color-border);position:sticky;top:0}.header__topbar{background:var(--color-primary);color:var(--white);text-align:center;padding:6px 16px;font-size:.8rem;font-weight:500}.header__main{justify-content:space-between;align-items:center;gap:16px;height:68px;display:flex}.header__brand{align-items:center;gap:8px;font-size:1.35rem;font-weight:700;display:flex}.header__brand img{object-fit:contain;background:var(--ink-900);border-radius:var(--radius-md);width:42px;height:42px;padding:5px}.header__brand strong{color:var(--color-primary)}.header__actions{align-items:center;gap:8px;display:flex}.header__action{border-radius:var(--radius-md);color:var(--color-text);text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;align-items:center;gap:8px;padding:6px 10px;display:flex}.header__action:hover{border-color:var(--color-border);color:var(--color-primary)}.header__action-text{flex-direction:column;line-height:1.2;display:flex}.header__action-text small{color:var(--color-text-muted);font-size:.72rem}.header__action-text strong{font-size:.88rem}.header__cart{display:flex;position:relative}.header__badge{background:var(--color-primary);min-width:18px;height:18px;color:var(--white);border-radius:999px;place-items:center;padding:0 5px;font-size:.7rem;font-weight:700;display:grid;position:absolute;top:-6px;right:-8px}@media (width<=600px){.header__action-text,.header__brand span{display:none}}.stock{border-radius:999px;align-self:flex-start;padding:3px 8px;font-size:.72rem;font-weight:600}.stock--ok{background:var(--color-primary-soft);color:var(--blue-700)}.stock--low{color:#a15c00;background:#fff4e0}.stock--out{color:var(--danger);background:#fde8e8}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);height:100%;box-shadow:var(--shadow-sm);flex-direction:column;transition:box-shadow .2s,transform .2s;display:flex;overflow:hidden}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.card--out{opacity:.7}.card__image{background:var(--gray-100);height:165px;position:relative;overflow:hidden}.card__image img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.card__category{background:var(--color-dark);color:var(--white);border-radius:999px;padding:3px 8px;font-size:.65rem;font-weight:600;position:absolute;bottom:8px;left:8px}.card__details{color:var(--color-primary);border-radius:var(--radius-sm);text-align:center;box-shadow:var(--shadow-sm);opacity:0;background:#fffffff2;padding:7px 10px;font-size:.78rem;font-weight:700;transition:opacity .2s,transform .2s;position:absolute;top:8px;left:8px;right:8px;transform:translateY(-6px)}.card:hover .card__details,.card__details:focus-visible{opacity:1;transform:translateY(0)}.card__details:hover{background:var(--color-primary);color:var(--white)}@media (hover:none){.card__details{opacity:1;transform:none}}.card__body{flex-direction:column;flex:1;gap:6px;padding:10px 12px 12px;display:flex}.card__body h3{-webkit-line-clamp:2;-webkit-box-orient:vertical;height:2.6em;margin:0;font-size:.9rem;line-height:1.3;display:-webkit-box;overflow:hidden}.card__body h3 a:hover{color:var(--color-primary)}.card__desc{height:2.7em;color:var(--color-text-muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:.78rem;line-height:1.35;display:-webkit-box;overflow:hidden}.card__price{color:var(--blue-700);margin-top:auto;font-size:1.1rem;font-weight:800}.card__body .btn{width:100%;padding:8px 12px;font-size:.85rem}.hero{padding-top:20px}.hero img{border-radius:8px;width:100%}.catalog{padding-top:32px;padding-bottom:48px}.catalog__head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.catalog__head h1{margin:0;font-size:1.75rem}.catalog__head input{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);flex:1;min-width:200px;max-width:320px;padding:10px 14px}.catalog__head input:focus{outline:2px solid var(--blue-300);border-color:var(--color-primary)}.catalog__filters{flex-wrap:wrap;gap:8px;margin:20px 0 24px;display:flex}.chip{border:1px solid var(--color-border);background:var(--color-surface);cursor:pointer;border-radius:999px;padding:6px 14px;font-size:.85rem;font-weight:600}.chip:hover{border-color:var(--color-primary)}.chip--active{background:var(--color-primary);border-color:var(--color-primary);color:var(--white)}.catalog__layout{grid-template-columns:1fr;gap:24px;display:grid}.catalog__layout .sidebar{display:none}@media (width>=900px){.catalog__layout{grid-template-columns:240px 1fr}.catalog__layout .sidebar{display:flex}}.catalog__grid{grid-template-columns:repeat(auto-fill,minmax(220px,250px));place-content:start;gap:16px;display:grid}.catalog__empty{color:var(--color-text-muted);text-align:center;padding:48px 0}@media (width<=480px){.catalog__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}.detail{min-height:60vh;padding-top:24px;padding-bottom:48px}.detail--missing{flex-direction:column;align-items:flex-start;gap:16px;display:flex}.detail__breadcrumb{color:var(--color-text-muted);flex-wrap:wrap;gap:8px;margin-bottom:20px;font-size:.82rem;display:flex}.detail__breadcrumb a{color:var(--color-primary);font-weight:600}.detail__grid{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);grid-template-columns:1fr;gap:32px;padding:24px;display:grid}@media (width>=900px){.detail__grid{grid-template-columns:minmax(0,520px) 1fr}}.detail__image{aspect-ratio:1;background:var(--gray-100);border-radius:var(--radius-md);overflow:hidden}.detail__image img{object-fit:cover;width:100%;height:100%}.detail__info{flex-direction:column;gap:12px;max-width:520px;display:flex}.detail__category{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.78rem;font-weight:600}.detail__info h1{margin:0;font-size:1.6rem;line-height:1.25}.detail__price{color:var(--blue-700);margin:4px 0 0;font-size:2rem;font-weight:800}.detail__desc{color:var(--gray-700);margin:0;line-height:1.6}.detail__buy{align-items:center;gap:12px;margin-top:8px;display:flex}.detail__buy .btn{padding:12px 28px}.detail__buy small{color:var(--color-text-muted)}.detail__perks{border-top:1px solid var(--color-border);color:var(--gray-700);flex-direction:column;gap:6px;margin:12px 0 0;padding:16px 0 0 18px;font-size:.88rem;display:flex}.detail__perks li::marker{color:var(--color-primary)}.login{background:radial-gradient(circle at 15% 20%, #1a73ff59, transparent 40%), radial-gradient(circle at 85% 80%, #1a73ff40, transparent 40%), var(--color-dark);place-items:center;min-height:100vh;padding:16px;display:grid}.login__box{background:var(--color-surface);border-radius:var(--radius-lg);flex-direction:column;gap:14px;width:100%;max-width:380px;padding:32px 28px;display:flex;box-shadow:0 20px 60px #00000080}.login__logo{object-fit:contain;background:var(--ink-900);border-radius:var(--radius-lg);width:80px;height:80px;margin:0 auto;padding:10px}.login__box h1{text-align:center;margin:0;font-size:1.3rem}.login__box p{text-align:center;color:var(--color-text-muted);margin:0 0 6px;font-size:.9rem}.login__box label{flex-direction:column;gap:6px;font-size:.85rem;font-weight:600;display:flex}.login__box input{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:10px 12px}.login__box input:focus{outline:2px solid var(--blue-300);border-color:var(--color-primary)}.login__error{color:var(--danger);font-size:.85rem}.admin{min-height:100vh;display:flex}.admin__sidebar{background:var(--color-dark);width:240px;color:var(--white);flex-direction:column;flex-shrink:0;gap:24px;padding:20px 16px;display:flex}.admin__brand{align-items:center;gap:8px;font-size:1.2rem;font-weight:700;display:flex}.admin__brand img{object-fit:contain;width:34px;height:34px}.admin__brand strong{color:var(--blue-400)}.admin__sidebar nav{flex-direction:column;gap:4px;display:flex}.admin__sidebar nav a{border-radius:var(--radius-md);color:var(--gray-300);padding:10px 12px;font-weight:600}.admin__sidebar nav a:hover{background:var(--ink-700);color:var(--white)}.admin__sidebar nav a.active{background:var(--color-primary);color:var(--white)}.admin__user{color:var(--gray-300);word-break:break-all;flex-direction:column;gap:8px;margin-top:auto;display:flex}.admin__content{flex:1;min-width:0;padding:32px}.admin__content h1{margin-top:0}.admin__hint{color:var(--color-text-muted)}.stats{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:24px;display:grid}.stat{background:var(--color-surface);border:1px solid var(--color-border);border-left:4px solid var(--color-primary);border-radius:var(--radius-md);flex-direction:column;gap:4px;padding:16px;display:flex}.stat span{color:var(--color-text-muted);font-size:.8rem}.stat strong{font-size:1.4rem}.stat--alert{border-left-color:var(--warning)}.table-wrap{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow-x:auto}.table{border-collapse:collapse;width:100%;font-size:.9rem}.table th,.table td{text-align:left;border-bottom:1px solid var(--color-border);padding:12px 16px}.table th{background:var(--color-primary-soft);color:var(--blue-800);font-weight:700}.table tr:last-child td{border-bottom:none}.table .num{text-align:right;font-variant-numeric:tabular-nums}.qty--low{color:#a15c00;font-weight:700}.qty--out{color:var(--danger);font-weight:700}@media (width<=720px){.admin{flex-direction:column}.admin__sidebar{width:100%}.admin__sidebar nav{flex-flow:wrap}.admin__content{padding:20px 16px}}
