:root{--bg:#EFEDE8;--paper:#FFFFFF;--ink:#1F2430;--ink2:#4B5060;--muted:#7D8090;--denim:#2C4A7A;--denim-soft:#DCE3EE;--blush:#EBC9C1;--blush-soft:#F7E9E5;--mustard:#D9A441;--line:#DDD9D1;
  --display:"Italiana",Georgia,serif;--sans:"Jost",system-ui,sans-serif;--k-ink:var(--ink);--k-bg:#fff;--k-accent:var(--denim);--k-font:var(--sans)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--denim);outline-offset:2px}
h1,h2{font-family:var(--display);font-weight:400;letter-spacing:.01em;line-height:1.05;margin:0 0 .35em}
h1{font-size:clamp(2.3rem,8vw,3rem)}h2{font-size:1.7rem}h3{font-size:.95rem;font-weight:600;margin:1.2em 0 .5em}
.sub{color:var(--ink2);margin:0 0 14px}.muted{color:var(--muted)}.opt{color:var(--muted);font-weight:400}
.bar{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:10px 16px;padding-top:max(10px,env(safe-area-inset-top));background:rgba(239,237,232,.92);backdrop-filter:blur(10px)}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);font:400 1.6rem var(--display)}.logo svg{width:30px;height:30px}
.icon-btn{border:0;background:var(--paper);width:40px;height:40px;border-radius:50%;display:grid;place-items:center;cursor:pointer}
.icon-btn svg,.tabs svg,.shot svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
main{max-width:860px;margin:0 auto;padding:14px 16px 110px}
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:5;display:flex;justify-content:center;gap:6px;background:var(--paper);border-top:1px solid var(--line);padding:6px 8px max(6px,env(safe-area-inset-bottom))}
.tabs button{flex:1;max-width:170px;border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.8rem;font-weight:600;color:var(--muted);padding:6px;border-radius:12px;cursor:pointer}
.tabs button[aria-current]{color:var(--ink);background:var(--denim-soft)}
.head-row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.add-btn{position:relative;background:var(--ink);color:#fff;border-radius:999px;padding:10px 16px;font-weight:600;cursor:pointer;white-space:nowrap}
.add-btn input{position:absolute;inset:0;opacity:0;cursor:pointer}.add-btn:focus-within{outline:3px solid var(--denim);outline-offset:2px}
.cats{display:flex;gap:6px;overflow-x:auto;padding:4px 0 12px;scrollbar-width:none}
.cat{flex:none;border:1.5px solid var(--line);background:var(--paper);border-radius:999px;padding:6px 14px;font-weight:500;cursor:pointer}
.cat small{color:var(--muted)}.cat[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:#fff}.cat[aria-selected=true] small{color:#C9CBD6}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:10px}
.piece{border:0;background:var(--paper);border-radius:14px;padding:6px;display:flex;flex-direction:column;gap:4px;cursor:pointer;text-align:left}
.ph{display:block;aspect-ratio:3/4;border-radius:10px;overflow:hidden;background:var(--blush-soft)}
.ph img{width:100%;height:100%;object-fit:cover;display:block}.ph img:not([src]){visibility:hidden}
.nm{font-size:.78rem;line-height:1.25;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.empty{text-align:center;padding:30px 0}.empty .big{font:400 2rem var(--display);margin:0 0 6px}.empty p{color:var(--ink2)}
.edit .ph.big{max-width:220px;margin:0 auto 10px}
.tags{display:flex;flex-wrap:wrap;gap:5px}.tags span{background:var(--denim-soft);border-radius:999px;padding:2px 10px;font-size:.82rem}
.row2{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.row2>*{flex:1}
.field{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:.9rem;margin:10px 0}
.field input,.field select{border:1.5px solid var(--line);border-radius:12px;padding:11px;font:inherit;font-weight:400;background:var(--paper);color:var(--ink)}
.cta{display:block;width:100%;border:0;border-radius:999px;background:var(--denim);color:#fff;font-weight:600;padding:14px;cursor:pointer;font-size:1rem}
.cta:hover{background:#223B62}.cta.sm{padding:10px 14px;font-size:.92rem}.cta:disabled{background:var(--line);color:var(--muted)}
.ghost{border:1.5px solid var(--line);background:var(--paper);border-radius:999px;padding:10px 14px;font-weight:600;cursor:pointer;width:100%}
.ghost.sm{padding:8px 12px;font-size:.9rem;width:auto}.ghost.danger{color:#B3261E;margin-top:8px}
.weather{display:flex;flex-direction:column;gap:8px;background:var(--paper);border-radius:18px;padding:12px;margin-bottom:6px}
#locate{width:100%}#locate.on{background:var(--denim-soft);border-color:var(--denim-soft);color:var(--denim)}
.w-manual{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:.88rem;color:var(--muted)}
.chip{border:1.5px solid var(--line);background:var(--paper);border-radius:999px;padding:5px 12px;cursor:pointer;font-size:.88rem}
.chip[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.quick{display:flex;flex-wrap:wrap;gap:6px;margin:-2px 0 6px}
.quota{color:var(--muted);font-size:.86rem;text-align:center}
.look{position:relative;background:var(--paper);border-radius:24px;padding:12px 18px 18px;margin-top:22px;color:var(--ink)}
.hook{display:block;width:120px;height:34px;margin:0 auto 6px;color:var(--ink2)}
.look h2{text-align:center}
.lay{display:grid;gap:8px;grid-template-columns:repeat(3,1fr)}.lay.n2{grid-template-columns:repeat(2,1fr)}.lay.n4{grid-template-columns:repeat(2,1fr)}
.lay .ph{background:var(--bg)}
.names{display:flex;flex-wrap:wrap;gap:4px 12px;list-style:none;padding:0;margin:10px 0;font-size:.85rem;color:var(--ink2)}
.names li::before{content:"· ";color:var(--mustard)}
.tip{background:var(--blush-soft);border-radius:12px;padding:8px 12px}
.gap{background:var(--paper);border-radius:16px;padding:12px 14px;margin-top:16px}
.saved-h{margin-top:30px}.saved-look{background:var(--paper);border-radius:18px;padding:10px 14px;margin-bottom:10px}
.saved-look summary{cursor:pointer;display:flex;justify-content:space-between;gap:10px;align-items:baseline}.saved-look summary small{color:var(--muted)}
.saved-look .lay{margin-top:10px}
.shot{position:relative;display:flex;align-items:center;gap:14px;background:var(--ink);color:#fff;border-radius:20px;padding:18px;cursor:pointer}
.shot input{position:absolute;inset:0;opacity:0;cursor:pointer}.shot:focus-within{outline:3px solid var(--denim);outline-offset:2px}
.shot svg{width:32px;height:32px;stroke:var(--mustard);flex:none}.shot span{display:flex;flex-direction:column}.shot small{color:#C9CBD6}
.verdict{background:var(--paper);border-radius:24px;padding:20px;margin-top:18px}
.verdict .v{display:inline-block;margin:0 0 6px;font-weight:700;border-radius:999px;padding:3px 12px}
.v-buy .v{background:#DDF2E6;color:#1F7A4D}.v-maybe .v{background:#FBF0D8;color:#8A6513}.v-skip .v{background:var(--blush-soft);color:#A33A2E}
.busy{position:fixed;inset:0;z-index:20;background:rgba(239,237,232,.9);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;font-weight:600}
.busy[hidden]{display:none}
.hanger{width:70px;height:36px;border:3px solid var(--ink);border-top:0;clip-path:polygon(50% 0,100% 100%,0 100%);background:none;position:relative}
.hanger{border:0;background:linear-gradient(var(--ink),var(--ink)) bottom/100% 3px no-repeat,linear-gradient(to top right,transparent 48%,var(--ink) 48%,var(--ink) 54%,transparent 54%) left/50% 100% no-repeat,linear-gradient(to top left,transparent 48%,var(--ink) 48%,var(--ink) 54%,transparent 54%) right/50% 100% no-repeat}
@media(prefers-reduced-motion:no-preference){.hanger{animation:sway 1.4s ease-in-out infinite;transform-origin:50% 0}}
@keyframes sway{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
.kit-toast{bottom:calc(84px + env(safe-area-inset-bottom))}
