/* A small, quiet portal in the selected theme's three colors. */
#portal-crossing{padding:28px 0;overflow:hidden}
.portal-ascii{--display-scale:1;display:block;width:max-content;max-width:100%;margin:0 auto 16px;padding:0;overflow:hidden;text-align:left;font:clamp(8px,2.8vw,13px)/1.1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:0;white-space:pre;color:var(--accent)}
.portal-rim{color:var(--accent)}
.portal-stream{color:var(--signal)}
.portal-core{color:var(--warm)}
#portal-crossing p{color:var(--muted);font-size:11px;margin:0}
@media(max-height:600px){#portal-crossing{padding:12px 0}.portal-ascii{font-size:8px;line-height:1;margin-bottom:8px}}
/* Three fixed text layers: only their text changes, never the surrounding layout. */
.portal-ascii{position:relative}
.portal-layer{font-weight:600;display:block;position:absolute;inset:0;white-space:pre;pointer-events:none}
.portal-layer:first-child{position:relative}
/* Gem hues keep a quieter outline, contrasting facets and a pale glint. */
.portal-ascii[data-gem=ruby]{--accent:#e789a2;--signal:#a9c6ed;--warm:#f3d8a1}
.portal-ascii[data-gem=emerald]{--accent:#79cba8;--signal:#db9ec5;--warm:#ece0a5}
.portal-ascii[data-gem=sapphire]{--accent:#86b9ee;--signal:#e9b084;--warm:#d4c8f0}
.portal-ascii[data-gem=amethyst]{--accent:#bb9eea;--signal:#b5cb87;--warm:#f0bca5}
.portal-ascii[data-gem=brilliant]{--accent:#c5e5ed;--signal:#d5a7ce;--warm:#e5d895}
html[data-theme=light] .portal-ascii[data-gem=ruby]{--accent:#9a294b;--signal:#315f98;--warm:#7d5615}
html[data-theme=light] .portal-ascii[data-gem=emerald]{--accent:#206b50;--signal:#8b366c;--warm:#756019}
html[data-theme=light] .portal-ascii[data-gem=sapphire]{--accent:#2e6095;--signal:#92501e;--warm:#6b498f}
html[data-theme=light] .portal-ascii[data-gem=amethyst]{--accent:#694395;--signal:#52691e;--warm:#99482c}
html[data-theme=light] .portal-ascii[data-gem=brilliant]{--accent:#3a677c;--signal:#874d79;--warm:#74601c}
/* Slow facet illumination supplements the moving glyphs without moving the canvas. */
.portal-ascii[data-motion=on] .portal-rim{animation:portal-lustre 8s ease-in-out infinite}
.portal-ascii[data-motion=on] .portal-stream{animation:portal-lustre 6.7s ease-in-out -2s infinite}
.portal-ascii[data-motion=on] .portal-core{animation:portal-lustre 5.3s ease-in-out -3s infinite}
@keyframes portal-lustre{0%,100%{filter:brightness(1)}50%{filter:brightness(1.2)}}
@media(prefers-reduced-motion:reduce){.portal-layer{animation:none!important}}