:root{--bg:#f4f4f4;--surface:#fff;--text:#333;--muted:#8a8a8a;--accent:#fc4d50;--accent-dark:#e03e41;--accent-soft:#fff0f0;--border:#e5e5e5;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,Noto Sans JP,sans-serif;font-size:14px;line-height:1.6}body{background:var(--bg);margin:0}.app{flex-direction:column;min-height:100vh;display:flex}header{background:var(--surface);border-bottom:1px solid var(--border)}header .inner{align-items:center;gap:10px;max-width:960px;margin:0 auto;padding:12px 16px;display:flex}header h1{cursor:pointer;align-items:center;gap:6px;margin:0;font-size:17px;font-weight:700;display:flex}header .mark{background:var(--accent);color:#fff;border-radius:4px;place-items:center;width:26px;height:26px;font-size:14px;display:inline-grid}main{box-sizing:border-box;flex:1;width:100%;max-width:640px;margin:0 auto;padding:24px 16px}.card{background:var(--surface);border:1px solid var(--border);border-radius:4px;margin-bottom:16px;padding:24px 20px}.center{text-align:center}h2{margin:0 0 8px;font-size:18px}.hero h2{font-size:22px}.lead{font-size:15px}.notice{color:var(--muted);margin-top:16px;font-size:12px}.error{color:var(--accent-dark)}.actions{flex-wrap:wrap;justify-content:center;gap:12px;margin:20px 0 8px;display:flex}button,.button{font:inherit;background:var(--surface);color:var(--text);cursor:pointer;border:1px solid #ccc;border-radius:4px;padding:9px 20px;text-decoration:none;display:inline-block}button:hover,.button:hover{background:#fafafa}button.primary,.button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700}button.primary:hover,.button.primary:hover{background:var(--accent-dark)}button.link{color:var(--text);background:0 0;border:none;padding:0 4px;font-size:12px;text-decoration:underline}.options{border:1px solid var(--border);border-radius:4px;flex-wrap:wrap;gap:16px;margin:0 0 16px;display:flex}.options legend{color:var(--muted);padding:0 4px;font-size:12px}.topic{background:var(--accent-soft);border-radius:4px;padding:10px 12px}.topic strong{margin-left:4px;font-size:16px}.meter{background:#eee;border-radius:3px;height:6px;margin:16px 0 4px;overflow:hidden}.meter div{background:var(--accent);height:100%;transition:width 60ms linear}.elapsed{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px}.spinner{border:3px solid #eee;border-top-color:var(--accent);border-radius:50%;width:32px;height:32px;margin:8px auto 12px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.result .this{color:var(--accent);letter-spacing:.05em;margin:0 0 16px;font-size:22px}.pick{color:inherit;flex-direction:column;align-items:center;max-width:300px;margin:0 auto 16px;text-decoration:none;display:flex}.pick img,.pick .noimg{aspect-ratio:1;object-fit:cover;border:1px solid var(--border);background:#eee;border-radius:4px;width:100%}.pick .name{margin-top:10px;font-weight:700}.pick .shop{color:var(--muted);align-items:center;gap:6px;font-size:12px;display:flex}.pick em{color:var(--accent);border:1px solid var(--accent);border-radius:3px;padding:0 4px;font-size:11px;font-style:normal}.toolbar{border-top:1px solid var(--border);flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:24px;padding-top:16px;font-size:13px;display:flex}footer{background:var(--surface);border-top:1px solid var(--border);color:var(--muted);font-size:12px}footer>*{max-width:960px;margin-left:auto;margin-right:auto;padding:0 16px}footer nav{flex-wrap:wrap;gap:8px;padding-top:16px;display:flex}footer p{padding-bottom:16px}.app{isolation:isolate;position:relative}.showcase{z-index:-1;pointer-events:none;opacity:.22;flex-direction:column;justify-content:space-around;gap:12px;padding:12px 0;display:flex;position:fixed;inset:0;overflow:hidden}.showcase:after{content:"";background:radial-gradient(ellipse at center, var(--bg) 20%, transparent 75%);position:absolute;inset:0}.strip{width:max-content;animation:slide var(--duration,80s) linear infinite;gap:12px;display:flex}.strip.reverse{animation-direction:reverse}.strip img{aspect-ratio:1;object-fit:cover;border-radius:4px;height:min(22vh,170px)}@keyframes slide{0%{transform:translate(0)}to{transform:translate(calc(-50% - 6px))}}@media (prefers-reduced-motion:reduce){.strip{animation-duration:calc(var(--duration,80s) * 4)}}header,footer{z-index:1;position:relative}.confidence{color:var(--muted);margin:0 0 12px}.confidence strong{color:var(--accent);font-variant-numeric:tabular-nums;margin-left:6px;font-size:36px}.confidence small{color:var(--accent);margin-left:2px;font-weight:700}.button.share{color:#fff;background:#000;border-color:#000;font-weight:700}.button.share:hover{background:#333}.pick.spinning img{filter:blur(1px)saturate(.8);transform:scale(.97)}.pick.landed img{animation:.52s cubic-bezier(.2,1.4,.4,1) land;box-shadow:0 6px 24px #fc4d5040}.pick.landed .name,.pick.landed .shop{animation:.4s ease-out fadein}@keyframes land{0%{transform:scale(.85)}to{transform:scale(1)}}@keyframes fadein{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.hidden{visibility:hidden}.confidence:not(.hidden){animation:.4s ease-out fadein}.details h3{border-left:3px solid var(--accent);margin:24px 0 8px;padding-left:8px;font-size:15px}.details-head{justify-content:space-between;align-items:center;display:flex}.impressions{flex-wrap:wrap;gap:8px;margin:0;display:flex}.impressions span{background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:4px 12px;font-weight:700}.impressions small{margin-left:6px;font-weight:400}.axes{gap:6px;margin-top:12px;display:grid}.axis{grid-template-columns:4.5em 7em 1fr 7em;align-items:center;gap:6px;font-size:12px;display:grid}.axis .label{font-weight:700}.axis .lo{text-align:right;color:var(--muted)}.axis .hi{color:var(--muted)}.track{background:#f0f0f0;border-radius:5px;height:10px;position:relative}.track:after{content:"";background:#bbb;width:1px;position:absolute;top:-2px;bottom:-2px;left:50%}.bar{background:var(--accent);border-radius:5px;position:absolute;top:0;bottom:0}.bar.pos{left:50%}.bar.neg{background:#f59b9d;right:50%}.ranking{counter-reset:rank;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.ranking li{counter-increment:rank;position:relative}.ranking li:before{content:counter(rank);background:var(--accent);color:#fff;border-radius:3px;padding:0 5px;font-size:11px;font-weight:700;position:absolute;top:4px;left:4px}.ranking a{color:inherit;flex-direction:column;font-size:11px;text-decoration:none;display:flex}.ranking img,.ranking .noimg{aspect-ratio:1;object-fit:cover;border:1px solid var(--border);border-radius:4px;width:100%}.ranking .name{-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:4px;font-weight:700;display:-webkit-box;overflow:hidden}.ranking .shop{color:var(--muted)}.ranking em{color:var(--accent);margin-left:4px;font-style:normal}.steps{padding-left:20px;font-size:13px}.steps li{margin-bottom:6px}.diagram{align-items:center;gap:8px;margin:12px 0;display:flex}.lane{background:#fafafa;border:1px dashed #ccc;border-radius:6px;flex-direction:column;flex:1 1 0;align-items:center;min-width:0;padding:10px;display:flex}.lane-title{color:var(--muted);margin-bottom:6px;font-size:11px;font-weight:700}.node{box-sizing:border-box;background:var(--surface);border:1px solid var(--border);text-align:center;border-radius:4px;width:100%;padding:8px;font-size:12px;font-weight:700}.node small{color:var(--muted);font-size:11px;font-weight:400;display:block}.node.accent{border-color:var(--accent);color:var(--accent)}.node.muted{background:#f4f4f4}.arrow{color:var(--accent);text-align:center;font-weight:700;line-height:1.2}.arrow.side{flex-direction:column;align-items:center;font-size:18px;display:flex}.arrow.side small{color:var(--muted);font-size:10px}@media (width<=520px){.diagram{gap:4px}.lane{padding:6px}.node{padding:6px 4px;font-size:11px}.node small,.lane-title{font-size:10px}.arrow.side{font-size:14px}.axis{grid-template-columns:4em 1fr}.axis .lo,.axis .hi{display:none}}.legal h3{margin:20px 0 6px;font-size:14px}.legal p,.legal li{font-size:13px}.legal ul{padding-left:20px}.node+.node{margin-top:6px}.node.outbound{color:var(--muted);border-style:dashed;font-weight:400}.segmented{border:1px solid var(--border);border-radius:4px;display:inline-flex;overflow:hidden}.segmented button{background:var(--surface);border:none;border-radius:0;padding:6px 12px;font-size:13px}.segmented button+button{border-left:1px solid var(--border)}.segmented button.on{background:var(--accent);color:#fff;font-weight:700}
