/* 0.3 · 加速旋转开屏；F 偏心四角星 + 金色轨道；紫金平面装饰。 */
.portal-shell{
 --portal-purple:#9268bf;--portal-purple-light:#c4a5e4;
 --portal-purple-deep:#533569;--portal-gold:#d1b77e;
 background:linear-gradient(138deg,#030304 0%,#10100f 29%,#24231f 59%,#454136 100%);color:#f0e9f8;
}
.portal-mode{background:#000}
.scene-chart{position:absolute;inset:0;z-index:-2;overflow:hidden;opacity:1;pointer-events:none;transition:opacity 1s}
.sky-chart{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:none}
.sky-star{fill:#d1b8e7;opacity:.78;stroke:none}
.sky-star.gold{fill:#dfbf7e;opacity:.8}
.sky-orbits{fill:none;stroke:#b898d47a;stroke-width:1}
.sky-orbits ellipse:first-child{stroke:#c2a47166;stroke-width:1.1}
.sky-disc circle:first-child{fill:#8055a337;stroke:#ac82c955}
.sky-disc circle:last-child{fill:#0b080c;stroke:#d1b47744}
.astrolabe-wheel{fill:none;stroke:#9c76bd6b;stroke-width:1;animation:chart-clockwise 250s linear infinite;transform-box:fill-box;transform-origin:center}
.astrolabe-wheel>circle:nth-child(2){stroke:#bda36d80}
.astrolabe-wheel .astrolabe-field{fill:#57376c20;stroke:#a279bf40}
.astrolabe-ticks{stroke:#9c78bb7d;stroke-width:1}
.astrolabe-ticks .major-tick{stroke:#c7ab73c4;stroke-width:1.4}
.astrolabe-section{fill:#9b6fc128;stroke:none}
.astrolabe-section.second{fill:#b49a6224}
.astrolabe-cross{stroke:#ab8ac23d;stroke-dasharray:2 8}
.astrolabe-wheel .inner-orbit{stroke:#b995d442}
.astrolabe-wheel .planet-star{fill:#9367b94d;stroke:#bc91dc70;stroke-width:1}
.astrolabe-wheel .orbit-planet{fill:#ccad70;stroke:none}
.astrolabe-wheel .orbit-planet.small{fill:#a47ac0}
.sky-constellations{stroke:#b795cf61;stroke-width:1;fill:none}
.constellation-nodes{fill:#d8bb82;stroke:none}
.is-intro .scene-chart{opacity:.7}
.is-intro .opening-vortex:before{content:"";position:absolute;width:min(75vw,780px);height:min(75vw,780px);border-radius:50%;background:radial-gradient(ellipse,#0009,transparent 68%)}
.opening-field-shell{width:min(95vw,1040px);height:min(95vw,1040px);position:absolute;transform-origin:center;will-change:transform,opacity}
.opening-ringfield{width:100%;height:100%;position:absolute;fill:none;stroke:#bfa0da85;stroke-width:1;animation:chart-clockwise 160s linear infinite;opacity:1}
.opening-ringfield>circle:nth-child(2){stroke:#c2a67550}
.opening-ringfield>circle:nth-child(3){stroke-dasharray:1 10;stroke:#b899cb6e}
.opening-ringfield>g{stroke:#c3a56d8a;stroke-width:1}
.opening-ringfield .opening-gold-arcs{stroke:#c8ab7980;stroke-width:2}
.opening-ringfield .opening-star-frame{stroke:#a375bd38;stroke-width:1;fill:#6a3e7c08}
.opening-ringfield .opening-orbit-dot{fill:#d1b27a;stroke:none}
.opening-seal{position:absolute;bottom:6%;display:flex;flex-direction:column;align-items:center;gap:13px}
.opening-seal>span{font:17px var(--serif);letter-spacing:.5em;color:#d2b7e6}
.opening-seal>small{font-size:9px;letter-spacing:.4em;color:#b49a6f}
.is-paused .astrolabe-wheel,.is-background .astrolabe-wheel{animation-play-state:paused}
@keyframes chart-clockwise{to{transform:rotate(360deg)}}
.portal-haze{background:none;box-shadow:none;filter:none;opacity:1}
.portal-topline{justify-content:flex-end}
.portal-wordmark{position:absolute;right:9%;bottom:184px;white-space:nowrap;color:#e1cbef;z-index:6;text-shadow:0 1px 7px #08060c}
.portal-tools button{color:#b299ce}
.portal-tools button:hover{color:var(--portal-gold)}
.portal-smallcaps{color:#a28bb9}
.portal-manifesto h1{color:#d9c5f0}
.portal-manifesto h1>span{color:var(--portal-gold)}
.portal-manifesto p{color:#9c83b7}
.portal-invitation{color:#a28cba}

/* Two independent marks: the central mark vanishes before the corner mark appears. */
.portal-sigil{opacity:1;will-change:transform,opacity}
.sigil-arrival-turn{width:100%;height:100%}
.is-intro .sigil-arrival-turn{transform:rotate(var(--arrival-turn,-24deg))}
.sigil-rotator{width:100%;height:100%;animation:sigil-slow-clockwise 180s linear infinite}
.sigil-garnish{position:absolute;left:-35%;top:-35%;width:170%;height:170%;overflow:visible;fill:none;stroke:#c4a56eaa;stroke-width:.75;pointer-events:none;transform-origin:50% 50%;animation:chart-clockwise 210s linear infinite}
.sigil-garnish .garnish-dashes{stroke:#ac85cc80;stroke-dasharray:1 9}
.sigil-garnish>circle:not(.garnish-dashes),.sigil-garnish>path{fill:#ddbd7b;stroke:none}
.sigil-garnish .garnish-purple{fill:#b58bd8}
.sigil-image{animation:none!important;filter:brightness(0) invert(1) drop-shadow(0 0 4px #fff9) drop-shadow(0 0 16px #b48cdd55)}
.sigil-aura{background:none;filter:none;box-shadow:none}
.sigil-halo{border-color:#bb99d68c;box-shadow:none}
.halo-crown{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);fill:none;stroke:none;overflow:visible;transform-origin:50% 50%;animation:chart-clockwise 120s linear infinite reverse}
.crown-base{stroke:#ac84d0a1;stroke-width:2;fill:none}
.crown-band{fill:#ab82d0bc;stroke:none}
.crown-band.band-1{fill:#d9c59d9e}
.crown-band.band-3{fill:#7955a4cc}
.crown-inner-track{stroke:#d3c0e480;stroke-width:1;fill:none}
.crown-ticks{stroke:#bf9ee6cb;stroke-width:1.05}
.crown-ticks .crown-major{stroke:#e9d7b6;stroke-width:1.65}
.crown-outline{stroke:#d2b1e984;stroke-width:1;stroke-dasharray:2 10}
.crown-arcs{stroke:#ead7b1cb;stroke-width:2}
.crown-indices{fill:#d1b3e6;stroke:none;font:7px var(--mono);letter-spacing:.1em}
.crown-jewels{stroke:#ecdcbd;stroke-width:1.5;fill:#24162f}
.crown-jewels .crown-dot{fill:#f0d8a8;stroke:none}
.crown-jewels .crown-star{fill:#cea4ec;stroke:none}
.astrolabe-wheel{opacity:.7}
.sigil-halo:after{border-color:#9b72b62c}
.halo-thread{border-top-color:#c1a2e3b3;border-right-color:#9c73bc33;filter:none;animation-duration:100s;animation-direction:reverse}
.halo-thread.second{border-bottom-color:#caac6e80;opacity:.7;animation-duration:140s;animation-direction:normal}
.halo-satellite{animation-duration:85s;animation-direction:normal}
.halo-satellite:after{background:#d9bb78;box-shadow:none;width:4px;height:4px}
.is-intro .portal-sigil{
 animation:none!important;left:var(--sigil-x);top:var(--sigil-y);
 width:var(--mark-size);height:var(--mark-size);
 opacity:var(--arrival-opacity,0);
 transform:translate(-50%,-50%) scale(var(--arrival-scale,0));
}
.is-intro .sigil-halo{animation:none!important;transform:translate(-50%,-50%)}
.is-intro .portal-ui{opacity:var(--ui-reveal,0);transition:none}
.opening-caption{display:none!important}
.opening-vortex{display:none;position:absolute;inset:0;z-index:8;pointer-events:none}
.is-intro .opening-vortex{display:grid;place-items:center}
.opening-logo{
 position:absolute;width:clamp(220px,23vw,310px);height:clamp(220px,23vw,310px);
 object-fit:contain;filter:brightness(0) invert(1) drop-shadow(0 0 5px #f6edff99) drop-shadow(0 0 18px #ad7ed74d);
 transform-origin:50% 50%;will-change:transform,opacity;
}
.opening-ripples{width:min(88vw,860px);height:min(88vw,860px);overflow:visible;position:absolute;fill:none}
.opening-ripples path{fill:none;stroke:#b38bd7;stroke-width:1.2;stroke-linecap:round;vector-effect:non-scaling-stroke}
.opening-ripples [data-ripple]{opacity:0;transform-origin:0 0}
.opening-ripples [data-ripple="0"] path{stroke:#e2c9fa;stroke-width:1.7}
.opening-ripples [data-ripple="1"] path{stroke:#9b6bc0}
.opening-ripples [data-ripple="2"] path{stroke:#c5a66f;stroke-width:.8}
.is-intro .portal-atmosphere{opacity:0}
.portal-atmosphere{transition:opacity .7s}
.skip-opening{color:#b99acb}

/* Hard-edged flat star. No blur, glow, or translucent light shaft. */
.portal-category{width:180px;height:58px}
.portal-category .beam-shaft{
 position:absolute;left:50%;top:50%;width:265px;height:48px;
 transform:translate(-50%,-50%) rotate(var(--beam-angle));
 background:none!important;border-radius:0;filter:none!important;
 opacity:.94;overflow:visible;transition:width .5s,height .5s,opacity .5s;
 z-index:-1;fill:none;stroke:none;
}
.beam-fill{fill:#a277cd;stroke:none}
.beam-ring{fill:none;stroke:var(--portal-gold);stroke-width:.9;opacity:.85}
.beam-ring ellipse{fill:none;vector-effect:non-scaling-stroke}
.beam-dot{fill:var(--portal-gold);stroke:none}
.beam-label{gap:9px;text-shadow:none!important}
.beam-label>span{color:#f6edff;font-size:18px;letter-spacing:.17em;text-shadow:none}
.beam-label small{color:#d7bb7a;font-size:8px}
.beam-label b{color:#e6c780}
.portal-category.is-near .beam-shaft,.portal-category:focus-visible .beam-shaft{width:338px;height:52px;filter:none!important;opacity:1}
.portal-category.is-near .beam-label,.portal-category:focus-visible .beam-label{color:white;text-shadow:none}
.portal-category.is-near .beam-fill{fill:#a67ed0}
.beam-explanation{border-left-color:#c6a36988;background:linear-gradient(90deg,#130c1eec,#130c1e00)}
.beam-explanation h2{color:#d7b7f2}
.beam-explanation p{color:#b9a6cd}
.has-selection .beam-explanation{pointer-events:auto;cursor:pointer}
.beam-explanation:hover,.beam-explanation:focus-visible{border-left-color:#f1d09e;background:linear-gradient(90deg,#33203bf2,#1c1424d9)}
.beam-explanation:hover h2,.beam-explanation:focus-visible h2{color:#f1ddff}
.explanation-line{background:linear-gradient(90deg,#d0b27e,transparent)}
.explanation-action{color:#d2b779}

/* Flat geometry sits behind the interactive labels. */
.flat-decoration{position:absolute;pointer-events:none}
.flat-decoration.circle{border:1px solid #b496d594;border-radius:50%;background:none}
.circle-one{width:250px;height:250px;right:5.5%;top:42%}
.circle-two{width:82px;height:82px;right:32%;top:13%}
.circle-three{width:38px;height:38px;right:42%;bottom:22%;border-color:#d9bb7ea6!important}
.flat-decoration.disc{border-radius:50%;background:#7c50a367}
.disc-one{width:65px;height:65px;right:18%;top:11%}
.disc-two{width:18px;height:18px;right:43%;top:40%;background:#c7a56c55!important}
.flat-decoration.star{clip-path:polygon(50% 0,59% 41%,100% 50%,59% 59%,50% 100%,41% 59%,0 50%,41% 41%);background:#a572cf91}
.star-one{width:91px;height:91px;right:12.5%;top:51%;transform:rotate(12deg)}
.star-two{width:25px;height:25px;right:36%;top:10%;background:#d1b273c4!important}
.star-three{width:38px;height:38px;right:44%;bottom:28%;transform:rotate(13deg)}
.star-four{width:17px;height:17px;right:6%;top:25%;background:#d8b97bc4!important}
.star-five{width:35px;height:35px;right:26%;bottom:15%;transform:rotate(18deg)}
.orbit-cross{width:150px;height:56px;right:20%;top:65%;border:1px solid #d3b57d99;border-radius:50%;transform:rotate(-23deg)}
.orbit-cross i{position:absolute;right:8%;top:6%;width:5px;height:5px;background:#d4b575;border-radius:50%}
.gold-bubble{border:1.15px solid #e2c78ac9;background:#d7ba7a0a;box-shadow:none}
.gold-word{color:#b89e73}
.portal-player{color:#cdb7df}
.audio-play{border-color:#a171c166;background:#5c357d17}
.audio-play:not(:disabled):hover{border-color:var(--portal-gold);box-shadow:none;color:var(--portal-gold)}
.audio-play:disabled{opacity:.55}
.track-info>span:last-child{color:#b09b7d}
.track-info i{color:#766285}
.portal-player input[type=range]{background:linear-gradient(90deg,#c8ae74 var(--played),#82609877 var(--played))}
.portal-player input[type=range]::-webkit-slider-thumb{background:#cfb77f;box-shadow:none}
.track-subline{color:#977eac}
.player-volume svg{color:#bc9fd2}
.sound-bars i{background:#b58bcb88}
.portal-bottomline{color:#8d749e}
.portal-bottomline button{color:#c0a6d0}
.motion-indicator{border-color:#c5a670}
.is-paused .motion-indicator{background:#c5a670}
.portal-shell.is-paused .sigil-rotator,.portal-shell.is-background .sigil-rotator{animation-play-state:paused}
.portal-shell.is-paused .halo-crown,.portal-shell.is-background .halo-crown{animation-play-state:paused}
.portal-shell.is-paused .sigil-garnish,.portal-shell.is-background .sigil-garnish{animation-play-state:paused}
.portal-mode dialog{background:#120c1c;border-color:#73538d}
.portal-mode .search-result:hover{background:#9b6dc51a}
.portal-mode .search-count,.portal-mode .search-result small{color:#c1a4d5}
.portal-category .beam-shaft{
 filter:drop-shadow(0 0 3px #c89be9a6) drop-shadow(0 0 12px #a46bdc69)!important;
}
.portal-category.is-near .beam-shaft,.portal-category:focus-visible .beam-shaft{
 filter:drop-shadow(0 0 5px #e5c6ffd1) drop-shadow(0 0 21px #b17ce091)!important;
}
.halo-crown{filter:drop-shadow(0 0 3px #d0b2ee8c) drop-shadow(0 0 13px #a977d566)}
.sigil-halo{box-shadow:0 0 19px #ba8fdf42,inset 0 0 12px #af85d326}
.sigil-image{filter:brightness(0) invert(1) drop-shadow(0 0 5px #fffc) drop-shadow(0 0 13px #fff1ff8c) drop-shadow(0 0 33px #ba80e080)}
.opening-logo{filter:brightness(0) invert(1) drop-shadow(0 0 6px #fffc) drop-shadow(0 0 15px #fff0ff80) drop-shadow(0 0 35px #b97fe075)}
@keyframes sigil-slow-clockwise{to{transform:rotate(360deg)}}
@keyframes bubble-rise{
 0%{transform:translate3d(0,0,0);opacity:0}
 12%{opacity:.65}
 65%{opacity:.55}
 87%{opacity:.3}
 100%{transform:translate3d(var(--drift),-110vh,0);opacity:0}
}
@media(max-width:1050px){
 .portal-category .beam-shaft{width:225px;height:44px}
 .portal-category.is-near .beam-shaft{width:290px;height:48px}
 .circle-one{width:180px;height:180px;right:1%}
 .circle-two{width:60px;height:60px;right:30%;top:12%}
 .star-one{width:70px;height:70px;right:8%;top:52%}
}
@media(max-width:700px){
 .portal-wordmark{right:24px;bottom:163px}
 .scene-chart{opacity:.77}
 .is-intro .scene-chart{opacity:.62}
 .sky-orbits{stroke-width:1.3}
 .opening-field-shell{width:135vw;height:135vw}
 .opening-ringfield{width:100%;height:100%}
 .opening-seal{bottom:8%}
 .opening-seal>span{font-size:14px}
 .portal-category{width:136px;height:55px}
 .portal-category .beam-shaft{width:178px;height:40px}
 .portal-category.is-near .beam-shaft,.portal-category:focus-visible .beam-shaft{width:224px;height:44px}
 .beam-label>span{font-size:16px;letter-spacing:.11em}
 .beam-label small{font-size:7px}
 .beam-explanation{background:linear-gradient(90deg,#150d20f5,#150d20e0)}
 .circle-one{width:150px;height:150px;right:-54px;top:42%}
 .circle-two{width:44px;height:44px;right:26%;top:10%}
 .circle-three{width:29px;height:29px;right:42%;bottom:25%}
 .disc-one{width:40px;height:40px;right:12%;top:11%;opacity:.6}
 .disc-two{right:10%;top:68%;width:8px;height:8px}
 .star-one{width:62px;height:62px;right:10%;top:60%}
 .star-two{right:39%;top:8%;width:18px;height:18px}
 .star-three{right:47%;bottom:22%;width:25px;height:25px}
 .star-four{right:7%;top:36%;width:12px;height:12px}
 .star-five{right:33%;bottom:31%;width:20px;height:20px}
 .orbit-cross{right:7%;top:56%;width:82px;height:33px}
 .opening-logo{width:235px;height:235px}
 .opening-ripples{width:95vw;height:95vw}
 .portal-manifesto h1{font-size:14px}
}
@media(prefers-reduced-motion:reduce){
 .opening-vortex{display:none!important}
 .portal-sigil{opacity:1!important;transform:translate(-50%,-50%)!important}
 .sigil-rotator{animation:none!important}
}
