:root{--bg-1: #0e2136;--bg-2: #081422;--hex: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z' fill='%233a7d92' fill-opacity='0.18'/%3E%3C/svg%3E");--marble: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.014 0.033' numOctaves='4' seed='9' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23m)' opacity='0.09'/%3E%3C/svg%3E");--marble-a: #16324e;--marble-b: #0b1d30;--marble-c: #091626;--frame: linear-gradient(150deg, #f4d6a8 0%, #c07c4f 22%, #7a4b34 46%, #eaba8b 70%, #9a6035 100%);--frame-soft: rgba(196, 132, 92, .45);--gold-grad: linear-gradient(180deg, #fbedc6 0%, #e2be76 48%, #b7833f 100%);--emerald-1: #23b092;--emerald-2: #12775f;--emerald-3: #0b5443;--teal: #55d6c2;--teal-deep: #2ba892;--text: #ece3d1;--muted: #9fb0c2;--cream: #f3ecdb;--good: #4fd6a0;--bad: #ef8478;--warn: #e9bd6a;--serif: Georgia, "Times New Roman", "Playfair Display", serif;--radius: 16px;--nav-h: 66px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0}body{font-family:Segoe UI,system-ui,-apple-system,Roboto,sans-serif;color:var(--text);font-size:16px;line-height:1.5;background:linear-gradient(180deg,rgba(58,125,146,.12),transparent 260px),radial-gradient(120% 90% at 50% -10%,#12294080 0%,transparent 60%),linear-gradient(180deg,var(--bg-1) 0%,var(--bg-2) 60%,#06101c 100%);background-attachment:fixed;min-height:100vh}body:before{content:"";position:fixed;inset:0 0 auto 0;height:340px;background:var(--hex);-webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,transparent 100%);pointer-events:none;z-index:0;opacity:.9}#root{position:relative;z-index:1;max-width:520px;margin:0 auto;min-height:100vh}.app-shell{padding:16px 16px calc(var(--nav-h) + 92px);min-height:100vh}.app-header{display:flex;align-items:center;justify-content:space-between;padding:10px 4px 14px}.app-header h1{font-family:var(--serif);font-size:30px;margin:0;letter-spacing:.01em;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 1px rgba(0,0,0,.55))}.app-header h1 .logo-dot{background:linear-gradient(180deg,#8ee7d6,#2ba892);-webkit-background-clip:text;background-clip:text;color:transparent}.card{position:relative;border:2.5px solid transparent;border-radius:var(--radius);padding:18px;margin-bottom:16px;background:var(--marble) padding-box,linear-gradient(150deg,var(--marble-a) 0%,var(--marble-b) 55%,var(--marble-c) 100%) padding-box,var(--frame) border-box;background-size:320px 320px,cover,cover;background-repeat:repeat,no-repeat,no-repeat;background-blend-mode:soft-light,normal,normal;box-shadow:0 12px 28px #00000080,inset 0 0 0 1.5px #0006,inset 0 1px #ffffff0f;animation:cardIn .55s cubic-bezier(.22,1,.36,1) both}.card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:13px;pointer-events:none;background:linear-gradient(125deg,rgba(255,255,255,.1) 0%,rgba(255,255,255,.02) 16%,transparent 38%)}.card>*{position:relative}.card h2,.card h3{font-family:var(--serif);margin:0 0 10px;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}.card h2{font-size:20px}.card h3{font-size:17px}.muted{color:var(--muted);font-size:14px}@keyframes cardIn{0%{opacity:0;transform:translateY(14px) scale(.99)}to{opacity:1;transform:none}}.card:nth-child(2){animation-delay:.05s}.card:nth-child(3){animation-delay:.1s}.card:nth-child(4){animation-delay:.15s}.card:nth-child(5){animation-delay:.2s}.card:nth-child(6){animation-delay:.25s}button{font-family:inherit;cursor:pointer}.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:15px 18px;font-size:16px;font-weight:700;letter-spacing:.01em;border:2px solid transparent;border-radius:13px;color:var(--cream);text-shadow:0 1px 2px rgba(0,0,0,.55);background:linear-gradient(180deg,var(--emerald-1) 0%,var(--emerald-2) 55%,var(--emerald-3) 100%) padding-box,var(--frame) border-box;box-shadow:0 7px 16px #00000073,inset 0 1px #ffffff59,inset 0 -3px 7px #00000059;transition:transform .08s ease,box-shadow .2s ease,filter .2s ease}.btn:after{content:"";position:absolute;top:-20%;left:-60%;width:42%;height:140%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.38),transparent);transform:skew(-18deg);animation:sheen 6s ease-in-out infinite}@keyframes sheen{0%{left:-60%}16%{left:130%}to{left:130%}}.btn:active{transform:scale(.985);filter:brightness(1.05)}.btn:disabled{filter:grayscale(.5) brightness(.7);opacity:.7}.btn:disabled:after{display:none}.btn.secondary{background:linear-gradient(180deg,#16324b,#0e2033) padding-box,var(--frame) border-box;color:var(--teal)}.btn.ghost{background:linear-gradient(180deg,#162c4280,#0c1a2880) padding-box,linear-gradient(150deg,var(--frame-soft),rgba(120,74,52,.5)) border-box;color:var(--cream);text-shadow:none;box-shadow:inset 0 1px #ffffff14}.btn.ghost:after{display:none}.btn.danger{background:linear-gradient(180deg,#7c2d2a,#521c1a) padding-box,var(--frame) border-box;color:#f4d7d2}.btn.small{width:auto;padding:9px 14px;font-size:14px;border-radius:11px}label.field{display:block;margin-bottom:16px}label.field>span{display:block;font-weight:600;font-size:14px;margin-bottom:6px;color:var(--cream)}input[type=text],input[type=number],textarea,select{width:100%;padding:13px 14px;border:1.5px solid var(--frame-soft);border-radius:12px;font-size:16px;font-family:inherit;background:#081422b8;color:var(--cream)}textarea{min-height:78px;resize:vertical}input::placeholder,textarea::placeholder{color:#6f8399}input:focus,textarea:focus,select:focus{outline:none;border-color:#e6b98a;box-shadow:0 0 0 3px #e6b98a2e}.chip-group{display:flex;flex-wrap:wrap;gap:8px}.chip{padding:9px 14px;border-radius:999px;border:1.5px solid var(--frame-soft);background:#0c1a2899;color:var(--cream);font-size:14px;font-weight:600;-webkit-user-select:none;user-select:none;transition:transform .1s ease}.chip:active{transform:scale(.96)}.chip.active{background:linear-gradient(180deg,var(--emerald-1),var(--emerald-3));color:#fff;border-color:#e6b98a;box-shadow:0 3px 10px #0006,inset 0 1px #ffffff40}.score-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.score-card{position:relative;border:2px solid transparent;border-radius:14px;padding:14px;background:var(--marble) padding-box,linear-gradient(150deg,var(--marble-a),var(--marble-c)) padding-box,var(--frame) border-box;background-size:320px 320px,cover,cover;background-blend-mode:soft-light,normal,normal;box-shadow:0 8px 18px #00000073,inset 0 0 0 1.2px #0006;animation:cardIn .5s ease both}.score-card.wide{grid-column:1 / -1}.score-label{font-size:13px;color:var(--muted);font-weight:600}.score-value{font-family:var(--serif);font-size:40px;font-weight:700;line-height:1.05;margin-top:4px;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 2px rgba(0,0,0,.55))}.score-value .unit{font-size:14px;color:var(--muted);-webkit-text-fill-color:var(--muted)}.score-bar{height:13px;border-radius:999px;padding:2px;margin-top:9px;background:linear-gradient(180deg,#081522,#0e2334);box-shadow:inset 0 1px 3px #000000bf,0 0 0 1.5px var(--frame-soft);overflow:hidden}.score-bar>i{display:block;height:100%;border-radius:999px;position:relative;overflow:hidden;background:linear-gradient(180deg,#5fe6ce,#0f8770);box-shadow:inset 0 1px #ffffff80,0 0 10px #50d6c273;transition:width .9s cubic-bezier(.22,1,.36,1)}.score-bar>i:after{content:"";position:absolute;top:0;left:-50%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);animation:sheen 6.5s ease-in-out infinite}.delta{font-size:13px;font-weight:700;margin-top:6px;display:inline-flex;gap:4px;align-items:center}.delta.up{color:var(--good)}.delta.down{color:var(--bad)}.delta.flat{color:var(--muted)}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:520px;height:var(--nav-h);background:linear-gradient(180deg,#e9edf1,#c4ccd5 45%,#97a1ad);border-top:2px solid #f4f6f9;display:flex;justify-content:space-around;align-items:center;padding-bottom:env(safe-area-inset-bottom);z-index:50;box-shadow:0 -5px 16px #00000073}.nav-item{background:none;border:none;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;color:#48586a;flex:1;padding:6px 0;font-weight:600;text-shadow:0 1px 0 rgba(255,255,255,.6);transition:color .15s ease,transform .1s ease}.nav-item svg{width:23px;height:23px;display:block;filter:drop-shadow(0 1px 0 rgba(255,255,255,.65))}.nav-item:active{transform:translateY(1px)}.nav-item.active{color:#0e7a67}.footer-disclaimer{position:fixed;bottom:var(--nav-h);left:50%;transform:translate(-50%);width:100%;max-width:520px;font-size:10.5px;color:#3c4855;text-align:center;padding:7px 16px;background:linear-gradient(180deg,#cfd6dd,#aab3be);border-top:1px solid #eef1f4;z-index:40;line-height:1.35;text-shadow:0 1px 0 rgba(255,255,255,.4)}.camera-wrap{position:relative;border-radius:var(--radius);overflow:hidden;background:#000;aspect-ratio:3 / 4;border:2.5px solid transparent;background:#000 padding-box,var(--frame) border-box;box-shadow:0 12px 28px #0000008c}.camera-wrap video,.camera-wrap canvas,.camera-wrap img{width:100%;height:100%;object-fit:cover;display:block}.face-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.face-oval{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:62%;height:74%;border:2.5px dashed rgba(240,207,160,.85);border-radius:50% 50% 48% 48%;box-shadow:0 0 24px #f0cfa040}.camera-tips{position:absolute;bottom:10px;left:10px;right:10px;background:#0000008c;color:var(--cream);font-size:12px;padding:8px 12px;border-radius:12px;text-align:center}.step{border:1.5px solid var(--frame-soft);border-radius:14px;padding:14px;margin-bottom:10px;background:#0915238c}.step.done{opacity:.55}.step.new{border-color:var(--good);background:#184a3a66}.step.removed{text-decoration:line-through;opacity:.5}.step-head{display:flex;align-items:flex-start;gap:10px}.step-check{width:27px;height:27px;border-radius:8px;border:2px solid var(--teal-deep);flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#08142299;color:#fff;font-size:15px;transition:background .15s ease}.step-check.on{background:linear-gradient(180deg,var(--emerald-1),var(--emerald-3));border-color:#e6b98a}.brand-tag{display:inline-block;font-size:12px;padding:4px 10px;border-radius:999px;background:#2ba89224;border:1px solid rgba(85,214,194,.25);margin:4px 4px 0 0;color:var(--teal);font-weight:600}.price-low{color:var(--good)}.price-mid{color:var(--warn)}.price-high{color:var(--bad)}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#030910a8;z-index:100;display:flex;align-items:flex-end;justify-content:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.sheet{width:100%;max-width:520px;border-radius:22px 22px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));max-height:82vh;overflow-y:auto;border-top:2.5px solid transparent;background:var(--marble) padding-box,linear-gradient(180deg,var(--marble-a),var(--marble-c)) padding-box,var(--frame) border-box;background-size:320px 320px,cover,cover;background-blend-mode:soft-light,normal,normal;animation:slideup .28s ease;box-shadow:0 -14px 40px #0009}.sheet h2{font-family:var(--serif);background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}@keyframes slideup{0%{transform:translateY(100%)}to{transform:none}}.row{display:flex;gap:10px}.row>*{flex:1}.center{text-align:center}.spinner{width:36px;height:36px;border:3.5px solid rgba(230,185,138,.25);border-top-color:#e6b98a;border-radius:50%;animation:spin .8s linear infinite;margin:20px auto}@keyframes spin{to{transform:rotate(360deg)}}.banner{padding:12px 14px;border-radius:12px;font-size:14px;margin-bottom:12px;border:1px solid transparent}.banner.error{background:#7c2d2a52;border-color:#ef847866;color:#f4c9c3}.banner.info{background:#2ba89229;border-color:#55d6c24d;color:#bfeee3}.pill{display:inline-block;font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px}.pill.alt{background:#2ba8922e;color:var(--teal)}.pill.vital{background:#ef847833;color:var(--bad)}.pill.skip{background:#e9bd6a2e;color:var(--warn)}.thumb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.thumb{aspect-ratio:1;border-radius:12px;overflow:hidden;border:2px solid transparent;background:var(--frame) border-box;position:relative}.thumb img{width:100%;height:100%;object-fit:cover;border-radius:10px}.thumb .date{position:absolute;bottom:0;left:0;right:0;font-size:9px;background:#0009;color:var(--cream);text-align:center;padding:2px}.compare-slider{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:3 / 4;touch-action:none;-webkit-user-select:none;user-select:none;border:2.5px solid transparent;background:#000 padding-box,var(--frame) border-box}.compare-slider img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.compare-top{clip-path:inset(0 0 0 var(--split, 50%))}.compare-handle{position:absolute;top:0;bottom:0;left:var(--split, 50%);width:3px;background:#e6b98a;box-shadow:0 0 8px #00000080}.compare-handle:after{content:"⇔";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;background:linear-gradient(180deg,#f4d6a8,#b87a4d);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#3a2416;font-weight:700;box-shadow:0 3px 10px #00000080}.seg{display:flex;background:#08142299;border:1.5px solid var(--frame-soft);border-radius:12px;padding:4px;gap:4px;margin-bottom:12px}.seg button{flex:1;border:none;background:transparent;padding:8px;border-radius:9px;font-weight:600;font-size:13px;color:var(--muted)}.seg button.active{background:linear-gradient(180deg,var(--emerald-1),var(--emerald-3));color:#fff;box-shadow:inset 0 1px #ffffff40}.legend-toggle{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.legend-toggle .chip{padding:5px 11px;font-size:12px}.slot-row{display:flex;align-items:flex-start;gap:14px}.slot-thumb{width:72px;height:92px;border-radius:12px;background:#08142299;border:2px solid transparent;background:#08142299 padding-box,var(--frame) border-box;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.slot-thumb img{width:100%;height:100%;object-fit:cover;border-radius:9px}.slot-ico{font-size:30px;opacity:.7}.install-bar{position:fixed;left:50%;transform:translate(-50%);bottom:calc(var(--nav-h) + 40px + env(safe-area-inset-bottom));width:calc(100% - 24px);max-width:496px;z-index:60;border:2px solid transparent;border-radius:16px;background:linear-gradient(150deg,var(--marble-a),var(--marble-c)) padding-box,var(--frame) border-box;box-shadow:0 10px 30px #0000008c;animation:slideup .3s ease;overflow:hidden}.install-inner{display:flex;align-items:center;gap:10px;padding:12px 12px 12px 14px}.install-ico{font-size:24px;flex-shrink:0}.install-text{display:flex;flex-direction:column;flex:1;min-width:0}.install-text strong{font-size:14px;color:var(--cream)}.install-text span{font-size:11.5px;color:var(--muted)}.install-btn{flex-shrink:0;border:1.5px solid transparent;background:linear-gradient(180deg,var(--emerald-1),var(--emerald-3)) padding-box,var(--frame) border-box;color:#fff;font-weight:700;font-size:13px;padding:9px 14px;border-radius:11px;text-shadow:0 1px 2px rgba(0,0,0,.5)}.install-btn:active{transform:scale(.97)}.install-x{flex-shrink:0;border:none;background:transparent;color:var(--muted);font-size:14px;padding:6px 8px;border-radius:8px}.install-ios-help{font-size:12.5px;color:var(--cream);background:#2ba89224;padding:10px 14px;line-height:1.45}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}