:root{--bg-main:#f3f6ee;--bg-panel:#fffef8;--ink:#1e2a22;--muted:#536259;--line:#b8c2b0;--accent:#1f6f4a;--accent-strong:#145739;--danger:#9f2430;--radius:16px}*{box-sizing:border-box}body{min-height:100vh;color:var(--ink);background:radial-gradient(circle at 0 0,#d8e7d4 0%,#0000 35%),radial-gradient(circle at 100% 100%,#e9efe0 0%,#0000 40%),linear-gradient(135deg,#f8fbf3 0%,#eef5ea 100%);flex-direction:column;margin:0;font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,sans-serif;display:flex}.layout{flex:1;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;max-width:1100px;margin:0 auto;padding:24px;display:grid}.panel{background:var(--bg-panel);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:0 18px 40px #233a2a1a}h1,h2{letter-spacing:.02em;margin-top:0;margin-bottom:10px}.lead,.note,.meta,.status{color:var(--muted);margin:0 0 14px}.song-meta{color:var(--muted);margin:-2px 0 6px;font-size:.9rem}.detector-form{gap:10px;display:grid}label{font-size:.95rem;font-weight:700}select,input,button{border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:1rem}select,input{background:#fff}button{color:#fff;background:linear-gradient(135deg, var(--accent), var(--accent-strong));cursor:pointer;border:none;margin-top:8px;font-weight:700;transition:transform .15s,filter .15s}button:hover{filter:brightness(1.05);transform:translateY(-1px)}button:active{transform:translateY(0)}.status.error{color:var(--danger)}.status.success{color:var(--accent)}.result-table{border-collapse:collapse;width:100%;font-size:.94rem}.result-table th,.result-table td{border-bottom:1px solid var(--line);text-align:right;padding:8px 6px}.result-table th:first-child,.result-table td:first-child{text-align:center}.result-table thead th{letter-spacing:.02em;color:var(--muted);font-size:.8rem}.result-table tbody tr.best-pattern{background:#e5f4ea;font-weight:700}.site-footer{width:100%;max-width:1100px;color:var(--muted);margin:0 auto;padding:8px 24px 24px;font-size:.88rem}.site-footer p{margin:6px 0}.site-footer a{color:var(--accent)}@media (width<=900px){.layout{grid-template-columns:1fr;padding:14px}.panel{padding:16px}.site-footer{padding:8px 14px 20px}}
