@font-face{font-family:"M PLUS Rounded 1c";src:url('/fonts/MPLUSRounded1c-400.woff2') format('woff2');font-display:swap}
@font-face{font-family:"M PLUS Rounded 1c";src:url('/fonts/MPLUSRounded1c-800.woff2') format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:"Lilita One";src:url('/fonts/LilitaOne-400.woff2') format('woff2');font-display:swap}
*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.5 var(--fb)}header,main{max-width:1500px;padding:24px;margin:auto}header{padding-bottom:0}nav{display:flex;gap:24px;flex-wrap:wrap}a{color:inherit;text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}h1{font:clamp(32px,4vw,56px)/1.05 var(--fd);margin:18px 0 12px}header p{max-width:70ch}h2{font:30px var(--fd);margin:12px 0 18px}h2 small{font:13px var(--fb);margin-left:10px}h3{font-size:14px;margin:0;padding:10px 16px;background:var(--surface-soft)}.compare-tools{display:flex;gap:14px 28px;align-items:center;flex-wrap:wrap;border-block:1px solid var(--line);padding:14px 0;margin-bottom:24px}.compare-tools label{font-size:14px;font-weight:800}select{margin-left:10px;min-height:44px;font:inherit;background:var(--surface);color:inherit;border:1px solid var(--text-muted);border-radius:8px;padding:8px 10px}.sync-label{display:flex;align-items:center;min-height:44px;gap:6px}input{width:20px;height:20px;accent-color:var(--accent-text)}.compare-tools p{font-size:12px;max-width:38ch;margin:0;color:var(--text-muted)}.comparison{margin-bottom:44px}.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.pair article{min-width:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--ink)}.pair article:last-child h3{background:var(--ink);color:var(--cream)}.frame-window{overflow:hidden;position:relative;background:var(--cream)}.frame-window iframe{display:block;border:0;transform-origin:top left}.comparison[data-width="390"]{max-width:804px;margin-inline:auto}.compare-note{color:var(--text-muted);font-size:13px;text-align:center}:focus-visible{outline:3px solid var(--accent-text);outline-offset:3px}@media(max-width:700px){header,main{padding:16px}.pair{gap:10px}.compare-tools{gap:8px 18px}.compare-tools p{max-width:none}h3{padding:8px;font-size:12px}}
