:root { --bg:#101015; --card:#1a1a22; --text:#f8f5f5; --muted:#a4a1aa; --pink:#ff4eb8; font-family: Inter, Arial, sans-serif; color:var(--text); background:var(--bg); }
* { box-sizing:border-box; } body { margin:0; min-width:320px; background:var(--bg); } button,input,textarea { font:inherit; } button { color:inherit; cursor:pointer; border:0; } .shell { max-width:640px; margin:auto; min-height:100vh; padding:calc(18px + env(safe-area-inset-top)) 18px 105px; }
header { display:flex; justify-content:space-between; align-items:center; } .logo { padding:0; background:none; font-size:20px; font-weight:900; letter-spacing:2px; } .logo span { color:var(--pink); }.cart-button { background:#24242d; border-radius:30px; padding:10px 12px; font-size:12px; }.cart-button b { display:inline-grid; place-items:center; margin-left:5px; background:var(--pink); width:18px;height:18px;border-radius:50%; }
.hero { padding:62px 5px 34px; position:relative; overflow:hidden; }.eyebrow { color:var(--pink); font-size:10px; font-weight:800; letter-spacing:1.5px; margin:0 0 10px; }.hero h1,.page-head h1 { font-size:48px; line-height:.96; letter-spacing:-2px; margin:0 0 16px; }.hero h1 em { font-family:Georgia,serif; font-weight:400; color:#d8cbff; }.hero>p:not(.eyebrow),.page-head>p:not(.eyebrow) { max-width:300px; color:var(--muted); font-size:14px; line-height:1.5; margin:0; }.hero-sign { position:absolute; right:-13px; top:62px; color:#fff; font-size:25px; font-weight:900; letter-spacing:3px; transform:rotate(-10deg); text-shadow:0 0 7px #fff,0 0 18px var(--pink),0 0 38px var(--pink); opacity:.82; }
.choices { display:grid; gap:12px; }.choice { padding:20px; min-height:164px; text-align:left; border-radius:18px; position:relative; overflow:hidden; }.choice small { color:#c3c0cb; }.choice h2 { font-size:24px; line-height:1; margin:17px 0 9px; letter-spacing:-.7px; }.choice p { color:#c8c5cc; font-size:12px; margin:0; }.choice span { position:absolute; bottom:17px; right:18px; font-weight:bold; font-size:12px; }.catalog-choice { background:linear-gradient(125deg,#31204d,#201b30); }.custom-choice { background:linear-gradient(125deg,#3e213e,#2a192d); }.benefits { display:flex; justify-content:space-around; padding:34px 0 4px; text-align:center; }.benefits div { display:grid; gap:5px; }.benefits b { font-size:14px; }.benefits span { color:var(--muted); font-size:10px; }
.page-head { padding:45px 5px 22px; }.page-head.compact { padding-top:38px; }.back { background:transparent; padding:0; color:var(--muted); font-size:26px; margin-bottom:23px; }.filters { display:flex; gap:8px; overflow:auto; scrollbar-width:none; margin:0 -18px 22px; padding:0 18px; }.filters button { white-space:nowrap; background:#24242d; border-radius:30px; padding:9px 13px; font-size:12px; }.filters .selected { background:var(--pink); color:#181018; font-weight:800; }.products { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.product { background:var(--card); padding:10px; border-radius:16px; }.preview { min-height:130px; border-radius:10px; display:grid; place-items:center; align-content:center; gap:4px; background:radial-gradient(circle,#303039,#1b1b22); color:var(--neon); text-shadow:0 0 6px currentColor,0 0 14px currentColor; }.preview span { font-size:25px; }.preview strong { font-size:18px; letter-spacing:1px; }.product-category { color:var(--muted); font-size:10px; margin:13px 0 4px; }.product h2 { font-size:15px; margin:0 0 9px; }.sizes { display:grid; gap:4px; }.sizes button { display:grid; grid-template-columns:1fr auto 18px; align-items:center; padding:5px 0; border-top:1px solid #30303a; background:transparent; font-size:10px; text-align:left; }.sizes button b { font-size:10px; }.sizes i { font-style:normal; color:var(--pink); text-align:right; font-size:17px; }
nav { position:fixed; z-index:2; bottom:0; left:50%; transform:translateX(-50%); display:flex; justify-content:space-around; width:min(640px,100%); padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:#17171eec; backdrop-filter:blur(14px); border-top:1px solid #2b2b34; }nav button { display:grid; justify-items:center; gap:4px; background:transparent; color:#85828d; font-size:10px; }nav button.active { color:var(--pink); } svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }.floating-cart { position:fixed; z-index:3; bottom:77px; left:50%; transform:translateX(-50%); background:var(--pink); color:#24101e; font-size:13px; font-weight:800; padding:13px 20px; border-radius:28px; box-shadow:0 7px 25px #0008; }
.cart-list { display:grid; gap:10px; }.cart-list article { background:var(--card); padding:12px; border-radius:13px; display:flex; align-items:center; gap:11px; }.cart-mark { display:grid;place-items:center;width:42px;height:42px;background:#32253b;color:var(--pink);border-radius:10px; }.cart-list h2 { font-size:14px;margin:0 0 4px; }.cart-list p { color:var(--muted);font-size:11px;margin:0; }.quantity { margin-left:auto; display:flex; align-items:center; gap:10px; }.quantity button { width:23px;height:23px;border-radius:50%;background:#30303a;font-size:17px; }.quantity b { font-size:12px; }.total { display:flex;justify-content:space-between;padding:27px 3px 18px;font-size:15px; }.total b { font-size:19px; }.primary { width:100%; border-radius:13px; padding:16px; background:var(--pink); color:#22101d; font-weight:800; text-align:left; }.primary span { float:right; font-size:19px; line-height:13px; }.notice { margin:13px 10px; color:#797681; text-align:center; font-size:10px; line-height:1.4; }.empty,.success { padding:35px 10px; text-align:center; }.empty>div,.success>div { color:var(--pink); font-size:35px; }.empty h2,.success h2 { margin:12px 0 7px;font-size:21px; }.empty p,.success p { color:var(--muted);font-size:13px;margin:0 0 23px; }
.request-form { display:grid; gap:16px; }.request-form label { display:grid; gap:8px; font-size:12px; font-weight:700; }.request-form input,.request-form textarea { width:100%; border:1px solid #353540; background:#1a1a22; border-radius:10px; padding:13px; color:var(--text); outline:none; font-size:13px; }.request-form input:focus,.request-form textarea:focus { border-color:var(--pink); }.request-form textarea { min-height:82px; resize:vertical; }.file-input input { display:none; }.file-input span { border:1px dashed #52515c; border-radius:10px; padding:14px; color:var(--muted); font-weight:400; }.file-input b { float:right; color:var(--pink); font-size:20px; line-height:12px; }.primary:disabled { cursor:wait; opacity:.65; }.form-message { min-height:16px; margin:0; color:#ff8798; font-size:12px; line-height:1.35; }
.admin-link{background:none;color:var(--muted);font-size:11px;margin-right:8px}.catalog-status{color:var(--muted);font-size:12px;margin:0 0 16px}.preview img{width:100%;height:150px;object-fit:cover;border-radius:10px}.product-description{color:var(--muted);font-size:11px;line-height:1.35;margin:0 0 9px}.admin-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}.secondary{background:#292934;border-radius:13px;padding:16px;font-weight:800}.admin-card{display:grid;gap:8px;background:var(--card);padding:14px;border-radius:14px;margin-bottom:10px}.admin-card small{display:block;color:var(--muted);margin-top:4px}.admin-card button{justify-self:start;background:#30303a;border-radius:8px;padding:7px 9px;font-size:11px}.admin-product{display:flex;gap:8px;align-items:center;padding-top:8px;border-top:1px solid #30303a;font-size:12px}.admin-product span{flex:1}.admin-form{display:grid;gap:14px}.admin-form label{display:grid;gap:7px;font-size:12px;font-weight:700}.admin-form input,.admin-form textarea,.admin-form select{width:100%;background:#1a1a22;color:var(--text);border:1px solid #353540;border-radius:10px;padding:12px}.admin-form textarea{min-height:72px}.admin-form fieldset{border:1px solid #353540;border-radius:10px;display:grid;gap:10px}.admin-form legend{color:var(--muted);font-size:12px}.size-row{display:grid;grid-template-columns:1fr 110px;gap:8px}.admin-image{width:100%;max-height:180px;object-fit:cover;border-radius:10px}