/* Mix comparison page; shared public primitives come from shushulab-public.css. */
.mix-comparison-page{background:radial-gradient(circle at 10% 0%,rgba(255,111,173,.13),transparent 30rem),radial-gradient(circle at 90% 12%,rgba(157,233,215,.14),transparent 30rem),var(--paper)}
.mix-comparison-page .hero{padding:88px 0 66px;border-bottom:var(--line)}
.mix-comparison-page .hero h1{font-size:clamp(44px,7vw,80px);line-height:.96;letter-spacing:-.05em;margin:12px 0 18px;font-weight:1000}
.mix-comparison-page .hero p{max-width:850px;font-size:18px;line-height:1.85;font-weight:720}
.mix-comparison-page .core{margin-top:28px;padding:22px 24px;border:var(--line);border-radius:22px;background:var(--yellow);box-shadow:8px 8px 0 var(--ink);font-size:clamp(20px,3vw,31px);line-height:1.35;font-weight:1000}
.comparison-disclaimer{margin-top:24px;color:var(--muted)}
.mix-comparison-page h2{font-size:clamp(30px,5vw,50px);line-height:1.06;margin:7px 0 24px}.mix-comparison-page h3{font-size:22px;margin:8px 0 10px}.mix-comparison-page p{line-height:1.8;color:var(--muted);font-weight:680}
.ab-card{padding:24px;background:#fff}.ab-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}.ab-head>div{display:grid;gap:4px}.ab-label{font-size:12px;font-weight:1000;letter-spacing:.12em;color:var(--muted)}#active-label{font-size:clamp(20px,3vw,28px)}
.ab-play{min-width:130px}.ab-switch{display:grid;grid-template-columns:1fr 1fr;gap:14px}.ab-choice{appearance:none;border:var(--line);border-radius:20px;background:var(--paper);padding:18px;text-align:left;cursor:pointer;box-shadow:5px 5px 0 var(--ink);color:var(--ink);display:grid;gap:3px}.ab-choice>span{display:inline-grid;place-items:center;width:36px;height:36px;border:2px solid var(--ink);border-radius:999px;background:#fff;font-weight:1000}.ab-choice strong{font-size:24px}.ab-choice small{font-weight:850;color:var(--muted)}.ab-choice.active{background:var(--mint);transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink)}.ab-choice:focus-visible{outline:4px solid var(--purple);outline-offset:3px}
.seek-wrap{display:grid;gap:8px;margin-top:24px;font-weight:900}.seek-wrap input{width:100%;accent-color:var(--ink)}.level-toggle{display:flex;align-items:flex-start;gap:9px;margin-top:20px;font-weight:850;line-height:1.55}.level-toggle input{margin-top:.28em}.level-toggle span{color:var(--muted)}.player-status{margin:12px 0 0;font-size:14px}
.transparency{margin-top:20px;padding:22px;background:#f3f0ff}.method-grid,.proof-grid,.next-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.method-grid article,.next-grid article{padding:22px}.method-tag{display:inline-block;border:2px solid var(--ink);border-radius:999px;background:var(--pink);padding:7px 11px;font-size:12px;font-weight:1000;letter-spacing:.08em}.method-grid article:nth-child(2) .method-tag{background:var(--mint)}
.note{border-left:7px solid var(--purple);background:#f3f0ff;padding:18px 20px;margin:22px 0;font-weight:780;line-height:1.8}.proof-card{overflow:hidden;background:#fff}.proof-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:var(--line)}.proof-card figcaption{padding:16px 18px;display:grid;gap:4px}.proof-card figcaption strong{font-size:13px;letter-spacing:.1em}.proof-card figcaption span{font-weight:800;color:var(--muted)}.proof-copy{margin-top:18px}.rights{border:var(--line);border-radius:22px;background:#fff3f7;padding:22px;box-shadow:8px 8px 0 var(--ink)}
@media(max-width:760px){.mix-comparison-page .hero{padding:60px 0 54px}.ab-head{align-items:stretch;flex-direction:column}.ab-play{width:100%}.ab-switch,.method-grid,.proof-grid,.next-grid{grid-template-columns:1fr}.level-toggle{font-size:14px}}
