.seal-page main{padding:clamp(28px,4vw,48px) var(--gutter) 120px;overflow-x:clip}
.seal-intro{text-align:center;display:grid;gap:12px;justify-items:center;margin-bottom:36px}
.seal-intro h1{font:400 clamp(36px,6vw,72px)/1.05 Cinzel,serif;letter-spacing:.08em;margin:0}
.seal-intro p{margin:0;max-width:46ch;color:#cfccd8;font:italic 400 clamp(18px,2.2vw,22px)/1.4 "Cormorant Garamond",serif}
.seal-controls,.seal-page .opts{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.seal-controls button,.seal-page .opts button{font:500 15px/1 "Cormorant Garamond",serif;color:var(--text);background:#16161c;border:1px solid var(--line);border-radius:999px;padding:10px 16px;min-height:44px;cursor:pointer}
.seal-controls button:hover,.seal-page .opts button:hover{border-color:#4a4a58}
.seal-controls button[aria-pressed="true"],.seal-page .opts button[aria-pressed="true"]{border-color:#c9b6ff;background:#221f33}
.seal-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:40px 32px}
.seal-fig{margin:0;display:grid;gap:14px;justify-items:center}
.seal-fig svg{display:block;width:auto;height:auto;max-width:min(100%,520px);max-height:min(520px,calc(100svh - 540px));cursor:pointer}
.seal-paper svg{background:#efeae0;border-radius:24px}
.seal-indigo svg{background:#0c0a1f;border-radius:50%}
.seal-fig figcaption{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center}
.seal-name{font:600 13px Cinzel,serif;letter-spacing:.14em;color:var(--muted)}
.seal-page .disc{fill:#000;stroke:var(--line);stroke-width:1.5}
.seal-page .t-caps{font-family:"Cormorant Garamond",serif;font-weight:600}
.seal-page .t-runes{font-family:Luxrunor,Cinzel,serif;font-synthesis:none}
.seal-page .t-cinzel{font-family:Cinzel,serif}
.seal-page .spin{transform-box:view-box;transform-origin:300px 300px;animation:seal-cw 90s linear infinite}
.seal-page .spin.ccw{animation-name:seal-ccw}
@keyframes seal-cw{to{transform:rotate(1turn)}}
@keyframes seal-ccw{to{transform:rotate(-1turn)}}
.seal-page .coin{width:100%;max-width:520px;animation:seal-flip 8s ease-in-out infinite}
@keyframes seal-flip{0%,40%{transform:scaleX(1)}50%{transform:scaleX(.03)}60%,100%{transform:scaleX(1)}}
.seal-page.paused .spin,.seal-page.paused .coin,.seal-fig.paused .spin,.seal-fig.paused .coin{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){
  .seal-page .spin,.seal-page .coin{animation:none}
  .seal-controls{display:none}
}
html.still .seal-page .spin,html.still .seal-page .coin{animation:none}
html.still .seal-controls{display:none}
