html { color-scheme:dark; background:#030710; }
body { margin:0; }
*, *::before, *::after { box-sizing:border-box; }
  #mathis-cosmos .cosmos-page {
    --cosmos-bg:#030710;
    --cosmos-ink:#f6f0e5;
    --cosmos-subtle:#bbc2ce;
    --cosmos-glow:#849fda;
    position:relative; isolation:isolate; overflow:hidden; container-type:inline-size;
    min-height:650px; min-height:max(650px,100svh); padding:26px clamp(24px,4vw,64px) 24px; display:flex; flex-direction:column;
    background:var(--cosmos-bg); color:var(--cosmos-ink); font-family:Arial,Helvetica,sans-serif;
  }
  #mathis-cosmos .cosmos-page * { box-sizing:border-box; }
  #mathis-cosmos .cosmos-sky { position:absolute; inset:0; width:100%; height:100%; z-index:-2; }
  #mathis-cosmos .cosmos-vignette { position:absolute; inset:0; pointer-events:none; z-index:-1; background:linear-gradient(180deg,#03071055,transparent 17%,transparent 75%,#030710b8); }
  #mathis-cosmos .signature-energy { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:-1; }
  html:not([data-reveal]) #mathis-cosmos .signature-energy { display:none; }
  @media(prefers-reduced-motion:reduce) { #mathis-cosmos .signature-energy { display:none !important; } }
  #mathis-cosmos .cosmos-header { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:44px;  }
  #mathis-cosmos .cosmos-actions { display:flex; align-items:center; gap:16px; }
  #mathis-cosmos .cosmos-replay { position:relative; display:inline-flex; align-items:center; justify-content:center; width:32px; min-height:44px; flex:0 0 32px; padding:0; border:0; background:transparent; color:var(--cosmos-subtle); cursor:pointer; }
  #mathis-cosmos .cosmos-replay::before { content:''; position:absolute; width:28px; height:28px; border:1px solid #e5c59a57; border-left-color:transparent; border-bottom-color:#e5c59a12; border-radius:50%; pointer-events:none; opacity:var(--control-light,0); transform:rotate(calc(-30deg + var(--control-light,0)*65deg)); }
  #mathis-cosmos .cosmos-replay[hidden] { display:none; }
  #mathis-cosmos .cosmos-replay:hover { color:var(--cosmos-ink); }
  #mathis-cosmos .cosmos-motion { display:inline-flex; align-items:center; gap:7px; min-height:44px; padding:0; border:0; background:transparent; color:var(--cosmos-subtle); font:12px/1.5 Arial,Helvetica,sans-serif; cursor:pointer; }
  #mathis-cosmos .cosmos-motion[hidden] { display:none; }
  #mathis-cosmos .cosmos-motion:hover { color:var(--cosmos-ink); }
  #mathis-cosmos .motion-play, #mathis-cosmos .cosmos-motion[data-paused="true"] .motion-pause { display:none; }
  #mathis-cosmos .cosmos-motion[data-paused="true"] .motion-play { display:block; }
  #mathis-cosmos .cosmos-monogram { font-family:Georgia,'Times New Roman',serif; font-size:23px; letter-spacing:-1px; color:#eee1ce; text-shadow:0 1px 18px #d9b48424; }
  #mathis-cosmos .cosmos-about { display:inline-flex; align-items:center; gap:11px; min-height:44px; padding:0; border:0; background:transparent; color:var(--cosmos-subtle); font:12px/1.5 Arial,Helvetica,sans-serif; }
  #mathis-cosmos .cosmos-about:hover { color:var(--cosmos-ink); }
  #mathis-cosmos .cosmos-about .about-symbol { font-size:17px; }
  #mathis-cosmos .cosmos-main { display:flex; align-items:center; flex:1; min-height:465px; padding:40px 3.5% 24px; pointer-events:none; }
  #mathis-cosmos h1 { margin:0; font:400 clamp(100px,15cqw,230px)/.91 Georgia,'Times New Roman',serif; letter-spacing:-.075em; color:var(--cosmos-ink); text-shadow:0 2px 32px #01040b99; font-kerning:normal; }
  #mathis-cosmos .cosmos-line { display:block; overflow:visible; white-space:nowrap; padding:.08em .1em .13em; margin:-.08em -.1em -.13em; }
  #mathis-cosmos .cosmos-glyph { display:inline-block; position:relative; transform-origin:50% 78%; }
  #mathis-cosmos .cosmos-line-two { margin-left:.34em; margin-top:.025em; }
  html[data-reveal] #mathis-cosmos .cosmos-glyph, html[data-reveal] #mathis-cosmos .cosmos-spark { visibility:hidden; will-change:transform; }
  html[data-reveal] #mathis-cosmos .cosmos-footer a { visibility:hidden; }
  html[data-reveal] #mathis-cosmos .cosmos-footer a:focus-visible { visibility:visible; transform:none !important; }
  #mathis-cosmos h1 em { font-weight:400; }
  #mathis-cosmos .cosmos-spark { display:inline-block; position:relative; color:#e5b788; transform-origin:50% 78%; }
  #mathis-cosmos .cosmos-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:5px 28px; min-height:48px; }
  #mathis-cosmos .cosmos-footer a { display:inline-flex; align-items:center; gap:12px; min-height:44px; color:var(--cosmos-subtle); text-decoration:none; font-size:12px; line-height:1.5; letter-spacing:.018em; }
  #mathis-cosmos .cosmos-footer a:hover { color:var(--cosmos-ink); }
  #mathis-cosmos .cosmos-footer svg { width:14px; height:14px; }
  #mathis-cosmos .link-label { display:inline-block; position:relative; transform-origin:0 80%; }
  #mathis-cosmos .link-label::after { content:""; position:absolute; left:0; right:0; bottom:-5px; height:1px; background:linear-gradient(90deg,#dfb780,#f4dfbb 58%,#e5b78800); transform:scaleX(var(--link-line,0)); transform-origin:left center; }
  #mathis-cosmos .cosmos-footer a:hover .link-label::after { transform:scaleX(1); }
  #mathis-cosmos .cosmos-about-panel { position:absolute; z-index:3; left:36px; right:36px; bottom:88px; max-width:385px; padding:26px 28px; background:var(--cosmos-bg); color:#c6cdd7; box-shadow:0 22px 70px #0009,inset 0 1px 0 #f4e9d70a; font-size:13px; line-height:1.85; letter-spacing:.01em; }
  #mathis-cosmos .cosmos-about-panel p { margin:0; }
  #mathis-cosmos .cosmos-about-panel p:first-child { color:#e4e0d9; }
  #mathis-cosmos .cosmos-about-panel p+p { margin-top:16px; }
  #mathis-cosmos .cosmos-about-panel[hidden] { display:none; }
  @media(max-width:480px) {
    #mathis-cosmos .cosmos-page { min-height:max(650px,100svh); padding:20px 24px; }
    #mathis-cosmos .cosmos-actions { gap:12px; }
    #mathis-cosmos .cosmos-main { min-height:440px; padding:55px 0 28px; align-items:center; }
    #mathis-cosmos h1 { font-size:clamp(80px,26cqw,120px); }
    #mathis-cosmos .cosmos-footer { flex-direction:column; align-items:flex-start; gap:0; }
    #mathis-cosmos .cosmos-about-panel { left:24px; right:24px; bottom:116px; padding:18px; }
  }

#mathis-cosmos .cosmos-details { display:block; }
#mathis-cosmos .cosmos-about { list-style:none; cursor:pointer; }
#mathis-cosmos .cosmos-about::-webkit-details-marker { display:none; }
#mathis-cosmos .cosmos-about::marker { content:""; }
#mathis-cosmos .cosmos-details[open] .cosmos-about .about-symbol { transform:rotate(45deg); }
#mathis-cosmos .cosmos-about-panel { left:clamp(24px,4vw,64px); right:clamp(24px,4vw,64px); }
#mathis-cosmos a:focus-visible, #mathis-cosmos summary:focus-visible, #mathis-cosmos button:focus-visible { outline:1px solid #d4ba92; outline-offset:7px; border-radius:2px; }
@media(max-width:480px) { #mathis-cosmos .cosmos-about-panel { left:24px; right:24px; } }
@media(prefers-reduced-motion:reduce) {
  #mathis-cosmos .cosmos-glyph, #mathis-cosmos .cosmos-spark, #mathis-cosmos .cosmos-footer a, #mathis-cosmos .link-label, #mathis-cosmos .cosmos-footer svg { visibility:visible !important; transform:none !important; }
}
@media(pointer:coarse) { #mathis-cosmos .cosmos-replay { width:44px; flex-basis:44px; } }
html:not([data-reveal]) #mathis-cosmos .cosmos-glyph,
html:not([data-reveal]) #mathis-cosmos .cosmos-spark,
html:not([data-reveal]) #mathis-cosmos .cosmos-footer a { visibility:visible !important; transform:none !important; }
html:not([data-reveal]) #mathis-cosmos .link-label { clip-path:none !important; }
html:not([data-reveal]) #mathis-cosmos .cosmos-footer svg { transform:none !important; }

/* Inner surfaces stay independent from the entrance choreography. */
#mathis-cosmos .glyph-ink,
#mathis-cosmos .spark-ink,
#mathis-cosmos .monogram-ink,
#mathis-cosmos .about-label,
#mathis-cosmos .about-symbol,
#mathis-cosmos .about-ink { display:inline-block; }
#mathis-cosmos .glyph-ink { pointer-events:auto; transform-origin:50% 72%; will-change:transform; color:var(--ink-color,#f6f0e5); text-shadow:0 2px 26px #01040b99,0 0 19px rgba(236,200,151,var(--ink-light,0)); }
#mathis-cosmos .spark-ink { pointer-events:auto; transform-origin:50% 88%; will-change:transform; }
#mathis-cosmos .cosmos-glyph:hover .glyph-ink { cursor:default; }
#mathis-cosmos .cosmos-monogram { padding:7px 0; }
#mathis-cosmos .monogram-ink { transform-origin:40% 80%; }
#mathis-cosmos .link-orbit { display:inline-flex; align-items:center; justify-content:center; width:14px; height:14px; transform-origin:center; color:#d1ba97; }
#mathis-cosmos .cosmos-footer a,
#mathis-cosmos .cosmos-about,
#mathis-cosmos .cosmos-motion,
#mathis-cosmos .cosmos-replay { transition:color .22s ease; -webkit-tap-highlight-color:transparent; text-shadow:0 0 15px rgba(231,194,144,var(--control-light,0)); }
#mathis-cosmos .link-label::after { transition:transform .42s cubic-bezier(.2,.8,.2,1); }
#mathis-cosmos .cosmos-footer a:focus-visible .link-label::after { transform:scaleX(1); }
#mathis-cosmos .cosmos-about .about-symbol { line-height:1; transform-origin:50% 50%; transition:transform .46s cubic-bezier(.2,1.6,.3,1); }
#mathis-cosmos .about-label { position:relative; }
#mathis-cosmos .about-label::after { content:''; position:absolute; bottom:-5px; left:0; right:0; height:1px; background:linear-gradient(90deg,#e5b78800,#efd4aa 42%,#b69a7466); transform:scaleX(0); transform-origin:right center; transition:transform .4s cubic-bezier(.2,.8,.2,1); }
#mathis-cosmos .cosmos-about:hover .about-label::after,
#mathis-cosmos .cosmos-about:focus-visible .about-label::after,
#mathis-cosmos .cosmos-details[open] .about-label::after { transform:scaleX(1); transform-origin:left center; }
#mathis-cosmos .cosmos-about-panel { overflow:hidden; border:1px solid #becad033; background:radial-gradient(ellipse at var(--panel-x,75%) var(--panel-y,20%),rgba(176,127,71,var(--panel-light,.025)),transparent 72%),linear-gradient(140deg,#15202cfb,#070b13fc 66%,#12141bfd); transform-origin:left bottom; border-radius:3px; }
#mathis-cosmos .cosmos-about-panel::before { content:''; position:absolute; left:-50%; top:0; width:50%; height:2px; background:linear-gradient(90deg,transparent 0%,#e5b78820 24%,#e5b788ad 50%,#e5b78820 76%,transparent 100%); transform:translate3d(0,0,0); will-change:transform,opacity; animation:cosmos-panel-light 7.2s linear infinite; pointer-events:none; }
#mathis-cosmos .cosmos-about-panel::after { content:''; position:absolute; right:14px; bottom:14px; width:18px; height:18px; border-right:1px solid #d8b17f66; border-bottom:1px solid #d8b17f66; opacity:.6; pointer-events:none; }
#mathis-cosmos .cosmos-about-panel .about-ink { transform-origin:left center; }
#mathis-cosmos .cosmos-page[data-interaction-motion='still'] .cosmos-about-panel::before { animation-play-state:paused; }
@keyframes cosmos-panel-light {
  0% { transform:translate3d(0,0,0); opacity:0; }
  12% { opacity:1; }
  88% { opacity:1; }
  100% { transform:translate3d(300%,0,0); opacity:0; }
}
#mathis-cosmos .cosmos-replay svg { transform-box:view-box; transform-origin:50% 50%; overflow:visible; }
@media(prefers-reduced-motion:reduce) {
  #mathis-cosmos .glyph-ink, #mathis-cosmos .spark-ink, #mathis-cosmos .monogram-ink,
  #mathis-cosmos .link-orbit, #mathis-cosmos .about-ink, #mathis-cosmos .about-label,
  #mathis-cosmos .cosmos-motion svg, #mathis-cosmos .cosmos-replay svg { transform:none !important; }
  #mathis-cosmos .cosmos-about-panel::before { animation:none; }
  #mathis-cosmos .cosmos-page * { transition:none !important; }
}

#mathis-cosmos .cosmos-about-panel { transition:border-color .35s ease,box-shadow .45s ease; }
#mathis-cosmos .cosmos-about-panel:hover { border-color:#c7ae8266; box-shadow:0 24px 80px #000a,inset 0 1px 0 #ebd7b91a; }
#mathis-cosmos .cosmos-details:not([open]) .cosmos-about:is(:hover,:focus-visible) .about-symbol { transform:rotate(90deg) scale(1.13); }

/* Keep the disclosure next to its trigger and away from the signature. */
#mathis-cosmos .cosmos-about-panel { top:86px; right:clamp(24px,4vw,64px); bottom:auto; left:auto; width:min(385px,calc(100% - 48px)); transform-origin:right top; }
@media(max-width:480px) { #mathis-cosmos .cosmos-about-panel { top:76px; right:24px; bottom:auto; left:auto; width:calc(100% - 48px); } }

/* A continuous reveal from depth, independent of the living inner surfaces. */
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] :is(.cosmos-glyph,.cosmos-spark,.genesis-link-character,.cosmos-footer svg) {
  visibility:visible;
  transform:var(--genesis-transform,none);
  opacity:var(--genesis-opacity,0);
  will-change:transform,opacity;
}
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .cosmos-glyph {
  transform-origin:var(--genesis-origin,50% 78%);
}
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .glyph-ink {
  text-shadow:0 2px 26px #01040b99,0 0 22px rgba(240,210,163,var(--genesis-glow,0));
}
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .spark-ink {
  text-shadow:0 0 24px rgba(237,191,135,var(--genesis-glow,0));
}
#mathis-cosmos .genesis-link-flow { display:none; position:absolute; inset:0; pointer-events:none; }
#mathis-cosmos .genesis-link-character { position:absolute; top:0; display:block; white-space:pre; line-height:inherit; transform-origin:50% 75%; }
#mathis-cosmos .genesis-link-character::before { content:attr(data-ink-char); }
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .cosmos-footer a { visibility:visible; }
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .link-label[data-genesis-link] { color:transparent; }
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .genesis-link-flow { display:block; color:var(--cosmos-subtle); }
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .cosmos-footer svg {
  transform-box:view-box;
  transform-origin:50% 50%;
  overflow:visible;
}
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .cosmos-footer svg path {
  stroke-dasharray:var(--genesis-dash,none);
  stroke-dashoffset:var(--genesis-stroke,0);
}
html[data-reveal] #mathis-cosmos .cosmos-footer a:is(:hover,:focus-visible) {
  visibility:visible !important;transform:none !important;opacity:1 !important;
}
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .cosmos-footer a:is(:hover,:focus-visible) .link-label { color:inherit; }
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .cosmos-footer a:is(:hover,:focus-visible) .genesis-link-flow { display:none; }
html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .cosmos-footer a:is(:hover,:focus-visible) svg { transform:none !important;opacity:1 !important; }
html[data-reveal] #mathis-cosmos .cosmos-footer a:is(:hover,:focus-visible) svg path { stroke-dashoffset:0 !important; }
@media(prefers-reduced-motion:reduce) {
  html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] :is(.cosmos-glyph,.cosmos-spark,.cosmos-footer a,.cosmos-footer svg) {
    visibility:visible !important;transform:none !important;opacity:1 !important;
  }
  html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .link-label { color:inherit; }
  html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .genesis-link-flow { display:none; }
  html[data-reveal] #mathis-cosmos .cosmos-page[data-genesis] .cosmos-footer svg path { stroke-dashoffset:0; }
}