:root{--night:#14122b;--night-2:#1f1c3d;--card:#262248;--line:#3a3566;--text:#f4efe6;--muted:#b9b2d6;--honey:#f2a93b;--honey-strong:#ffbf5a;--ok:#5cc98b;--warn:#f0b45a;--bad:#ff7b7b;--wa:#25d366;--radius:14px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0}body{background:radial-gradient(circle at 20% -10%, #2c2760 0, var(--night) 55%) fixed, var(--night);color:var(--text);font-family:system-ui,Segoe UI,Tahoma,Noto Sans Arabic,sans-serif;line-height:1.6}a{color:var(--honey-strong)}button{font:inherit}.top{z-index:5;background:color-mix(in srgb, var(--night) 88%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-block-end:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex;position:sticky;top:0}.brand{color:var(--text);align-items:center;gap:10px;font-weight:700;text-decoration:none;display:flex}.hex{background:var(--honey);width:36px;height:40px;color:var(--night);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);place-items:center;font-weight:800;display:grid}.lang{color:var(--muted);font-size:.9rem;text-decoration:none}.cart-btn{background:var(--honey);color:var(--night);border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-weight:700;text-decoration:none;display:inline-flex}.wrap{max-width:1040px;margin-inline:auto;padding:16px}.stack{flex-direction:column;gap:16px;display:flex}.stack.tight{gap:8px}.row{align-items:center;gap:8px;display:flex}.row.between{justify-content:space-between}.row.wrap{flex-wrap:wrap}.center-text{text-align:center}.muted{color:var(--muted)}.small{font-size:.9rem}.num{font-variant-numeric:tabular-nums}.title{text-wrap:balance;margin:0;font-size:1.6rem}.subtitle{color:var(--honey-strong);margin:0;font-size:1.15rem}.ok-text{color:var(--ok);margin:0}.warn-text{color:var(--warn)}.hero{text-align:center;padding-block:12px}.grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;display:grid}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px}.product{flex-direction:column;gap:10px;display:flex}.placeholder{aspect-ratio:4/3;background:radial-gradient(circle at 30% 30%, #ffcf7a 0, var(--honey) 35%, #b8741c 100%);max-width:100%;color:var(--night);border-radius:10px;place-items:center;font-size:2.6rem;font-weight:800;display:grid}.pname{margin:0;font-size:1.1rem}.sizes{flex-wrap:wrap;gap:6px;display:flex}.chip{border:1px solid var(--line);background:var(--night-2);color:var(--text);cursor:pointer;border-radius:999px;padding:4px 12px}.chip.on{border-color:var(--honey);background:color-mix(in srgb, var(--honey) 22%, var(--night-2))}.price{color:var(--honey-strong);font-size:1.15rem}.pill{border-radius:999px;padding:2px 10px;font-size:.85rem}.pill.ok{background:color-mix(in srgb, var(--ok) 20%, transparent);color:var(--ok)}.pill.warn{background:color-mix(in srgb, var(--warn) 20%, transparent);color:var(--warn)}.btn{cursor:pointer;background:var(--honey);min-height:44px;color:var(--night);border:0;border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:8px 16px;font-weight:700;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.ghost{color:var(--text);border:1px solid var(--line);background:0 0}.btn.small{min-height:36px;padding:4px 10px}.btn.wa{background:var(--wa);color:#06210f;font-size:1.05rem}.lines{margin:0;padding:0;list-style:none}.line{border-block-end:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;gap:8px;padding-block:12px;display:flex}.line:last-child{border-block-end:0}.qty{text-align:center;min-width:2ch}.line-total{text-align:end;min-width:7ch}.field{flex-direction:column;gap:4px;display:flex}.input{border:1px solid var(--line);background:var(--night-2);min-height:44px;color:var(--text);font:inherit;border-radius:10px;padding:8px 12px}.note{border:1px solid;border-radius:10px;margin:0;padding:12px}.note.warn{border-color:var(--warn);color:var(--warn)}.note.bad{border-color:var(--bad);color:var(--bad)}:focus-visible{outline:3px solid var(--honey-strong);outline-offset:2px}@media (prefers-reduced-motion:reduce){*{transition:none!important}}