/* Brand Flare homepage. Shared navigation remains scoped to its dark surface. */
html:has(body.is-home){height:100%;overflow:hidden;background:#000;color-scheme:dark}
html[data-theme] body.is-home{height:100dvh;min-height:0;overflow:hidden;background:#000;color:#eef0f3}
body.is-home #main,body.is-home>footer{display:none!important}
.home-filing{position:absolute;right:clamp(22px,4vw,72px);bottom:max(20px,env(safe-area-inset-bottom));z-index:3;font-size:12px;line-height:1.6;letter-spacing:.04em;color:#9298a3;text-decoration:none}
.home-filing:hover,.home-filing:focus-visible{color:#e6e8ed;text-decoration:underline;text-underline-offset:4px}
@media(max-width:600px){.home-filing{right:20px;bottom:max(12px,env(safe-area-inset-bottom));font-size:11px}}

.brand-home{position:relative;width:100%;height:100vh;height:100dvh;padding-top:var(--header-height,85px);overflow:clip;background:#000;color:#eef0f3;isolation:isolate}
.brand-home[hidden]{display:none}
.brand-composition{position:relative;width:100%;height:100%;max-width:1920px;margin:0 auto;display:grid;grid-template-columns:minmax(0,65fr) minmax(0,35fr);align-items:center;padding:0 clamp(24px,4.2vw,86px) max(22px,4dvh) 0}
.brand-art{position:relative;display:grid;place-items:center;align-self:stretch;min-width:0;min-height:0}
.flare-stage{position:absolute;inset:0;z-index:0;overflow:visible;pointer-events:none;background:transparent;mix-blend-mode:screen}
.flare-stage canvas{display:block;width:100%;height:100%;position:absolute;inset:0;opacity:0;transition:opacity 900ms ease}
.flare-ready .flare-stage canvas,.flare-stage.flare-ready canvas{opacity:1}
.brand-lockup{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(24px,3.4dvh,44px);width:max-content;max-width:94%;padding:0;pointer-events:none;user-select:none;transform:translateY(-1.2dvh)}
.brand-monogram{display:block;flex:none;width:clamp(172px,20dvh,272px);height:auto;overflow:visible;filter:drop-shadow(0 1px 0 #ffffff18);opacity:.94}
html[data-theme] .brand-wordmark{margin:0;padding:0 0 0 .07em;font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-size:clamp(68px,6.6vw,118px);font-weight:600;line-height:1.24;letter-spacing:.07em;white-space:nowrap;color:#e7e9ed;background:linear-gradient(172deg,#fafbfc 6%,#e7e9ed 38%,#b1b7c0 81%,#9fa6b2 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none}

.brand-entry{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;padding-bottom:1.4dvh}
.home-glass{position:absolute;z-index:0;inset:calc(var(--header-height,85px) + 12px) clamp(15px,2.7vw,52px) max(66px,8dvh);pointer-events:none;perspective:1550px;contain:layout style;user-select:none}
.home-glass-plane{position:relative;width:100%;height:100%;transform-style:preserve-3d}
.home-glass-defs{position:absolute;width:0;height:0;overflow:hidden}
.glass-shard{--shard-rx:0deg;--shard-ry:0deg;--shard-z:0px;position:absolute;transform-origin:50% 50%;transform:translateZ(var(--shard-z)) rotateX(var(--shard-rx)) rotateY(var(--shard-ry));backface-visibility:hidden}
.glass-shard-a{left:1.1806%;top:2.25%;width:51.8056%;height:95.375%}
.glass-shard-b{left:52.7778%;top:2.25%;width:33.8889%;height:53%}
.glass-shard-c{left:71.4583%;top:2.25%;width:27.3611%;height:95.375%}
.glass-shard-d{left:41.1806%;top:52.5%;width:37.3611%;height:45.125%}
.home-glass[data-moving=true] .glass-shard{will-change:transform}
.home-glass-surface{display:block;width:100%;height:100%;overflow:visible}
.home-glass .glass-light{opacity:.9}
.home-glass .glass-reflection{opacity:.8}
.home-glass[data-quality=low] .glass-reflection{display:none}
.brand-era{position:absolute;z-index:2;left:clamp(29px,4.2vw,86px);bottom:max(23px,3.1dvh);margin:0;color:#a0aaad;font-family:"Songti SC","STSong","Noto Serif CJK SC","SimSun",serif;font-size:clamp(13px,1.12vw,17px);line-height:1.5;font-weight:400;letter-spacing:.2em;pointer-events:none;user-select:none}
.brand-baseline{display:inline-block;width:0;height:0;padding:0;margin:0;vertical-align:baseline}
.magnetic-entry{--magnet-x:0px;--magnet-y:0px;--label-x:0px;--label-y:0px;--orbit-x:0px;--orbit-y:0px;position:relative;display:grid;place-items:center;width:clamp(202px,20vw,300px);aspect-ratio:1;border-radius:50%;color:#e8e9ec;text-decoration:none;outline:none;cursor:pointer;isolation:isolate;touch-action:manipulation;user-select:none;-webkit-tap-highlight-color:transparent}
.magnetic-orbit{position:absolute;inset:0;border-radius:50%;border:1px solid #959ca647;background:linear-gradient(145deg,#ffffff04,transparent 48%,#ffffff03);box-shadow:0 1px 0 #ffffff08,inset 0 0 18px #ffffff02;transform:translate3d(var(--orbit-x),var(--orbit-y),0);transition:border-color 300ms ease,box-shadow 300ms ease;pointer-events:none}
.magnetic-orbit:after{content:"";position:absolute;inset:-1px;border-radius:inherit;border:1px solid transparent;border-top-color:#c8cdd14d;transform:rotate(-35deg);opacity:.72;pointer-events:none}
.magnetic-disc{position:absolute;inset:13px;border-radius:50%;background:radial-gradient(ellipse at 34% 9%,#202226 0%,#121416 29%,#08090b 65%,#040506 100%);border:1px solid #575c664f;box-shadow:inset 0 1px 1px #ffffff19,inset 0 -1px 1px #000,0 16px 40px #000b;transform:translate3d(var(--magnet-x),var(--magnet-y),0);transition:border-color 300ms ease,box-shadow 300ms ease;pointer-events:none}
.magnetic-disc:before{content:"";position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(114deg,#ffffff03 0px,#ffffff03 1px,transparent 1px,transparent 4px);opacity:.25;pointer-events:none}
.magnetic-disc:after{content:"";position:absolute;inset:-1px;border-radius:inherit;background:radial-gradient(ellipse at 26% 5%,#f2ece018,transparent 65%);opacity:.5;transition:opacity 300ms ease;pointer-events:none}
.magnetic-label{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:clamp(14px,1.2vw,23px);font-size:clamp(20px,1.65vw,28px);font-weight:500;line-height:1.2;letter-spacing:.04em;transform:translate3d(calc(var(--magnet-x) + var(--label-x)),calc(var(--magnet-y) + var(--label-y)),0);text-shadow:0 1px 4px #0006;pointer-events:none}
.magnetic-label svg{display:block;width:1.25em;height:1.25em;stroke:currentColor;fill:none;stroke-width:1.3;overflow:visible}
.magnetic-entry:focus-visible{outline:2px solid #d9dbe1;outline-offset:10px}
.magnetic-entry:focus-visible .magnetic-disc{border-color:#b4b7c18a;box-shadow:inset 0 1px 1px #ffffff30,0 0 42px #c6bfa20a}
.magnetic-entry:active .magnetic-disc{box-shadow:inset 0 2px 12px #0009,0 8px 28px #0007}
@media(hover:hover) and (pointer:fine){
 .magnetic-entry:hover .magnetic-orbit{border-color:#d9d8d378;box-shadow:0 1px 0 #ffffff12,inset 0 0 26px #ffffff03}
 .magnetic-entry:hover .magnetic-disc{border-color:#c8c8c267;box-shadow:inset 0 1px 2px #ffffff30,inset 0 -1px 1px #000,0 16px 40px #000b,0 0 58px #d9d0bb08}
 .magnetic-entry:hover .magnetic-disc:after{opacity:1}
}

/* The homepage is always black; changing theme only changes other pages. */
html[data-theme] body.is-home .header{
 --ui-text:#f0f1f3;--ui-secondary:#c0c4cc;--ui-muted:#a4abb6;
 --ui-raised:#ffffff0c;--ui-line:#ffffff12;--ui-line-strong:#ffffff35;
 --ui-key:#e0e3e8;--ui-key-text:#15171c;--ui-edge:#ffffff0b;
 color:var(--ui-text);color-scheme:dark;background:#000;border-bottom-color:transparent;box-shadow:none
}
html[data-theme] body.is-home .header .site-logo{filter:none}
html[data-theme] body.is-home .header .brand{color:var(--ui-text)}
html[data-theme] body.is-home .header .nav-link{color:var(--ui-secondary)}
html[data-theme] body.is-home .header .nav-link:hover,
html[data-theme] body.is-home .header .nav-link[aria-current=page]{color:var(--ui-text)}
html[data-theme] body.is-home .header .theme-toggle{color:var(--ui-secondary)}
html[data-theme] body.is-home .header .account-button{color:var(--ui-secondary);background:transparent;border-color:var(--ui-line-strong)}
html[data-theme] body.is-home .header .account-button:hover{color:var(--ui-text);background:#ffffff09}
html[data-theme] body.is-home .header .scene-settings-button{color:var(--ui-text)}
html[data-theme] body.is-home .header .publish-link{background:var(--ui-key);color:var(--ui-key-text);border-color:var(--ui-key)}
html[data-theme] body.is-home .header .publish-link:hover{background:#f1f3f6;color:#15171c}

.scene-settings-button{width:36px;height:36px;padding:8px;display:none;place-items:center;background:transparent;color:inherit;border:1px solid #7b839331;border-radius:50%;cursor:pointer;flex:none}
.is-home .scene-settings-button{display:grid}
.scene-settings-button svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.4}
.scene-settings-button:hover{border-color:#a0a6b780;background:#ffffff09}
.scene-settings{position:fixed;z-index:110;right:24px;top:calc(var(--header-height,85px) + 4px);width:min(290px,calc(100vw - 36px));max-height:calc(100dvh - var(--header-height,85px) - 22px);overflow:auto;padding:23px;background:#111215f7;backdrop-filter:blur(18px);border:1px solid #ffffff20;box-shadow:0 20px 60px #0006;border-radius:16px;color:#ece9e2;font-size:15px;color-scheme:dark}
.scene-settings[hidden]{display:none}
.scene-settings label{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px}
.scene-settings select{background:#22252b;border:1px solid #ffffff24;color:#ece9e2;border-radius:8px;font:inherit;padding:9px 5px;max-width:172px}
.scene-settings p{font-size:14px;line-height:1.8;color:#a5a9b2;margin:0 0 18px}
.scene-settings-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #ffffff15;padding-top:15px}
.scene-settings-footer button{background:none;border:0;font:inherit;color:inherit;padding:4px 0;cursor:pointer}
.scene-settings-footer output{font-size:13px;color:#9399a4}

@media(min-width:761px) and (max-height:650px){
 .brand-composition{padding-bottom:14px}
 .brand-lockup{gap:18px;transform:none}
 .brand-monogram{width:clamp(118px,30dvh,170px)}
 html[data-theme] .brand-wordmark{font-size:clamp(54px,11dvh,74px)}
 .magnetic-entry{width:clamp(176px,41dvh,225px)}
}
@media(max-width:1000px) and (min-width:761px){
 .brand-composition{grid-template-columns:minmax(0,61fr) minmax(0,39fr);padding-right:4vw}
 html[data-theme] .brand-wordmark{font-size:clamp(54px,7vw,70px)}
 .brand-monogram{width:clamp(160px,20dvh,218px)}
 .magnetic-entry{width:clamp(192px,25vw,242px)}
}
@media(max-width:760px){
 .brand-composition{grid-template-columns:1fr;grid-template-rows:minmax(0,1.24fr) minmax(0,1fr);padding:0 20px max(54px,7dvh);gap:0}
 .home-glass{inset:calc(var(--header-height,85px) + 8px) 13px max(60px,7dvh);perspective:1200px}
 .home-glass-plane{width:150%;margin-left:-25%}
 .brand-era{left:26px;bottom:max(23px,env(safe-area-inset-bottom));font-size:13px;letter-spacing:.18em}
 .brand-art{align-self:stretch}
 .brand-lockup{gap:20px;transform:translateY(1.5dvh)}
 .brand-monogram{width:clamp(118px,18.6dvh,190px)}
 html[data-theme] .brand-wordmark{font-size:clamp(48px,10.8vw,72px);letter-spacing:.06em;padding-left:.06em}
 .brand-entry{padding:0;align-self:center}
 .magnetic-entry{width:clamp(168px,25dvh,238px)}
 .magnetic-disc{inset:11px}
 .magnetic-label{font-size:21px;gap:18px}
 .scene-settings{right:18px}
 .scene-settings-button{width:32px;height:32px;padding:7px}
}
/* Keep every navigation action reachable without forcing horizontal scroll. */
@media(max-width:600px){
 html[data-theme] body .header{flex-wrap:nowrap;gap:9px}
 html[data-theme] body .header .theme-toggle{margin-left:auto;flex:none}
 html[data-theme] body .header nav{right:116px!important;gap:8px!important}
 html[data-theme] body .header .nav-link{font-size:13px}
 html[data-theme] body .header .publish-link{position:absolute;right:20px;top:79px;height:34px;min-height:34px;padding:7px 10px;margin:0;font-size:12px;gap:0}
 html[data-theme] body .header .publish-link span{display:none}
 html[data-theme] body .header .account-button{font-size:0;width:34px;height:34px;min-height:34px;flex:none;max-width:34px;padding:7px;margin:0;display:grid;place-items:center}
 html[data-theme] body .header .account-button:before{content:'';display:block;width:18px;height:18px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5'%3E%3Ccircle cx='12' cy='8' r='3.4'/%3E%3Cpath d='M5 21v-2a7 7 0 0 1 14 0v2'/%3E%3C/svg%3E") center/contain no-repeat}
}
@media(max-width:380px){
 html[data-theme] body .header nav{left:14px!important;right:104px!important;gap:6px!important}
 html[data-theme] body .header .publish-link{right:14px}
 html[data-theme] .brand-wordmark{font-size:clamp(40px,11vw,48px)}
}
@media(max-width:760px) and (max-height:640px){
 .brand-composition{padding-bottom:48px;grid-template-rows:minmax(0,1.1fr) minmax(0,1fr)}
 .brand-lockup{gap:14px;transform:none}
 .brand-monogram{width:104px}
 html[data-theme] .brand-wordmark{font-size:42px}
 .magnetic-entry{width:154px}
 .magnetic-label{font-size:18px;gap:12px}
}
@media(max-height:500px) and (min-width:600px){
 .brand-composition{grid-template-columns:minmax(0,62fr) minmax(0,38fr);grid-template-rows:1fr;padding:0 24px 34px 0}
 .home-glass{bottom:45px}
 .brand-era{bottom:15px;font-size:12px}
 .brand-lockup{gap:12px;transform:none}
 .brand-monogram{width:clamp(75px,22dvh,108px)}
 html[data-theme] .brand-wordmark{font-size:clamp(36px,10dvh,49px)}
 .brand-entry{padding:0}
 .magnetic-entry{width:clamp(128px,39dvh,178px)}
 .magnetic-disc{inset:9px}
 .magnetic-label{font-size:17px;gap:10px}
}
@media(prefers-reduced-motion:reduce){
 .flare-stage canvas,.magnetic-orbit,.magnetic-disc,.magnetic-disc:after{transition:none}
 .magnetic-orbit,.magnetic-disc,.magnetic-label{transform:none!important}
 .glass-shard{transform:none!important;will-change:auto!important}
}

@media(max-width:600px){.brand-era{bottom:44px}}