:root{--text:#243043;--text-h:#102033;--text-soft:#59697d;--bg:#f4f7fb;--bg-accent:#dce7f5;--panel:#ffffffd1;--panel-highlight:#84b1ff3d;--sample-bg:#f4f8ffeb;--chip-bg:#ffffffb8;--border:#7c94b047;--accent:#2458c6;--accent-soft:#2458c61f;--shadow:0 24px 60px #1b2e5224, 0 8px 20px #1b2e5214;--font-fallback:"Hiragino Sans", "Yu Gothic UI", "Meiryo", sans-serif;font:18px/1.6 var(--font-fallback);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#d5deea;--text-h:#f5f8fc;--text-soft:#9aabbe;--bg:#09111d;--bg-accent:#10243c;--panel:#0a1625d6;--panel-highlight:#3676e43d;--sample-bg:#0d1c2feb;--chip-bg:#102136e0;--border:#80a2ce3d;--accent:#7cb1ff;--accent-soft:#7cb1ff29;--shadow:0 28px 72px #0000006b, 0 12px 24px #00000047}}#root{box-sizing:border-box;min-height:100svh}html{background:radial-gradient(circle at top, var(--bg-accent), transparent 38%), var(--bg)}body{min-width:320px;margin:0}h1{letter-spacing:-.04em;color:var(--text-h);margin:0;font-size:clamp(2rem,4vw,3.5rem);line-height:1.08}p{margin:0}.app-shell{box-sizing:border-box;min-height:100svh;padding:24px}.topbar{border:1px solid var(--border);background:var(--panel);width:min(100%,1360px);box-shadow:var(--shadow);border-radius:24px;justify-content:space-between;align-items:center;gap:16px;margin:0 auto 20px;padding:18px 20px;display:flex}.topbar__eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-size:12px;font-weight:700}.topbar__title{color:var(--text-h);font-size:1.2rem;font-weight:700}.topbar__nav{flex-wrap:wrap;gap:10px;display:flex}.topbar__nav button,.page-card{appearance:none;border:1px solid var(--border);font:inherit;background:var(--chip-bg);color:var(--text-h);cursor:pointer;border-radius:18px;padding:12px 16px;transition:transform .2s,border-color .2s,background-color .2s}.topbar__nav button:hover,.page-card:hover,.font-list button:hover,.font-switch:hover{transform:translateY(-1px)}.topbar__nav button.is-active{border-color:var(--accent);background:var(--accent-soft)}.title-page,.font-page{border:1px solid var(--border);background:linear-gradient(145deg, var(--panel-highlight), transparent 45%), var(--panel);width:min(100%,1360px);box-shadow:var(--shadow);border-radius:32px;margin:0 auto;padding:28px}.title-page{gap:28px;display:grid}.title-hero{gap:14px;display:grid}.title-hero__eyebrow,.font-card__eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-size:13px;font-weight:700}.title-hero__lead,.font-card__lead{max-width:44rem;color:var(--text-soft)}.page-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.page-card{text-align:left;align-content:start;gap:8px;min-height:132px;display:grid}.page-card__name{font-size:1.15rem;font-weight:700}.page-card__description{color:var(--text-soft)}.font-page{grid-template-columns:minmax(0,1.8fr) minmax(280px,360px);align-items:start;gap:24px;display:grid}.font-page__main{min-width:0}.font-card__header{gap:12px;margin-bottom:20px;display:grid}.font-sidebar{gap:16px;display:grid;position:sticky;top:24px}.font-meta{border:1px solid var(--border);background:var(--chip-bg);border-radius:18px;gap:4px;padding:14px 16px;display:inline-grid}.font-meta__label{color:var(--text-soft);font-size:12px}.font-meta__name{color:var(--text-h);font-size:20px;line-height:1.2}.font-filter{border:1px solid var(--border);background:var(--chip-bg);border-radius:20px;gap:12px;padding:16px;display:grid}.font-filter__search{gap:8px;display:grid}.font-filter__label{color:var(--text-soft);font-size:12px;font-weight:700}.font-filter__search input{box-sizing:border-box;border:1px solid var(--border);width:100%;font:inherit;color:var(--text-h);background:var(--sample-bg);border-radius:14px;padding:12px 14px}.font-filter__search input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.font-filter__chips{flex-wrap:wrap;gap:8px;display:flex}.font-filter__chips button{appearance:none;border:1px solid var(--border);font:inherit;background:var(--sample-bg);color:var(--text-soft);cursor:pointer;border-radius:999px;padding:8px 12px}.font-filter__chips button.is-active{color:var(--text-h);border-color:var(--accent);background:var(--accent-soft)}.font-filter__result{color:var(--text-soft);font-size:13px}.font-samples{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.font-sample{background:var(--sample-bg);border:1px solid var(--border);color:var(--text-h);border-radius:24px;gap:12px;min-width:0;padding:22px;display:grid}.font-sample--title,.font-sample--battle{min-height:250px}.font-sample__tag{letter-spacing:.12em;text-transform:uppercase;color:var(--accent);font-size:12px;font-weight:700}.font-sample__main{font-size:clamp(2rem,3.2vw,4rem);line-height:1.12}.font-sample__log{font-size:clamp(1rem,1.4vw,1.2rem)}.font-sample__damage{color:#d94747;text-shadow:0 6px 18px #d947472e;margin-top:auto;font-size:clamp(2.25rem,4vw,4rem);line-height:1}.font-status-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.font-status-grid p{border:1px solid var(--border);background:var(--chip-bg);border-radius:16px;padding:12px 14px}.font-sample__dialogue{font-size:clamp(1rem,1.35vw,1.2rem);line-height:1.8}.font-sample__name{font-size:clamp(1.15rem,1.6vw,1.4rem);font-weight:700}.font-sample__skill-name{font-size:clamp(1.5rem,2.5vw,2.3rem);line-height:1.15}.font-sample__sub{color:var(--text-soft);font-size:clamp(.95rem,1.2vw,1.1rem)}.font-popup-list{gap:12px;display:grid}.font-popup{letter-spacing:.04em;font-size:clamp(1.4rem,2vw,2rem);line-height:1.05}.font-popup--break{color:#e65f4f}.font-popup--damage{color:#f1aa2b}.font-popup--ice{color:#47a9ff}.font-term-list{flex-wrap:wrap;gap:10px;display:flex}.font-term-list p{border:1px solid var(--border);background:var(--chip-bg);border-radius:999px;padding:10px 14px}.font-menu-button{appearance:none;border:1px solid var(--border);font:inherit;color:var(--text-h);background:var(--chip-bg);cursor:pointer;border-radius:16px;justify-self:start;padding:14px 18px}.font-switch{appearance:none;width:100%;font:inherit;color:#f7fbff;cursor:pointer;background:linear-gradient(135deg,#2f6fed,#1546a6);border:none;border-radius:999px;padding:14px 22px;font-weight:700;transition:transform .2s,box-shadow .2s,opacity .2s;box-shadow:0 12px 24px #1546a647}.font-switch:focus-visible,.font-list button:focus-visible,.topbar__nav button:focus-visible,.page-card:focus-visible,.font-menu-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.font-switch:active{opacity:.96;transform:translateY(1px)}.font-switch:disabled{cursor:not-allowed;opacity:.5;box-shadow:none;transform:none}.font-list{grid-template-columns:1fr;gap:10px;margin:0;padding:0;list-style:none;display:grid}.font-list button{appearance:none;border:1px solid var(--border);width:100%;font:inherit;background:var(--chip-bg);color:var(--text-soft);text-align:left;cursor:pointer;border-radius:999px;padding:10px 14px;font-size:14px;transition:border-color .2s,background-color .2s,color .2s,transform .2s}.font-list button.is-active{color:var(--text-h);border-color:var(--accent);background:var(--accent-soft)}.font-list__empty{border:1px dashed var(--border);color:var(--text-soft);background:var(--sample-bg);border-radius:16px;padding:14px 16px}@media (width<=1024px){.font-page{grid-template-columns:1fr}.font-sidebar{position:static}.font-samples{grid-template-columns:1fr}}@media (width<=768px){.app-shell{padding:16px}.topbar,.title-page,.font-page{border-radius:24px;padding:20px}.topbar{flex-direction:column;align-items:start}.page-grid{grid-template-columns:1fr}.font-sample{padding:18px}.font-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.font-menu-button{justify-self:stretch}}