:root{color-scheme:only light;--surface:#fff;--ink:#38443e;--muted:#48564d;--line:#dedede}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--surface);color:var(--ink);font:16px/1.65 'Helvetica Neue',Helvetica,Arial,sans-serif;isolation:isolate}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:5px}
a:focus-visible,summary:focus-visible{outline:2px solid #38443e;outline-offset:5px}
.skip{position:fixed;top:-80px;left:20px;z-index:10;padding:12px;background:white}.skip:focus{top:10px}
.atmosphere{position:fixed;inset:0;z-index:0;pointer-events:none;background:var(--surface)}
#fog-canvas{position:absolute;inset:-18px;width:calc(100% + 36px);height:calc(100% + 36px);z-index:2;pointer-events:none;filter:blur(17px)}
/* Native cursor: movement is independent of JavaScript and canvas rendering. */
@media(pointer:fine){
  html,body{cursor:url("cursor-ring.svg") 28 28,auto}
  :root a,:root button,:root summary{cursor:url("cursor-ring.svg") 28 28,pointer}
}
#particles-js{position:relative;z-index:1}
#particles-js,#particles-js canvas{display:block;width:100%;height:100%}
header,main,footer{position:relative;z-index:1}
header{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:25px 5%;background:transparent}
header::before{content:"";position:absolute;inset:0 0 -160px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 52% 85% at 12% 0%,rgba(205,218,225,.68),transparent 100%),radial-gradient(ellipse 48% 75% at 76% 4%,rgba(216,226,231,.56),transparent 100%),radial-gradient(ellipse 28% 55% at 46% 17%,rgba(228,235,239,.37),transparent 100%),linear-gradient(to bottom,rgba(223,232,237,.32),rgba(230,237,240,.12) 45%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.98) 24%,rgba(0,0,0,.71) 50%,rgba(0,0,0,.28) 78%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.98) 24%,rgba(0,0,0,.71) 50%,rgba(0,0,0,.28) 78%,transparent 100%)}
.logo{display:inline-flex;align-items:center;flex:none}
.logo img{display:block;width:152px;height:auto}
.primary-nav{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:clamp(18px,2.5vw,42px);margin-left:auto}
.primary-nav a{font-size:14px;line-height:1.3;white-space:nowrap}
.lang-switch{display:flex;align-items:center;gap:13px;flex:none;padding-left:23px;border-left:1px solid var(--line)}
:is(.lang-switch,.language-picker) a{font-size:12px;line-height:1.5;color:#48564d;letter-spacing:.05em}
:is(.lang-switch,.language-picker) a[aria-current="page"]{color:var(--ink);text-decoration:underline;text-underline-offset:5px}
body:lang(zh-Hant){font-family:'Noto Sans CJK TC','Microsoft JhengHei','PingFang TC','Heiti TC',sans-serif;line-height:1.75}
body:lang(zh-Hant) .hero h1{font-family:'Noto Serif CJK TC','Songti TC','PMingLiU',serif;letter-spacing:.04em;line-height:1.35}
.hero{padding:0 5%;min-height:min(740px,calc(100svh - 102px));display:flex;flex-direction:column}
.hero-layout{width:100%;max-width:1400px;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 250px;align-items:center;gap:7%;padding:90px 0 105px;flex:1}
.hero-message{max-width:720px}
.eyebrow,.section-label,.hero-aside{font-size:12px;letter-spacing:.06em;color:var(--muted)}
.hero h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(32px,3.8vw,50px);line-height:1.22;font-weight:400;letter-spacing:.018em;margin:32px 0}
.hero-message p{max-width:570px;margin:0;color:#46534a;font-size:clamp(17px,1.45vw,20px);line-height:1.75}
.hero-intro span{display:block}.hero-intro span+span{margin-top:.45em}
.text-link{display:inline-block;margin-top:34px;font-size:14px;text-decoration:underline;text-underline-offset:6px}
.hero-aside{display:flex;flex-direction:column;gap:0;align-self:center;border-top:1px solid #bfbfbf;letter-spacing:.025em}
.hero-aside span{padding:20px 0;border-bottom:1px solid var(--line)}
.chinese{font-size:14px;letter-spacing:.03em}
.section{padding:95px 5%;display:grid;grid-template-columns:28% minmax(0,72%);border-top:1px solid var(--line)}
.section-label{padding-top:5px;line-height:1.6}
.section h2,.contact h2{font-size:clamp(27px,2.4vw,34px);font-weight:300;line-height:1.25;letter-spacing:.018em;margin:0 0 32px}
.studio-columns{max-width:720px}.studio-columns p{margin:0 0 20px;line-height:1.85;color:#48564d}
.practice-list article{display:flex;align-items:baseline;gap:26px;padding:27px 0;border-top:1px solid var(--line);scroll-margin-top:110px}
.practice-list article>span:first-child{font-size:12px;color:#48564d}
.practice-list article>div{flex:1}.practice-list h3{font-size:21px;line-height:1.4;font-weight:300;letter-spacing:.018em;margin:0 0 10px}
.practice-list p{max-width:560px;margin:0;color:#48564d;line-height:1.8}
.discipline{font-family:serif;font-size:27px;color:#48564d}
.project-list{position:relative;padding-left:34px}.project-list::before{content:"";position:absolute;left:7px;top:18px;bottom:20px;width:2px;background:linear-gradient(#b4c1c7,#cdd5d8 62%,#e0e4e5)}
.project-list details{position:relative;border-top:1px solid var(--line)}.project-list details::before{content:"";position:absolute;left:-32px;top:37px;width:12px;height:12px;border:2px solid #9cabb1;border-radius:50%;background:#fff;z-index:1}.project-list details:last-child{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:20px;padding:30px 0}summary::-webkit-details-marker{display:none}
.timeline-phase{align-self:flex-start;padding-top:6px;min-width:116px;font-size:12px;line-height:1.4;color:#48564d}.project-title{font-size:21px;line-height:1.4;letter-spacing:.018em;font-weight:300;flex:1}
.project-title small{display:block;margin-top:8px;color:#48564d;font-size:14px;line-height:1.7;letter-spacing:0}
.plus{font-size:20px;font-weight:300;transition:transform .2s}details[open] .plus{transform:rotate(45deg)}
.project-copy{max-width:710px;padding:0 15px 25px 40px}.project-copy p{margin:0 0 15px;color:#48564d;line-height:1.85}
.project-copy.featured{max-width:710px}
.book-follow{display:inline-flex;align-items:center;gap:9px;margin-top:12px;padding:7px 0;color:#496457;font-size:14px;text-decoration:underline;text-underline-offset:5px}.book-follow svg{width:19px;height:19px;flex:none}
.contact{padding:85px 5% 30px;display:grid;grid-template-columns:28% minmax(0,72%);border-top:1px solid var(--line)}
.contact .section-label{grid-column:1;grid-row:1}.contact h2,.contact .email,.social-links,.contact-bottom{grid-column:2}
.email{justify-self:start;font-size:16px;text-decoration:underline;text-underline-offset:5px}.email span{margin-left:6px;font-size:13px}
.social-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.social-links a{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid rgba(182,197,205,.52);border-radius:14px;background:rgba(237,243,246,.38);backdrop-filter:blur(12px) saturate(1.25);-webkit-backdrop-filter:blur(12px) saturate(1.25);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 6px 20px rgba(81,105,119,.07);color:#405a4d;transition:background .2s,transform .2s}
.social-links a:hover{background:rgba(224,235,241,.7);transform:translateY(-2px);text-decoration:none}.social-links svg{display:block;width:23px;height:23px;flex:none}
.contact-bottom{display:flex;justify-content:space-between;gap:24px;margin:60px 0 35px;font-size:14px;color:#48564d}
footer{display:flex;align-items:center;justify-content:space-between;gap:25px;margin:0 5%;padding:28px 0;border-top:1px solid var(--line);font-size:12px;color:#48564d}footer .logo img{width:125px}
.legal-nav{display:flex;gap:18px;flex-wrap:wrap}.legal-nav a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:900px){.section,.contact{grid-template-columns:1fr;gap:24px}.contact .section-label,.contact h2,.contact .email,.social-links,.contact-bottom{grid-column:1}.contact .section-label{margin-bottom:4px}.hero-layout{grid-template-columns:minmax(0,1fr) 180px;gap:4%}}
@media(max-width:650px){html{scroll-padding-top:120px}header{padding:19px 6% 15px;flex-wrap:wrap;gap:17px}.logo img{width:125px}.lang-switch{order:2;margin-left:auto;padding-left:0;border-left:0}.primary-nav{order:3;width:100%;margin-left:0;justify-content:space-between;gap:10px 16px;padding-top:13px;border-top:1px solid var(--line)}.primary-nav a{font-size:13px}.hero{padding:0 6%;min-height:600px}.hero-layout{grid-template-columns:1fr;gap:60px;padding:85px 0 70px}.hero h1{font-size:clamp(31px,7vw,39px);margin:23px 0}.hero-aside{display:grid;grid-template-columns:repeat(3,1fr);align-self:auto;gap:14px;font-size:11px}.hero-aside span{padding:13px 0}.section{padding:65px 6%;gap:25px}.section h2{font-size:28px}.practice-list article{gap:17px}.practice-list h3{font-size:20px}.project-title{font-size:19px}summary{gap:12px;flex-wrap:wrap}.project-title{min-width:65%}.plus{margin-left:auto}.project-copy,.project-copy.featured{padding-left:25px;padding-right:0}.project-copy.featured{display:block}.contact{padding:65px 6% 10px}.contact-bottom{margin-top:55px;flex-direction:column}footer{margin:0 6%;flex-wrap:wrap;align-items:flex-start}footer>span:last-child{width:100%}}
@media(max-width:390px){.primary-nav{gap:9px}.primary-nav a{font-size:12px}.hero-aside{display:none}}
@media(max-width:650px){body:lang(zh-Hant) .hero h1{font-size:clamp(28px,6.8vw,38px)}}
@media(max-width:650px){.timeline-phase{width:100%;padding:0}.project-list details::before{top:35px}.project-copy,.project-copy.featured{padding-left:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Keep the fog present at the very top edge and give the book copy a quieter scale. */
header::before{top:-32px;background-color:rgba(226,234,238,.18)}
.book-description p{font-size:15px;line-height:1.75}
@media(max-width:650px){header::before{top:-24px}.book-description p{font-size:15px}}

body:lang(zh-Hant) .hero h1{letter-spacing:.05em}
@media(max-width:650px){.hero h1{letter-spacing:.012em}}

body:lang(zh-Hant) :is(.section h2,.contact h2,.practice-list h3,.project-title){letter-spacing:.05em}
@media(max-width:650px){:is(.section h2,.contact h2,.practice-list h3,.project-title){letter-spacing:.012em}}

/* Adapt the complete scene together, including the canvas fog. */
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]){color-scheme:only dark;--surface:#171d1b;--ink:#edf3ee;--muted:#c5d2c9;--line:#62716a}
  :root:not([data-theme="light"]) :is(:is(.lang-switch,.language-picker) a,.hero-message p,.studio-columns p,.practice-list article>span:first-child,.practice-list p,.discipline,.timeline-phase,.project-title small,.project-copy p,.contact-bottom,footer){color:var(--muted)}
  :root:not([data-theme="light"]) a:focus-visible,summary:focus-visible{outline-color:var(--ink)}
  :root:not([data-theme="light"]) .skip{background:var(--surface)}
  :root:not([data-theme="light"]) #fog-canvas{filter:blur(17px) brightness(.28)}
  :root:not([data-theme="light"]) #particles-js{filter:invert(1)}
  :root:not([data-theme="light"]) header::before{background:radial-gradient(ellipse at 30% 0%,rgba(67,88,80,.5),transparent 75%)}
  :root:not([data-theme="light"]) .hero-aside{border-top-color:var(--line)}
  :root:not([data-theme="light"]) .project-list::before{background:var(--line)}
  :root:not([data-theme="light"]) .project-list details::before{background:var(--surface);border-color:var(--muted)}
  :root:not([data-theme="light"]) .book-follow{color:#c4e0cf}
  :root:not([data-theme="light"]) .social-links a{background:rgba(32,46,39,.8);border-color:var(--line);color:var(--ink);box-shadow:none}
  :root:not([data-theme="light"]) .social-links a:hover{background:#34483d}
}

  :root[data-theme="dark"]{color-scheme:only dark;--surface:#171d1b;--ink:#edf3ee;--muted:#c5d2c9;--line:#62716a}
  :root[data-theme="dark"] :is(:is(.lang-switch,.language-picker) a,.hero-message p,.studio-columns p,.practice-list article>span:first-child,.practice-list p,.discipline,.timeline-phase,.project-title small,.project-copy p,.contact-bottom,footer){color:var(--muted)}
  :root[data-theme="dark"] a:focus-visible,summary:focus-visible{outline-color:var(--ink)}
  :root[data-theme="dark"] .skip{background:var(--surface)}
  :root[data-theme="dark"] #fog-canvas{filter:blur(17px) brightness(.28)}
  :root[data-theme="dark"] #particles-js{filter:invert(1)}
  :root[data-theme="dark"] header::before{background:radial-gradient(ellipse at 30% 0%,rgba(67,88,80,.5),transparent 75%)}
  :root[data-theme="dark"] .hero-aside{border-top-color:var(--line)}
  :root[data-theme="dark"] .project-list::before{background:var(--line)}
  :root[data-theme="dark"] .project-list details::before{background:var(--surface);border-color:var(--muted)}
  :root[data-theme="dark"] .book-follow{color:#c4e0cf}
  :root[data-theme="dark"] .social-links a{background:rgba(32,46,39,.8);border-color:var(--line);color:var(--ink);box-shadow:none}
  :root[data-theme="dark"] .social-links a:hover{background:#34483d}

.theme-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:56px;height:56px;padding:14px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);cursor:pointer}
.theme-toggle[hidden]{display:none}
.theme-toggle svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.theme-toggle:hover{border-color:var(--ink)}
.theme-sun{display:none}
:root[data-theme="dark"] .theme-sun{display:block}
:root[data-theme="dark"] .theme-moon{display:none}

/* Transparent padding enlarges real targets without intercepting nearby links. */
.logo{min-height:44px}
.primary-nav{gap:clamp(8px,1.5vw,24px)}
.primary-nav a{display:inline-flex;align-items:center;justify-content:center;min-width:56px;min-height:56px;padding:14px 12px;font-size:18px}
.lang-switch{gap:4px;padding-left:16px}
:is(.lang-switch,.language-picker) a{display:inline-flex;align-items:center;justify-content:center;min-width:56px;min-height:56px;padding:14px 10px;font-size:16px}
:is(.text-link,.book-follow,.email,.contact-bottom>a,.legal-nav a){display:inline-flex;align-items:center;min-width:44px;min-height:44px;padding:10px 8px}
.text-link,.book-follow{font-size:16px}
.email{font-size:17px}
.legal-nav a{font-size:inherit;min-height:52px;padding:12px}
.social-links a{width:48px;height:48px}
.social-links svg{width:25px;height:25px}
summary{min-height:48px}
@media(max-width:1100px){header{flex-wrap:wrap;gap:16px}.primary-nav{order:3;width:100%;justify-content:space-between}.lang-switch{margin-left:auto}}
@media(max-width:650px){.primary-nav{gap:4px 8px;justify-content:flex-start}.primary-nav a{font-size:17px}.lang-switch{padding-left:0}.legal-nav{gap:8px}.contact-bottom>a{align-self:flex-start}}

/* Separate the two rows visually while preserving the original water artwork. */
.logo-spaced{position:relative;display:block;width:152px;height:calc(152px * 873 / 1801 + 5px)}
.logo .logo-spaced img{position:absolute;left:0;top:0;width:100%;height:auto}
.logo-title{clip-path:inset(0 0 33% 0)}
.logo-tagline{clip-path:inset(67% 0 0 0);transform:translateY(5px)}
footer .logo-spaced{width:125px;height:calc(125px * 873 / 1801 + 5px)}
@media(max-width:650px){.logo-spaced{width:125px;height:calc(125px * 873 / 1801 + 5px)}}

/* Cloud opacity now provides the changing star occlusion directly. */
:root #fog-canvas,:root[data-theme="dark"] #fog-canvas,:root:not([data-theme="light"]) #fog-canvas{filter:blur(17px)}

/* Language-sensitive tracking throughout navigation and editorial text. */
body{letter-spacing:.012em}
.primary-nav a{letter-spacing:.035em}
body:lang(zh-Hant){letter-spacing:.045em}
body:lang(zh-Hant) .primary-nav a{letter-spacing:.10em}
body:lang(zh-Hant) :is(h1,h2,h3,.project-title){letter-spacing:.08em}
body:lang(zh-Hant) .project-title small{letter-spacing:.04em}
body:lang(zh-Hant) :is(.text-link,.book-follow,.legal-nav a){letter-spacing:.06em}
.email{letter-spacing:.015em}
@media(max-width:650px){body:lang(zh-Hant) .primary-nav a{letter-spacing:.085em;padding-inline:9px}}

.logo-spaced{width:140px;height:calc(140px * 873 / 1801 + 5px)}
footer .logo-spaced{width:115px;height:calc(115px * 873 / 1801 + 5px)}
@media(max-width:650px){.logo-spaced{width:115px;height:calc(115px * 873 / 1801 + 5px)}}

.logo-title{clip-path:inset(0 38.4% 33% 0)}
.logo-a{clip-path:inset(0 21.4% 33% 61.6%);transform:translateX(1.67%)}
.logo-b{clip-path:inset(0 0 33% 78.6%)}

/* Slightly smaller logo, with proportional glyph spacing. */
.logo-spaced{width:130px;height:calc(130px * 873 / 1801 + 5px)}
footer .logo-spaced{width:107px;height:calc(107px * 873 / 1801 + 5px)}
@media(max-width:650px){.logo-spaced{width:107px;height:calc(107px * 873 / 1801 + 5px)}}

/* A lighter main mark lets the scene show through; subtitle remains readable. */
.logo .logo-spaced :is(.logo-title,.logo-a,.logo-b){width:90%;left:5%;opacity:.67}

.oslab-cursor-aura{position:fixed;left:0;top:0;width:30px;height:30px;transform:translate(-50%,-50%);pointer-events:none;z-index:2147483646;border:1px solid rgba(183,166,214,.25);border-radius:50%;background:radial-gradient(circle,transparent 40%,rgba(166,143,206,.045) 70%,transparent);box-shadow:0 0 9px rgba(166,143,206,.07);opacity:0;transition:width .24s,height .24s,opacity .18s,border-color .24s}
.oslab-cursor-aura.visible{opacity:1}
.oslab-cursor-aura.interactive{width:48px;height:48px;border-color:rgba(183,166,214,.4);background:rgba(180,167,210,.035)}
@media(hover:hover) and (pointer:fine){.primary-nav a{transition:color .2s,transform .2s}.primary-nav a:hover{transform:translateY(-1px);text-decoration:none}.book-follow:hover{opacity:.8}}
@media(prefers-reduced-motion:reduce){.oslab-cursor-aura{display:none}.primary-nav a:hover{transform:none}}

.logo-a{transform:none}

/* Refined hierarchy and compact controls with comfortable hit areas. */
body{font-size:16px;line-height:1.75}
.primary-nav a{font-size:15px;font-weight:400;min-height:44px;min-width:44px;padding:10px 8px}
.primary-nav{gap:clamp(12px,2vw,28px)}
.lang-switch{gap:0;padding-left:12px}
:is(.lang-switch,.language-picker) a{font-size:12px;min-width:40px;min-height:44px;padding:10px 6px;letter-spacing:.04em}
:is(.lang-switch,.language-picker) a[aria-current="page"]{text-decoration:none;position:relative}
:is(.lang-switch,.language-picker) a[aria-current="page"]::after{content:'';position:absolute;bottom:9px;left:calc(50% - 7px);width:14px;height:1px;background:currentColor;opacity:.65}
.theme-toggle{width:44px;height:44px;padding:12px;border:0;margin-left:5px}
.theme-toggle svg{width:19px;height:19px;stroke-width:1.35}
.theme-toggle:hover{background:rgba(147,157,151,.08)}
.hero-message p{font-size:17px;line-height:1.85}
.section h2,.contact h2{font-size:clamp(25px,2.3vw,32px)}
.practice-list h3,.project-title{font-size:20px}
.studio h3{font-size:19px;font-weight:400;margin-top:32px}
@media(max-width:650px){.primary-nav{gap:4px 8px;justify-content:space-between}.primary-nav a{font-size:14px;padding:10px 3px}.lang-switch{padding-left:0}:is(.lang-switch,.language-picker) a{min-width:34px}.hero-message p{font-size:16px}.section h2,.contact h2{font-size:26px}.practice-list h3,.project-title{font-size:18px}}

/* Move Lab together, preserving its internal spacing. */
.logo-title{clip-path:inset(0 55% 33% 0)}
.logo-L{clip-path:inset(0 38.4% 33% 45%)}
.logo .logo-spaced :is(.logo-title,.logo-L,.logo-a,.logo-b){width:90%;left:5%;opacity:.67}
.logo .logo-spaced :is(.logo-L,.logo-a,.logo-b){transform:translateX(2%)}

/* Align the visible O edge with the subtitle Art edge. */
.logo .logo-spaced :is(.logo-title,.logo-L,.logo-a,.logo-b){left:1.5%}

/* Align Lab right edge with Vitality; OS and subtitle stay fixed. */
.logo .logo-spaced :is(.logo-L,.logo-a,.logo-b){transform:translateX(6.6%)}

.primary-nav a{opacity:.72;transition:opacity .2s,color .2s,transform .2s}
.primary-nav a:hover,.primary-nav a:focus-visible{opacity:1}

.lang-chinese{position:relative;align-self:center}
.lang-chinese>summary{font-size:12px;font-weight:400;letter-spacing:.04em;min-width:40px;min-height:44px;padding:10px 6px;display:flex;align-items:center;justify-content:center;list-style:none;color:var(--ink);cursor:pointer;position:relative}
.lang-chinese>summary::-webkit-details-marker{display:none}
.lang-chinese>summary[aria-current=page]::after{content:'';position:absolute;bottom:9px;left:calc(50% - 7px);width:14px;height:1px;background:currentColor;opacity:.65}
.chinese-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%);z-index:20;min-width:64px;padding:5px;border:1px solid var(--line);border-radius:10px;background:var(--surface);box-shadow:0 5px 18px rgba(0,0,0,.09);display:none;flex-direction:column}
.lang-chinese[open] .chinese-menu{display:flex}
.chinese-menu a{width:100%;min-height:40px;border-radius:6px}
.chinese-menu a:hover{background:rgba(147,157,151,.1);text-decoration:none}
@media(hover:hover){.lang-chinese:hover .chinese-menu,.lang-chinese:focus-within .chinese-menu{display:flex}}
@media(max-width:650px){.lang-chinese>summary{min-width:34px}}
body:lang(zh-Hans){letter-spacing:.045em}
body:lang(zh-Hans) .primary-nav a{letter-spacing:.10em}
body:lang(zh-Hans) :is(h1,h2,h3,.project-title){letter-spacing:.08em}
body:lang(zh-Hans) .hero h1{font-family:'Noto Serif CJK SC','Songti SC','SimSun',serif;line-height:1.35}

/* Daylight treatment: reflected whites blend into the pale scene. */
:root[data-theme="light"] .logo-spaced{mix-blend-mode:multiply;filter:saturate(.25) brightness(.78) contrast(.86)}
:root[data-theme="light"] .logo .logo-spaced :is(.logo-title,.logo-L,.logo-a,.logo-b){opacity:.82}
:root[data-theme="light"] .logo-tagline{opacity:.78;filter:contrast(.82)}

:root[data-theme="light"] .logo-spaced{mix-blend-mode:normal;filter:none}
:root[data-theme="light"] .logo .logo-spaced :is(.logo-title,.logo-L,.logo-a,.logo-b){opacity:.72}
:root[data-theme="light"] .logo-tagline{opacity:.8;filter:none}

/* Consistent quiet-to-bright interaction for navigation and controls. */
:is(.primary-nav a,:is(.lang-switch,.language-picker) a,.lang-chinese>summary,.theme-toggle,.text-link,.book-follow,.email,.contact-bottom>a,.legal-nav a,.social-links a,.project-list summary){opacity:.68;transition:opacity .22s ease,filter .22s ease,background-color .22s ease}
:is(.primary-nav a,:is(.lang-switch,.language-picker) a,.lang-chinese>summary,.theme-toggle,.text-link,.book-follow,.email,.contact-bottom>a,.legal-nav a,.social-links a,.project-list summary):is(:hover,:focus-visible,:active){opacity:1;filter:drop-shadow(0 0 3px rgba(162,146,200,.14))}
:root[data-theme="dark"] :is(.primary-nav a,:is(.lang-switch,.language-picker) a,.lang-chinese>summary,.theme-toggle,.text-link,.book-follow,.email,.contact-bottom>a,.legal-nav a,.social-links a,.project-list summary):is(:hover,:focus-visible,:active){filter:drop-shadow(0 0 4px rgba(230,225,255,.23))}
.lang-chinese[open]>summary{opacity:1}
@media(prefers-reduced-motion:reduce){:is(a,button,summary){transition:none}}

.lang-switch{border-left:0;padding-left:0;gap:5px}
.language-picker{display:flex;position:relative}
.language-picker>summary{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px 10px 8px;list-style:none;border-right:1px solid var(--line);font-size:12px;font-weight:400;letter-spacing:.04em;opacity:.68;cursor:pointer;transition:opacity .22s}
.language-picker>summary::-webkit-details-marker{display:none}
.language-picker>summary:is(:hover,:focus-visible),.language-picker[open]>summary{opacity:1}
.language-options{display:none;position:absolute;right:0;top:100%;padding:8px;gap:0;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 5px 18px rgba(0,0,0,.08);z-index:30;white-space:nowrap}
.language-picker[open] .language-options{display:flex;animation:language-unfold .2s ease-out}

@keyframes language-unfold{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.language-options{animation:none!important}}

/* Translucent language panels retain the stars behind the controls. */
.language-options,.chinese-menu{background:rgba(240,247,249,.42);border-color:rgba(117,137,133,.18);box-shadow:0 5px 20px rgba(35,49,44,.045);backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px)}
:root[data-theme="dark"] :is(.language-options,.chinese-menu){background:rgba(28,40,36,.38);border-color:rgba(229,236,232,.16);box-shadow:0 5px 20px rgba(0,0,0,.08)}
.language-options a,.language-options .lang-chinese>summary{border-radius:6px;transition:opacity .22s,background-color .22s,filter .22s}
.language-options a:is(:hover,:focus-visible,:active),.language-options .lang-chinese>summary:is(:hover,:focus-visible,:active){opacity:1;background:rgba(187,175,221,.09);filter:drop-shadow(0 0 4px rgba(175,158,210,.25))}
:root[data-theme="dark"] .language-options :is(a,summary):is(:hover,:focus-visible,:active){background:rgba(229,221,255,.07);filter:drop-shadow(0 0 4px rgba(236,230,255,.28))}

/* Language hover: a small diffuse light, without a rectangular fill. */
.language-options :is(a,summary){position:relative;isolation:isolate;transition:opacity .22s,transform .25s,filter .22s}
.language-options :is(a,summary)::before{content:'';position:absolute;left:50%;top:50%;width:34px;height:34px;border-radius:50%;transform:translate(-50%,-50%) scale(.65);background:radial-gradient(circle,rgba(182,164,230,.16),rgba(182,164,230,.055) 48%,transparent 72%);opacity:0;pointer-events:none;z-index:-1;transition:opacity .25s,transform .3s}
.language-options :is(a,summary):is(:hover,:focus-visible,:active),:root[data-theme="dark"] .language-options :is(a,summary):is(:hover,:focus-visible,:active){background:transparent;opacity:1;text-decoration:none;outline:none;transform:translateY(-1px);filter:drop-shadow(0 0 4px rgba(183,165,224,.25))}
.language-options :is(a,summary):is(:hover,:focus-visible,:active)::before{opacity:1;transform:translate(-50%,-50%) scale(1.12)}
:root[data-theme="dark"] .language-options :is(a,summary)::before{background:radial-gradient(circle,rgba(233,225,255,.17),rgba(190,172,233,.055) 48%,transparent 72%)}
@media(prefers-reduced-motion:reduce){.language-options :is(a,summary):is(:hover,:focus-visible,:active){transform:none}}

.theme-toggle .theme-balance{width:18px;height:18px;stroke-width:1.2;transition:transform .35s ease}
.theme-balance .theme-half{fill:currentColor;stroke:none;opacity:.8}
:root[data-theme="dark"] .theme-balance{transform:rotate(180deg)}
@media(prefers-reduced-motion:reduce){.theme-toggle .theme-balance{transition:none}}

.language-picker>summary{border-right:0}
.logo-tagline,:root[data-theme="light"] .logo-tagline{opacity:.42}

/* OS Lab typography system: restrained hierarchy across five language editions. */
body{font-size:16px;line-height:1.7;letter-spacing:.01em}
.hero h1{font-size:clamp(44px,3.8vw,48px);font-weight:400;line-height:1.3}
.section h2,.contact h2{font-size:clamp(30px,2.4vw,32px);font-weight:400;line-height:1.35}
.practice-list h3,.project-title,.studio>div>h3{font-size:21px;font-weight:400;line-height:1.45}
.hero-message p{font-size:18px;line-height:1.75;max-width:58ch}
:is(.studio-columns p,.practice-list p,.project-copy p,#journal p){font-size:16px;line-height:1.7;max-width:62ch}
.primary-nav a{font-size:15px;font-weight:400}
.project-title small{font-size:14px;line-height:1.7}
:is(.language-picker>summary,:is(.lang-switch,.language-picker) a,.lang-chinese>summary,footer){font-size:13px}
:is(.eyebrow,.section-label,.hero-aside,.timeline-phase){font-size:12px}
body:is(:lang(zh-Hant),:lang(zh-Hans)){letter-spacing:.03em;line-height:1.8}
body:is(:lang(zh-Hant),:lang(zh-Hans)) :is(h1,h2,h3,.project-title){letter-spacing:.06em}
body:is(:lang(zh-Hant),:lang(zh-Hans)) .primary-nav a{letter-spacing:.08em}
body:is(:lang(zh-Hant),:lang(zh-Hans)) :is(.studio-columns p,.practice-list p,.project-copy p,#journal p,.hero-message p){line-height:1.8;max-width:32em}
@media(max-width:650px){
 .hero h1{font-size:clamp(30px,7.8vw,34px);line-height:1.35}
 body:is(:lang(zh-Hant),:lang(zh-Hans)) .hero h1{font-size:clamp(30px,7.8vw,34px)}
 .section h2,.contact h2{font-size:25px}
 .practice-list h3,.project-title,.studio>div>h3{font-size:19px}
 .hero-message p{font-size:17px}
 .primary-nav a{font-size:14px}
 body:is(:lang(zh-Hant),:lang(zh-Hans)) :is(.studio-columns p,.practice-list p,.project-copy p,#journal p){max-width:30em}
}

/* Chinese variants unfold within the same row, expanding the menu leftward. */
.language-options{width:max-content;max-width:calc(100vw - 32px);right:0}
.language-options .lang-chinese{display:flex;align-items:center}
.language-options .chinese-menu{position:static;transform:none;min-width:0;padding:0;gap:2px;flex-direction:row;background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
:root[data-theme="dark"] .language-options .chinese-menu{background:transparent;border:0;box-shadow:none}
.language-options .chinese-menu a{width:38px;min-width:38px}
.language-options .lang-chinese[open]>summary{min-width:0;width:0;padding:0;opacity:0;overflow:hidden}
.language-options .lang-chinese[open] .chinese-menu{display:flex}
@media(hover:hover){.language-options .lang-chinese:hover>summary{min-width:0;width:0;padding:0;opacity:0;overflow:hidden}.language-options .lang-chinese:hover .chinese-menu{display:flex}}

/* Entire language panel unfolds to the left of its trigger. */
.language-picker .language-options{right:100%;left:auto;top:50%;margin-right:4px;transform:translateY(-50%);animation:language-unfold-left .22s ease-out}
.language-options::after{content:'';position:absolute;left:100%;top:0;width:8px;height:100%;pointer-events:auto}
@keyframes language-unfold-left{from{opacity:0;transform:translate(8px,-50%)}to{opacity:1;transform:translate(0,-50%)}}
@media(max-width:650px){.language-options{padding:4px}.language-options>a{min-width:30px;padding-inline:4px}.language-options .lang-chinese>summary{min-width:30px;padding-inline:4px}.language-options .chinese-menu a{width:30px;min-width:30px}}

.language-picker .language-options,:root[data-theme="dark"] .language-picker .language-options{background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}

.hero-aside a{display:flex;align-items:center;min-height:44px;padding:14px 0;border-bottom:1px solid var(--line);opacity:.68;transition:opacity .22s,filter .22s;text-decoration:none}
.hero-aside a:is(:hover,:focus-visible,:active){opacity:1;filter:drop-shadow(0 0 4px rgba(178,158,219,.24));text-decoration:none}
:is(#kunst,#gestaltung,#kultur){scroll-margin-top:150px}
@media(max-width:650px){.hero-aside a{padding:13px 0}}

@media(hover:hover) and (pointer:fine){html.breathing-cursor,html.breathing-cursor :is(body,a,button,summary){cursor:none}}
.oslab-cursor-core{position:fixed;left:0;top:0;pointer-events:none;z-index:2147483647;width:3px;height:3px;transform:translate(-50%,-50%);border-radius:50%;background:#fffff5;box-shadow:0 0 3px rgba(255,255,247,.95),0 0 7px rgba(240,247,178,.65);visibility:hidden;animation:cursor-core-breathe 3.6s ease-in-out infinite}
.oslab-cursor-core.visible{visibility:visible}
@keyframes cursor-core-breathe{0%,100%{opacity:.62;box-shadow:0 0 2px rgba(255,255,247,.7),0 0 4px rgba(240,247,178,.35)}50%{opacity:1;box-shadow:0 0 4px rgba(255,255,247,1),0 0 8px rgba(240,247,178,.7)}}
@media(prefers-reduced-motion:reduce){.oslab-cursor-core{display:none}html.breathing-cursor,html.breathing-cursor :is(body,a,button,summary){cursor:auto}}

/* Broken, diffused aura: soft arcs instead of a continuous rim. */
.oslab-cursor-aura,.oslab-cursor-aura.interactive{border:0;background:transparent;box-shadow:none}
.oslab-cursor-aura::before{content:'';position:absolute;inset:-3px;border-radius:50%;background:conic-gradient(from 15deg,transparent 0deg,rgba(167,144,212,.18) 25deg,transparent 63deg,transparent 105deg,rgba(167,144,212,.12) 132deg,transparent 166deg,transparent 225deg,rgba(167,144,212,.16) 251deg,transparent 290deg,transparent 360deg);mask-image:radial-gradient(circle,transparent 36%,rgba(0,0,0,.8) 56%,transparent 74%);-webkit-mask-image:radial-gradient(circle,transparent 36%,rgba(0,0,0,.8) 56%,transparent 74%);filter:blur(2.5px);opacity:.8;transition:opacity .25s}
.oslab-cursor-aura.interactive::before{opacity:1}
:root[data-theme="dark"] .oslab-cursor-aura::before{background:conic-gradient(from 15deg,transparent 0deg,rgba(213,193,249,.22) 25deg,transparent 63deg,transparent 105deg,rgba(213,193,249,.14) 132deg,transparent 166deg,transparent 225deg,rgba(213,193,249,.19) 251deg,transparent 290deg,transparent 360deg)}

.oslab-cursor-core{width:4px;height:4px}

.oslab-cursor-core{background:#fffffc;animation-name:cursor-core-bright-breathe}
@keyframes cursor-core-bright-breathe{0%,100%{opacity:.82;box-shadow:0 0 3px rgba(255,255,252,.95),0 0 6px rgba(246,255,184,.55)}50%{opacity:1;box-shadow:0 0 5px rgba(255,255,252,1),0 0 10px rgba(246,255,184,.85)}}
.oslab-cursor-aura::before{opacity:1;background:conic-gradient(from 15deg,transparent 0deg,rgba(177,149,229,.31) 25deg,transparent 63deg,transparent 105deg,rgba(177,149,229,.22) 132deg,transparent 166deg,transparent 225deg,rgba(177,149,229,.28) 251deg,transparent 290deg,transparent 360deg)}
:root[data-theme="dark"] .oslab-cursor-aura::before{background:conic-gradient(from 15deg,transparent 0deg,rgba(225,203,255,.36) 25deg,transparent 63deg,transparent 105deg,rgba(225,203,255,.24) 132deg,transparent 166deg,transparent 225deg,rgba(225,203,255,.31) 251deg,transparent 290deg,transparent 360deg)}

/* Quiet fixed stars reveal three skies. */
:root[data-theme="dream"]{color-scheme:only light;--surface:#c5d6ec;--ink:#374660;--muted:#52627c;--line:#a7b7cf}
:root[data-theme="dream"] .atmosphere{background:radial-gradient(ellipse at 72% 68%,rgba(249,214,232,.8),transparent 65%),linear-gradient(165deg,#bed4ed 0%,#d4d5ee 45%,#f0dce9 80%,#d9e7f3 100%)}
:root[data-theme="dream"] header::before{opacity:.25}
:root[data-theme="dream"] #fog-canvas{opacity:.62}
body{transition:background-color 1.8s ease,color 1.2s ease}
.sky-controls{position:fixed;inset:0;z-index:3;pointer-events:none}
.sky-star{position:absolute;width:44px;height:44px;padding:0;border:0;background:transparent;color:var(--ink);pointer-events:auto;transform:translate(-50%,-50%)}
.sky-star:nth-child(1){left:3%;top:35%}
.sky-star:nth-child(2){left:96.5%;top:48%}
.sky-star:nth-child(3){left:3%;top:73%}
.sky-star::before{content:"";position:absolute;left:20px;top:20px;width:4px;height:4px;border-radius:50%;background:#fbf9ff;box-shadow:0 0 5px #fff,0 0 11px rgba(161,128,221,.8);animation:sky-star-breathe 4.8s ease-in-out infinite}
.sky-star:nth-child(2)::before{animation-delay:-1.7s}
.sky-star:nth-child(3)::before{animation-delay:-3.2s}
.sky-star:hover::before,.sky-star:focus-visible::before{width:5px;height:5px;box-shadow:0 0 7px #fff,0 0 17px #b9a2eb}
.sky-star-label{position:absolute;left:38px;top:12px;font-size:12px;white-space:nowrap;opacity:0;transition:opacity .3s;pointer-events:none;text-shadow:0 0 8px var(--surface)}
.sky-star:nth-child(2) .sky-star-label{left:auto;right:38px}
.sky-star:is(:hover,:focus-visible) .sky-star-label{opacity:1}
.sky-star:focus-visible{outline:1px solid var(--muted);outline-offset:0;border-radius:50%}
@keyframes sky-star-breathe{0%,100%{opacity:.38;transform:scale(.8)}50%{opacity:1;transform:scale(1.22)}}
@media(max-width:600px){.sky-star:nth-child(1),.sky-star:nth-child(3){left:6%}.sky-star:nth-child(2){left:94%}}
@media(prefers-reduced-motion:reduce){.sky-star::before{animation:none;opacity:.8}body{transition:none}}

/* Shared, more expressive breathing for the light core and broken aura. */
.oslab-cursor-core{animation:cursor-energy-breathe 3.6s ease-in-out infinite;background:#fffefa}
.oslab-cursor-aura::before{animation:cursor-aura-breathe 3.6s ease-in-out infinite}
@keyframes cursor-energy-breathe{
 0%,100%{opacity:.72;transform:translate(-50%,-50%) scale(.8);box-shadow:0 0 4px rgba(255,255,250,.9),0 0 8px rgba(255,244,198,.5)}
 50%{opacity:1;transform:translate(-50%,-50%) scale(1.5);box-shadow:0 0 6px 1px rgba(255,255,250,1),0 0 13px 2px rgba(255,244,198,.85),0 0 20px rgba(255,250,225,.4)}
}
@keyframes cursor-aura-breathe{
 0%,100%{opacity:.4;transform:scale(.8);filter:blur(2.5px) brightness(1)}
 50%{opacity:1;transform:scale(1.25);filter:blur(2.5px) brightness(1.75)}
}
@media(prefers-reduced-motion:reduce){.oslab-cursor-core,.oslab-cursor-aura::before{animation:none}}

/* Distinct blue hour and rose dream hour. */
:root[data-theme="twilight"]{color-scheme:only dark;--surface:#252b58;--ink:#eef0ff;--muted:#c5cbe6;--line:#6e789c}
:root[data-theme="twilight"] .atmosphere{background:radial-gradient(ellipse at 75% 75%,#44467588,transparent 65%),linear-gradient(165deg,#172b52 0%,#303866 44%,#44416a 76%,#253354 100%)}
:root[data-theme="twilight"] header::before{opacity:.12}
:root[data-theme="twilight"] #fog-canvas{opacity:.35;filter:blur(17px) hue-rotate(65deg)}
:root[data-theme="light"] .oslab-cursor-core,:root[data-theme="dream"] .oslab-cursor-core{outline:1px solid rgba(99,83,151,.7);animation-name:cursor-day-energy}
@keyframes cursor-day-energy{
 0%,100%{opacity:.85;transform:translate(-50%,-50%) scale(.8);box-shadow:0 0 4px rgba(104,80,172,.6),0 0 9px rgba(149,112,209,.35)}
 50%{opacity:1;transform:translate(-50%,-50%) scale(1.5);box-shadow:0 0 5px 1px rgba(255,255,250,1),0 0 11px 3px rgba(104,80,172,.65),0 0 20px rgba(157,115,224,.45)}
}
:root[data-theme="light"] .oslab-cursor-aura::before,:root[data-theme="dream"] .oslab-cursor-aura::before{background:conic-gradient(from 15deg,transparent,rgba(111,76,187,.65) 25deg,transparent 63deg,transparent 105deg,rgba(111,76,187,.45) 132deg,transparent 166deg,transparent 225deg,rgba(111,76,187,.55) 251deg,transparent 290deg)}
.sky-controls{inset:auto;left:50%;top:28%;width:260px;height:64px;transform:translateX(-50%)}
.sky-controls .sky-star:nth-child(1){left:10%;top:45%}
.sky-controls .sky-star:nth-child(2){left:36%;top:20%}
.sky-controls .sky-star:nth-child(3){left:63%;top:55%}
.sky-controls .sky-star:nth-child(4){left:90%;top:30%}
.sky-star::before{width:6px;height:6px;left:19px;top:19px;box-shadow:0 0 5px #fff,0 0 12px 2px rgba(146,111,215,.75)}
.sky-star:nth-child(4)::before{animation-delay:-2.4s}
.sky-star .sky-star-label,.sky-star:nth-child(2) .sky-star-label{left:50%;right:auto;top:43px;transform:translateX(-50%)}
.sky-star[aria-pressed="true"]::before{background:#fff9e9;box-shadow:0 0 5px #fff,0 0 15px 3px rgba(153,123,220,.85)}
.language-picker>summary{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;min-width:44px}
.language-globe{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.15}
@media(max-width:650px){.sky-controls{top:29%;width:230px}}
@media(prefers-reduced-motion:reduce){.oslab-cursor-core{animation:none}}

/* Saturated cobalt blue hour. */
:root[data-theme="twilight"]{--surface:#073ca2;--ink:#edf5ff;--muted:#c2dcff;--line:#5987cf}
:root[data-theme="twilight"] .atmosphere{background:radial-gradient(ellipse at 65% 65%,rgba(28,99,227,.55),transparent 68%),linear-gradient(165deg,#031c68 0%,#063fae 42%,#0754ce 73%,#083485 100%)}
:root[data-theme="twilight"] #fog-canvas{opacity:.14;filter:blur(17px)}
:root[data-theme="twilight"] header::before{opacity:.05}

/* Violet drifting clouds above a deep blue sky; cool blue typography. */
:root[data-theme="twilight"]{--ink:#c3e4ff;--muted:#a9cef7;--line:#568ad0}
:root[data-theme="twilight"] #fog-canvas{opacity:.43;filter:blur(17px)}
:root[data-theme="twilight"] :is(h1,h2,h3,a,button,summary){color:var(--ink)}
:root[data-theme="twilight"] :is(:is(.lang-switch,.language-picker) a,.hero-message p,.studio-columns p,.practice-list article>span:first-child,.practice-list p,.discipline,.timeline-phase,.project-title small,.project-copy p,.contact-bottom,footer,.eyebrow,.section-label,.hero-aside){color:var(--muted)}
:root[data-theme="twilight"] .logo-spaced img{filter:sepia(.35) saturate(2) hue-rotate(165deg)}
:root[data-theme="twilight"] .social-links a{color:var(--ink);background:rgba(63,112,190,.15)}

/* Four unequal planets, quietly scattered rather than arranged in a menu. */
.sky-controls{inset:0;left:0;top:0;width:100%;height:100%;transform:none}
.sky-controls .sky-star:nth-child(1){left:18%;top:32%;--planet-color:#fffdfa;--planet-glow:rgba(176,173,225,.65);--planet-size:4px}
.sky-controls .sky-star:nth-child(2){left:88%;top:38%;--planet-color:#79baff;--planet-glow:rgba(43,126,255,.65);--planet-size:7px}
.sky-controls .sky-star:nth-child(3){left:73%;top:81%;--planet-color:#ffc0de;--planet-glow:rgba(238,139,195,.55);--planet-size:5px}
.sky-controls .sky-star:nth-child(4){left:8%;top:60%;--planet-color:#182133;--planet-glow:rgba(138,161,201,.45);--planet-size:8px}
.sky-star::before,.sky-star:hover::before,.sky-star:focus-visible::before,.sky-star[aria-pressed="true"]::before{width:var(--planet-size);height:var(--planet-size);left:calc(22px - var(--planet-size)/2);top:calc(22px - var(--planet-size)/2);background:var(--planet-color);box-shadow:0 0 5px var(--planet-glow),0 0 12px 2px var(--planet-glow)}
.sky-star:nth-child(4)::before{outline:1px solid rgba(154,180,224,.6)}
.sky-star-label{font-family:Georgia,serif;font-size:14px}
@media(max-width:650px){.sky-controls .sky-star:nth-child(1){left:15%;top:32%}.sky-controls .sky-star:nth-child(2){left:91%;top:43%}.sky-controls .sky-star:nth-child(3){left:83%;top:86%}.sky-controls .sky-star:nth-child(4){left:7%;top:66%}}

/* Three concealed mathematical lights. */
.sky-controls .sky-star:nth-child(5){left:42%;top:23%;--planet-color:#ffe17c;--planet-glow:rgba(246,206,82,.65);--planet-size:5.5px}
.sky-controls .sky-star:nth-child(6){left:94%;top:70%;--planet-color:#b6e8ef;--planet-glow:rgba(133,216,231,.6);--planet-size:4.5px}
.sky-controls .sky-star:nth-child(7){left:29%;top:89%;--planet-color:#b6c9a9;--planet-glow:rgba(153,179,137,.6);--planet-size:6px}
.sky-star:nth-child(5)::before{animation-delay:-.9s}
.sky-star:nth-child(6)::before{animation-delay:-3.8s}
.sky-star:nth-child(7)::before{animation-delay:-2.1s}
.sky-symbol-star{cursor:inherit}
@media(max-width:650px){.sky-controls .sky-star:nth-child(5){left:47%;top:28%}.sky-controls .sky-star:nth-child(6){left:93%;top:74%}.sky-controls .sky-star:nth-child(7){left:27%;top:92%}}

/* Delta: charcoal and pearl grey, relocated into the open right sky. */
.sky-controls .sky-star:nth-child(4){left:94%;top:57%;--planet-color:#34383f;--planet-glow:rgba(158,169,187,.5)}
.sky-controls .sky-star:nth-child(4)::before{background:radial-gradient(circle at 30% 25%,#a5a9b0 0%,#737780 27%,#383c44 61%,#171b23 100%);outline:1px solid rgba(160,170,188,.35);box-shadow:0 0 5px rgba(158,169,187,.45),0 0 12px 2px rgba(128,144,168,.25)}
@media(max-width:650px){.sky-controls .sky-star:nth-child(4){left:92%;top:59%}}

/* Beta: saturated electric blue-violet, with a concentrated luminous core. */
.sky-controls .sky-star:nth-child(2){--planet-color:#9294ff;--planet-glow:rgba(89,66,246,.9);--planet-size:7.5px}
.sky-controls .sky-star:nth-child(2)::before{background:radial-gradient(circle at 35% 30%,#d5d8ff,#7c8eff 35%,#6854ef 72%,#4935bc);box-shadow:0 0 5px rgba(128,150,255,.95),0 0 12px 2px rgba(80,68,248,.8),0 0 20px rgba(92,65,223,.4)}

/* Tiny symbols rise out of their planets with a soft overshoot. */
.sky-star .sky-star-label,.sky-star:nth-child(2) .sky-star-label{left:50%;right:auto;top:0;font-size:12px;line-height:1.2;opacity:0;transform:translate(-50%,16px) scale(.65);transform-origin:center bottom;transition:opacity .18s,transform .22s;}
.sky-star:is(:hover,:focus-visible) .sky-star-label{opacity:.55;transform:translate(-50%,-13px) scale(1);animation:planet-name-pop .48s cubic-bezier(.2,.7,.3,1) both}
@keyframes planet-name-pop{0%{opacity:0;transform:translate(-50%,16px) scale(.65)}58%{opacity:.62;transform:translate(-50%,-18px) scale(1.1)}80%{transform:translate(-50%,-10px) scale(.96)}100%{opacity:.55;transform:translate(-50%,-13px) scale(1)}}
.social-links a[title="Instagram"]{--social-light:#ba8aff;--social-glow:rgba(164,100,239,.32);--social-ink:#a66dde}
.social-links a[title="LINE"]{--social-light:#6ae395;--social-glow:rgba(64,190,111,.3);--social-ink:#38b56c}
.social-links a[title="WhatsApp"]{--social-light:#a2f65c;--social-glow:rgba(133,226,65,.34);--social-ink:#76c53e}
:root[data-theme] .social-links a[title]:is(:hover,:focus-visible,:active){color:var(--social-ink);border-color:var(--social-light);background:var(--social-glow);box-shadow:0 0 12px var(--social-glow),inset 0 0 8px var(--social-glow);filter:drop-shadow(0 0 3px var(--social-glow));opacity:1;transform:translateY(-2px)}
:root[data-theme="dark"] .social-links a[title]:is(:hover,:focus-visible,:active),:root[data-theme="twilight"] .social-links a[title]:is(:hover,:focus-visible,:active){color:var(--social-light)}
.social-links a{transition:color .25s,border-color .25s,box-shadow .25s,background .25s,transform .25s,opacity .25s}
@media(prefers-reduced-motion:reduce){.sky-star:is(:hover,:focus-visible) .sky-star-label{animation:none}.social-links a{transition:none}}

/* Delta: a tiny translucent ink energy sphere, drifting only in breath. */
.sky-controls .sky-star:nth-child(4){left:61%;top:24%;--planet-size:3.5px}
.sky-controls .sky-star:nth-child(4)::before{background:radial-gradient(circle at 34% 28%,rgba(99,109,126,.28),rgba(34,41,53,.48) 55%,rgba(11,17,27,.2));outline:0;box-shadow:0 0 4px rgba(65,78,100,.18),0 0 8px rgba(149,166,193,.12);animation:delta-energy-breathe 4.4s ease-in-out infinite}
@keyframes delta-energy-breathe{0%,100%{opacity:.4;transform:scale(.65);filter:blur(.15px)}50%{opacity:.78;transform:scale(1.55);filter:blur(0)}}
@media(max-width:650px){.sky-controls .sky-star:nth-child(4){left:66%;top:34%}}
@media(prefers-reduced-motion:reduce){.sky-controls .sky-star:nth-child(4)::before{animation:none;opacity:.65}}

/* An immersive blue world: cobalt sky, ink clouds, violet depths. */
:root[data-theme="twilight"]{--surface:#082667;--ink:#a6ceff;--muted:#7ba4e2;--line:#365eab}
:root[data-theme="twilight"] .atmosphere{background:radial-gradient(ellipse at 78% 72%,rgba(48,42,115,.52),transparent 67%),radial-gradient(ellipse at 28% 42%,rgba(13,77,190,.58),transparent 70%),linear-gradient(160deg,#061743 0%,#073387 37%,#103faa 62%,#13265d 100%)}
:root[data-theme="twilight"] #fog-canvas{opacity:.66;filter:blur(17px)}
:root[data-theme="twilight"] h1{color:#b3cdff;text-shadow:0 0 24px rgba(74,125,235,.1)}
:root[data-theme="twilight"] h2{color:#9ab8f5}
:root[data-theme="twilight"] h3,:root[data-theme="twilight"] .project-title{color:#9fa9ed}
:root[data-theme="twilight"] .primary-nav a{color:#89baff}
:root[data-theme="twilight"] .hero-message p{color:#83b5f2}
:root[data-theme="twilight"] :is(.studio-columns p,.practice-list p,.project-copy p,#journal p){color:#8baadd}
:root[data-theme="twilight"] :is(.eyebrow,.section-label,.timeline-phase,.hero-aside){color:#738dce}
:root[data-theme="twilight"] :is(.text-link,.book-follow,.email){color:#93a8ed}
:root[data-theme="twilight"] :is(.lang-switch,.contact-bottom,footer,.project-title small){color:#839bda}
:root[data-theme="twilight"] :is(.lang-switch,.language-picker) a{color:#90b7ee}
:root[data-theme="twilight"] .logo-spaced img{filter:sepia(.6) saturate(3) hue-rotate(175deg)}

/* Firefly heart: luminous pink, yellow, and electric white; fine gold-white rim. */
:root[data-theme] .oslab-cursor-core{width:5.5px;height:5.5px;background:currentColor;color:#fff4a0;animation:firefly-heart-breathe 3.6s ease-in-out infinite,firefly-spectrum 10.8s ease-in-out infinite;outline:0}
@keyframes firefly-heart-breathe{
 0%,100%{opacity:.78;transform:translate(-50%,-50%) scale(.82);box-shadow:0 0 4px 1px currentColor,0 0 9px currentColor}
 50%{opacity:1;transform:translate(-50%,-50%) scale(1.38);box-shadow:0 0 6px 1px #fff,0 0 12px 3px currentColor,0 0 22px currentColor}
}
@keyframes firefly-spectrum{0%,100%{color:#ff95e0}33.333%{color:#f4ff79}66.666%{color:#d5faff}}
.oslab-cursor-aura::after{content:"";position:absolute;inset:1px;border:0.6px solid rgba(255,227,156,.62);border-radius:50%;pointer-events:none;animation:firefly-rim-breathe 3.6s ease-in-out infinite}
@keyframes firefly-rim-breathe{0%,100%{opacity:.32;transform:scale(.8);border-color:rgba(232,184,93,.7);box-shadow:0 0 3px rgba(232,184,93,.15)}50%{opacity:.75;transform:scale(1.22);border-color:rgba(255,255,246,.8);box-shadow:0 0 5px rgba(255,249,224,.3)}}
:root[data-theme="light"] .oslab-cursor-core,:root[data-theme="dream"] .oslab-cursor-core{outline:.6px solid rgba(124,97,155,.45)}
:root[data-theme="light"] .oslab-cursor-aura::after,:root[data-theme="dream"] .oslab-cursor-aura::after{filter:drop-shadow(0 0 1px rgba(111,85,161,.4))}
@media(prefers-reduced-motion:reduce){:root[data-theme] .oslab-cursor-core,.oslab-cursor-aura::after{animation:none}}

/* Ultramarine atmosphere with a local UV response. */
:root[data-theme="twilight"]{--surface:#120a8f}
:root[data-theme="twilight"] .atmosphere{background:radial-gradient(ellipse at 32% 48%,rgba(39,39,226,.48),transparent 68%),radial-gradient(ellipse at 78% 76%,rgba(53,17,130,.5),transparent 65%),linear-gradient(160deg,#090c49 0%,#120a8f 38%,#1915b7 66%,#101459 100%)}
.blue-uv-light{position:fixed;left:0;top:0;width:220px;height:220px;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(circle,rgba(60,103,255,.19),rgba(61,41,239,.08) 45%,transparent 72%);opacity:0;transition:opacity .3s}
:root[data-theme="twilight"] .blue-uv-light.visible{opacity:1}
:root[data-theme="twilight"] .uv-lit{color:#8ecaff!important;text-shadow:0 0 4px rgba(78,163,255,var(--uv-strength,.7)),0 0 13px rgba(54,99,255,calc(var(--uv-strength,.7)*.7));transition:color .18s,text-shadow .2s}
:root[data-theme="twilight"] :is(.primary-nav a,:is(.lang-switch,.language-picker) a,.language-picker>summary,.theme-toggle,.text-link,.hero-aside a,.project-list summary):is(:hover,:focus-visible){color:#8ecaff;opacity:1;text-shadow:0 0 5px #287fff,0 0 15px rgba(71,73,255,.8);filter:drop-shadow(0 0 4px rgba(58,113,255,.5))}
@media(prefers-reduced-motion:reduce){.blue-uv-light{display:none}}

/* Each breath carries the timeline into the next quiet hue. */
:root[data-theme] .project-list::before{background:currentColor;animation:timeline-spectrum 21.6s linear infinite,timeline-breathe 3.6s ease-in-out infinite;box-shadow:0 0 5px currentColor}
@keyframes timeline-spectrum{0%,100%{color:#c0a9e4}16.666%{color:#a3c9eb}33.333%{color:#aab3bf}50%{color:#edf2fa}66.666%{color:#e9bad8}83.333%{color:#e4cf99}}
@keyframes timeline-breathe{0%,100%{opacity:.3}50%{opacity:.72}}
:root[data-theme] .book-project .timeline-phase{color:#8bcfff;animation:timeline-now-breathe 3.6s ease-in-out infinite}
:root[data-theme] .book-project::before{border-color:#8bcfff;background:#8bcfff;animation:timeline-now-breathe 3.6s ease-in-out infinite}
@keyframes timeline-now-breathe{0%,100%{opacity:.68;text-shadow:0 0 2px rgba(92,174,255,.3);filter:drop-shadow(0 0 2px rgba(92,174,255,.25))}50%{opacity:1;text-shadow:0 0 6px rgba(97,183,255,.8);filter:drop-shadow(0 0 5px rgba(97,183,255,.6))}}
:root[data-theme] .language-options a.language-flash{animation:language-click-flash .18s ease-out both;opacity:1}
@keyframes language-click-flash{0%{color:inherit;text-shadow:none;transform:translateY(0)}45%{color:#b9deff;text-shadow:0 0 5px #70b6ff,0 0 13px rgba(146,116,255,.9);filter:drop-shadow(0 0 5px rgba(136,125,255,.7));transform:translateY(-2px)}100%{color:#a7caff;text-shadow:0 0 3px rgba(113,169,255,.5);transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){:root[data-theme] .project-list::before,:root[data-theme] .book-project .timeline-phase,:root[data-theme] .book-project::before{animation:none}.language-options a.language-flash{animation:none;color:#87baff}}

/* Familiar WhatsApp green, with a brighter fluorescent response. */
.social-links a[title="WhatsApp"]{--social-light:#25d366;--social-glow:rgba(37,211,102,.48);--social-ink:#128c4c}
/* Small luminous timeline seeds replace outlined circles. */
:root[data-theme] .project-list details::before{width:6px;height:6px;left:-29px;top:40px;border:0;border-radius:50%;background:#b5b9ef;box-shadow:0 0 4px #b5b9ef,0 0 10px rgba(154,149,237,.55)}
:root[data-theme] .project-list .book-project::before{background:#a5deff;box-shadow:0 0 5px #a5deff,0 0 12px rgba(113,185,255,.7);animation:timeline-seed-breathe 3.6s ease-in-out infinite}
@keyframes timeline-seed-breathe{0%,100%{opacity:.6;transform:scale(.8);box-shadow:0 0 3px #a5deff,0 0 6px rgba(113,185,255,.35)}50%{opacity:1;transform:scale(1.2);box-shadow:0 0 6px #a5deff,0 0 13px rgba(113,185,255,.75)}}
/* A theme-aware flashlight makes nearby text glow without bleaching light backgrounds. */
:root{--torch-color:#594883;--torch-rgb:152,115,220;--torch-wash:rgba(179,149,237,.12)}
:root[data-theme="dream"]{--torch-color:#65518b;--torch-rgb:180,129,216;--torch-wash:rgba(232,175,232,.13)}
:root[data-theme="dark"]{--torch-color:#fffde5;--torch-rgb:243,237,186;--torch-wash:rgba(243,237,186,.12)}
:root[data-theme="twilight"]{--torch-color:#8ecaff;--torch-rgb:78,163,255;--torch-wash:rgba(60,103,255,.19)}
.blue-uv-light{background:radial-gradient(circle,var(--torch-wash),transparent 72%)}
:root[data-theme] .blue-uv-light.visible{opacity:1}
:root[data-theme] .uv-lit{color:var(--torch-color)!important;opacity:1;text-shadow:0 0 4px rgba(var(--torch-rgb),var(--uv-strength,.7)),0 0 13px rgba(var(--torch-rgb),calc(var(--uv-strength,.7)*.7));transition:color .18s,text-shadow .2s,opacity .18s}
@media(max-width:650px){:root[data-theme] .project-list details::before{top:38px}}
@media(prefers-reduced-motion:reduce){:root[data-theme] .project-list .book-project::before{animation:none}}

/* Contour planet: a tiny, slow rainbow breath beside the logo. */
.sky-controls .sky-star:nth-child(7){left:24%;top:7%;--planet-size:3px}
.sky-controls .sky-star:nth-child(7)::before{background:currentColor;color:#c0eccb;outline:0;box-shadow:0 0 4px currentColor,0 0 9px currentColor;animation:contour-rainbow 36s linear infinite,contour-breathe 5.8s ease-in-out infinite;animation-delay:0s,-1s}
@keyframes contour-rainbow{0%,100%{color:#ffc8dc}16.666%{color:#ffe0ba}33.333%{color:#f0efb7}50%{color:#bdebcf}66.666%{color:#badff7}83.333%{color:#d6c6f5}}
@keyframes contour-breathe{0%,100%{opacity:.08;transform:scale(.65)}50%{opacity:.88;transform:scale(1.3)}}
@media(max-width:650px){.sky-controls .sky-star:nth-child(7){left:44%;top:7%}}
@media(prefers-reduced-motion:reduce){.sky-controls .sky-star:nth-child(7)::before{animation:none;opacity:.65}}

/* Daylight: gentle gold aura, electric core, white illumination. */
:root[data-theme="light"]{--torch-color:#fffefa;--torch-rgb:255,253,239;--torch-wash:rgba(255,255,247,.28)}
:root[data-theme="light"] .oslab-cursor-aura::before{background:conic-gradient(from 15deg,transparent,rgba(217,181,107,.46) 25deg,transparent 63deg,transparent 105deg,rgba(232,203,147,.35) 132deg,transparent 166deg,transparent 225deg,rgba(217,181,107,.42) 251deg,transparent 290deg)}
:root[data-theme="light"] .oslab-cursor-aura::after{filter:drop-shadow(0 0 1px rgba(185,145,73,.3))}
:root[data-theme="light"] .oslab-cursor-core{outline:.6px solid rgba(174,154,100,.4);animation:firefly-heart-breathe 3.6s ease-in-out infinite,day-electric-spectrum 7.2s ease-in-out infinite}
@keyframes day-electric-spectrum{0%,100%{color:#d6f7ff}50%{color:#fffff3}}
:root[data-theme="light"] .uv-lit{color:#fffefa!important;text-shadow:0 0 3px rgba(123,128,124,.7),0 0 7px rgba(255,255,247,var(--uv-strength,.7)),0 0 15px rgba(255,252,228,calc(var(--uv-strength,.7)*.8))}

/* Current work stays crisp; only a separate light behind it breathes. */
:root[data-theme] .book-project .timeline-phase,:root[data-theme] .book-project .project-title{position:relative;isolation:isolate;filter:none;text-shadow:none;animation:none;opacity:1}
:root[data-theme] .book-project .timeline-phase{color:var(--ink)}
:root[data-theme] .book-project .timeline-phase::before,:root[data-theme] .book-project .project-title::before{content:"";position:absolute;inset:-6px -8px;z-index:-1;pointer-events:none;border-radius:14px;background:radial-gradient(ellipse at center,rgba(111,186,255,.16),rgba(163,165,239,.06) 48%,transparent 75%);animation:current-work-light 3.6s ease-in-out infinite}
:root[data-theme] .book-project .project-title::before{bottom:auto;height:2.2em;inset-inline:-10px}
@keyframes current-work-light{0%,100%{opacity:.35}50%{opacity:1}}
:root[data-theme="light"] .book-project :is(.timeline-phase,.project-title)::before,:root[data-theme="dream"] .book-project :is(.timeline-phase,.project-title)::before{background:radial-gradient(ellipse at center,rgba(223,189,109,.18),rgba(255,239,190,.12) 48%,transparent 75%)}
:root[data-theme] .book-project :is(.timeline-phase,.project-title).uv-lit{filter:none;text-shadow:none!important}
:root[data-theme] .book-project>summary:is(:hover,:focus-visible){filter:none}
@media(prefers-reduced-motion:reduce){:root[data-theme] .book-project :is(.timeline-phase,.project-title)::before{animation:none;opacity:.65}}

/* Contour planet settles into translucent glacier blue beside the logo. */
.sky-controls .sky-star:nth-child(7)::before{color:#b9e9ee;background:radial-gradient(circle at 35% 30%,#edfaff,#c3eef2 38%,#8ccbd7 100%);box-shadow:0 0 4px rgba(178,235,244,.65),0 0 9px rgba(140,203,215,.4);animation:contour-breathe 5.8s ease-in-out infinite;animation-delay:-1s}
@media(prefers-reduced-motion:reduce){.sky-controls .sky-star:nth-child(7)::before{animation:none;opacity:.65}}

/* The star canvas always fills an explicitly sized viewport container. */
#particles-js{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
#particles-js canvas{position:absolute;inset:0;display:block;width:100%!important;height:100%!important}

/* Refined daylight: pearl light, champagne aura, crisp illuminated ink. */
:root[data-theme="light"]{--torch-color:#263c35;--torch-rgb:204,181,134;--torch-wash:rgba(240,225,188,.09)}
:root[data-theme="light"] .oslab-cursor-core{width:4px;height:4px;outline:.5px solid rgba(131,125,108,.4);color:#fffdf3;background:radial-gradient(circle,#fff 35%,#f6edcf 100%);animation:day-pearl-breathe 4.8s ease-in-out infinite}
@keyframes day-pearl-breathe{0%,100%{opacity:.85;transform:translate(-50%,-50%) scale(.9);box-shadow:0 0 3px rgba(167,145,96,.3)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.15);box-shadow:0 0 4px rgba(255,255,248,.9),0 0 8px rgba(181,158,110,.35)}}
:root[data-theme="light"] .oslab-cursor-aura{width:26px;height:26px}
:root[data-theme="light"] .oslab-cursor-aura.interactive{width:35px;height:35px}
:root[data-theme="light"] .oslab-cursor-aura::before{background:conic-gradient(from 15deg,transparent,rgba(184,164,121,.2) 25deg,transparent 63deg,transparent 105deg,rgba(216,194,151,.14) 132deg,transparent 166deg,transparent 225deg,rgba(184,164,121,.18) 251deg,transparent 290deg);animation:day-champagne-breathe 4.8s ease-in-out infinite}
:root[data-theme="light"] .oslab-cursor-aura::after{border:.5px solid rgba(164,150,120,.32);box-shadow:none;filter:none;animation:day-champagne-breathe 4.8s ease-in-out infinite}
@keyframes day-champagne-breathe{0%,100%{opacity:.4;transform:scale(.94)}50%{opacity:.75;transform:scale(1.08)}}
:root[data-theme="light"] .uv-lit{color:#263c35!important;text-shadow:0 0 12px rgba(218,196,151,calc(var(--uv-strength,.7)*.25));filter:none;opacity:1;transition:color .28s,text-shadow .28s,opacity .28s}
:root[data-theme="light"] .blue-uv-light{width:180px;height:180px;background:radial-gradient(circle,rgba(239,224,190,.1),transparent 70%)}
@media(prefers-reduced-motion:reduce){:root[data-theme="light"] .oslab-cursor-core,:root[data-theme="light"] .oslab-cursor-aura::before,:root[data-theme="light"] .oslab-cursor-aura::after{animation:none}}

/* Globe menu unfolds downward into a quiet vertical list. */
.language-picker .language-options{left:50%;right:auto;top:100%;margin:5px 0 0;transform:translateX(-50%);flex-direction:column;gap:1px;padding:5px 2px;width:48px;min-width:48px;max-width:none;animation:language-unfold-down .23s ease-out}
.language-options::after{left:0;top:-8px;width:100%;height:8px}
.language-options>a{display:flex;align-items:center;justify-content:center;width:44px;min-width:44px;min-height:36px;padding:7px 5px}
@keyframes language-unfold-down{from{opacity:0;transform:translate(-50%,-5px)}to{opacity:1;transform:translate(-50%,0)}}
/* Daylight glass cursor with a Tiffany-turquoise tint. */
:root[data-theme="light"] .oslab-cursor-core{width:4.5px;height:4.5px;background:#fbffff;outline:.5px solid rgba(97,170,167,.35);animation:tiffany-core-breathe 4.8s ease-in-out infinite}
:root[data-theme="light"] .oslab-cursor-aura{width:46px;height:46px;background:radial-gradient(circle at 32% 25%,rgba(232,255,252,.15),rgba(129,216,208,.035) 60%,transparent 75%);backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);border-radius:50%}
:root[data-theme="light"] .oslab-cursor-aura.interactive{width:58px;height:58px;background:rgba(129,216,208,.055)}
:root[data-theme="light"] .oslab-cursor-aura::before{background:radial-gradient(circle,transparent 45%,rgba(129,216,208,.16) 61%,transparent 76%);animation:tiffany-aura-breathe 4.8s ease-in-out infinite}
:root[data-theme="light"] .oslab-cursor-aura::after{inset:0;border:.6px solid rgba(93,188,181,.42);filter:none;box-shadow:inset 0 0 6px rgba(225,255,249,.12),0 0 7px rgba(129,216,208,.09);animation:tiffany-aura-breathe 4.8s ease-in-out infinite}
@keyframes tiffany-core-breathe{0%,100%{opacity:.82;transform:translate(-50%,-50%) scale(.9);box-shadow:0 0 4px rgba(129,216,208,.4)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.2);box-shadow:0 0 5px #fff,0 0 9px rgba(129,216,208,.65)}}
@keyframes tiffany-aura-breathe{0%,100%{opacity:.55;transform:scale(.95)}50%{opacity:.9;transform:scale(1.06)}}
@media(prefers-reduced-motion:reduce){.language-picker .language-options,:root[data-theme="light"] .oslab-cursor-core,:root[data-theme="light"] .oslab-cursor-aura::before,:root[data-theme="light"] .oslab-cursor-aura::after{animation:none}}
header{z-index:4}

/* Daylight electric cursor: a clear luminous core and energized turquoise rim. */
:root[data-theme="light"] .oslab-cursor-core{width:5px;height:5px;background:#f5ffff;outline:.6px solid rgba(0,142,163,.7);animation:day-electric-core 3.6s ease-in-out infinite}
:root[data-theme="light"] .oslab-cursor-aura{width:34px;height:34px;background:radial-gradient(circle,rgba(94,239,247,.08),transparent 68%);backdrop-filter:none;-webkit-backdrop-filter:none}
:root[data-theme="light"] .oslab-cursor-aura.interactive{width:44px;height:44px;background:rgba(94,239,247,.045)}
:root[data-theme="light"] .oslab-cursor-aura::before{background:radial-gradient(circle,transparent 35%,rgba(38,210,230,.4) 58%,transparent 78%);filter:blur(2px);animation:day-electric-aura 3.6s ease-in-out infinite}
:root[data-theme="light"] .oslab-cursor-aura::after{inset:0;border:.8px solid rgba(0,151,177,.75);box-shadow:0 0 5px rgba(0,183,207,.5),inset 0 0 4px rgba(94,239,247,.3);animation:day-electric-aura 3.6s ease-in-out infinite}
@keyframes day-electric-core{0%,100%{opacity:.85;transform:translate(-50%,-50%) scale(.9);box-shadow:0 0 3px #fff,0 0 6px rgba(0,160,186,.65)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.25);box-shadow:0 0 5px #fff,0 0 10px 2px rgba(0,190,210,.8),0 0 17px rgba(83,233,242,.6)}}
@keyframes day-electric-aura{0%,100%{opacity:.65;transform:scale(.9)}50%{opacity:1;transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){:root[data-theme="light"] .oslab-cursor-core,:root[data-theme="light"] .oslab-cursor-aura::before,:root[data-theme="light"] .oslab-cursor-aura::after{animation:none}}

/* Planet names stay completely hidden until they rise from the light core. */
.sky-star .sky-star-label,.sky-star:nth-child(2) .sky-star-label{top:22px;visibility:hidden;opacity:0;transform:translate(-50%,-50%) scale(.35);transition:none}
.sky-star:is(:hover,:focus-visible) .sky-star-label{visibility:visible;animation:planet-name-from-core .5s cubic-bezier(.2,.7,.3,1) both}
@keyframes planet-name-from-core{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}58%{opacity:.58;transform:translate(-50%,calc(-50% - 25px)) scale(1.08)}80%{opacity:.55;transform:translate(-50%,calc(-50% - 19px)) scale(.97)}100%{opacity:.55;transform:translate(-50%,calc(-50% - 22px)) scale(1)}}
@media(prefers-reduced-motion:reduce){.sky-star:is(:hover,:focus-visible) .sky-star-label{animation:none;opacity:.55;transform:translate(-50%,calc(-50% - 22px))}}

/* Beta: a small, flat blue-violet light hidden in the lower-right sky. */
.sky-controls .sky-star:nth-child(2){left:95%;top:92%;--planet-size:3.5px}
.sky-controls .sky-star:nth-child(2)::before{background:rgba(117,125,246,.78);outline:0;box-shadow:0 0 4px rgba(109,113,246,.45),0 0 8px rgba(95,72,221,.23)}
@media(max-width:650px){.sky-controls .sky-star:nth-child(2){left:92%;top:92%}}

/* Celadon beside the logo; daylight interaction expressed through pure lines. */
.sky-controls .sky-star:nth-child(7)::before{color:#aacdc4;background:radial-gradient(circle,#dcece5,#aacdc4 70%,#8bb1a6);box-shadow:0 0 4px rgba(170,205,196,.42),0 0 8px rgba(139,177,166,.2)}
:root[data-theme="light"] .oslab-cursor-core{width:3px;height:3px;background:transparent;color:#596b65;border:.6px solid rgba(67,87,79,.85);outline:0;box-shadow:none;filter:none;animation:none;opacity:1;transform:translate(-50%,-50%)}
:root[data-theme="light"] .oslab-cursor-aura{width:28px;height:28px;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;filter:none}
:root[data-theme="light"] .oslab-cursor-aura.interactive{width:38px;height:38px;background:transparent}
:root[data-theme="light"] .oslab-cursor-aura::before{display:none}
:root[data-theme="light"] .oslab-cursor-aura::after{inset:0;border:.65px solid rgba(75,98,90,.55);background:transparent;box-shadow:none;filter:none;animation:none;opacity:1;transform:none}
:root[data-theme="light"] :is(.blue-uv-light,.oslab-light-pulse){display:none}
:root[data-theme="light"] .uv-lit{color:#263c35!important;text-shadow:none;filter:none;opacity:1}

/* Alpha rests in the left margin, away from the hero text. */
.sky-controls .sky-star:nth-child(1){left:3%;top:36%}
@media(max-width:650px){.sky-controls .sky-star:nth-child(1){left:7%;top:35%}}

.sky-controls .sky-star:nth-child(1){left:3%;top:26%}
@media(max-width:650px){.sky-controls .sky-star:nth-child(1){left:7%;top:29%}}

/* Contour stays beside the logo rather than drifting with viewport height. */
.sky-controls .sky-star:nth-child(7){left:calc(5vw + 145px);top:56px}
@media(max-width:650px){.sky-controls .sky-star:nth-child(7){left:calc(5vw + 120px);top:52px}}
.sky-controls{z-index:5}

/* Visible daylight cursor: a clean charcoal circle and a quiet grey nucleus. */
:root[data-theme="light"] .oslab-cursor-core{width:5px;height:5px;background:#6c7074;border:0;outline:0;opacity:.88;box-shadow:none;filter:none;animation:none;transform:translate(-50%,-50%)}
:root[data-theme="light"] .oslab-cursor-aura{width:30px;height:30px;background:transparent;box-shadow:none;filter:none}
:root[data-theme="light"] .oslab-cursor-aura.interactive{width:38px;height:38px;background:transparent}
:root[data-theme="light"] .oslab-cursor-aura::before{display:none}
:root[data-theme="light"] .oslab-cursor-aura::after{border:1px solid #50555a;opacity:.9;box-shadow:none;filter:none;animation:none;transform:none}

/* Compact corner navigation, transparent and independent of the page flow. */
header{flex-wrap:nowrap;gap:12px}
header>.lang-switch{order:initial;margin-left:auto}
.navigation-picker{position:relative;flex:none;order:initial}
.navigation-picker>summary{display:flex;align-items:center;justify-content:center;width:40px;height:44px;padding:0;list-style:none;opacity:.68;transition:opacity .2s}
.navigation-picker>summary::-webkit-details-marker{display:none}
.navigation-picker>summary:is(:hover,:focus-visible),.navigation-picker[open]>summary{opacity:1}
.navigation-icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round}
.navigation-icon path{transition:transform .2s}
.navigation-picker .primary-nav{position:absolute;right:0;top:100%;width:max-content;min-width:155px;max-width:calc(100vw - 12vw);display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start;gap:3px;margin:0;padding:12px 0 10px;border:0;background:transparent;animation:corner-menu-in .2s ease-out}
.navigation-picker:not([open]) .primary-nav{display:none}
.navigation-picker .primary-nav a{display:block;padding:10px 0 10px 18px;font-size:15px;line-height:1.4}
@keyframes corner-menu-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:650px){header{gap:5px}.navigation-picker .primary-nav a{font-size:14px}.navigation-picker>summary{width:36px}}
@media(prefers-reduced-motion:reduce){.navigation-picker .primary-nav{animation:none}}

/* Day cursor: graphite point, restrained halo, responsive hover. */
:root[data-theme="light"] .oslab-cursor-core{width:4px;height:4px;background:#424b48;opacity:.9;transition:width .18s,height .18s,background-color .18s}
:root[data-theme="light"] .oslab-cursor-aura{width:23px;height:23px;border:0;background:transparent;transition:width .25s cubic-bezier(.2,.7,.3,1),height .25s cubic-bezier(.2,.7,.3,1),opacity .18s,background-color .25s}
:root[data-theme="light"] .oslab-cursor-aura::after{border:.7px solid #56635f;opacity:.42;transition:opacity .25s,border-color .25s}
:root[data-theme="light"] .oslab-cursor-aura.interactive{width:39px;height:39px;background:rgba(84,110,101,.045)}
:root[data-theme="light"] .oslab-cursor-aura.interactive::after{opacity:.7;border-color:#43594f}
:root[data-theme="light"] :is(.primary-nav a,.language-options a,.navigation-picker>summary,.language-picker>summary,.theme-toggle,.text-link):is(:hover,:focus-visible){filter:none;text-shadow:none;opacity:1;color:#263c35}

/* Optional readable view, available alongside the navigation. */
.reading-toggle{display:flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;padding:9px;border:0;border-radius:50%;background:transparent;color:inherit;opacity:.68;transition:opacity .2s,background-color .2s}
.reading-toggle svg{width:26px;height:24px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round}
.reading-toggle:is(:hover,:focus-visible),.reading-toggle[aria-pressed="true"]{opacity:1;background:rgba(120,130,125,.1)}
.reading-toggle:focus-visible{outline:2px solid currentColor;outline-offset:3px}
:root.reading-mode{--surface:#fafbf8;--ink:#182d25;--muted:#30483e;color-scheme:light}
:root.reading-mode body{background:var(--surface);color:var(--ink);font-size:20px;line-height:1.85}
:root.reading-mode[data-theme="dark"],:root.reading-mode[data-theme="twilight"]{--surface:#101c26;--ink:#f4f7f5;--muted:#d3e1df;color-scheme:dark}
:root.reading-mode .atmosphere,:root.reading-mode .sky-controls,:root.reading-mode .oslab-cursor-core,:root.reading-mode .oslab-cursor-aura,:root.reading-mode .blue-uv-light,:root.reading-mode .oslab-light-pulse{display:none!important}
:root.reading-mode header::before{display:none}
:root.reading-mode :is(a,button,summary,p,h1,h2,h3,.eyebrow,.section-label,.hero-aside,.project-title,.project-title small,.timeline-phase,footer,.contact-bottom,.discipline){color:var(--ink)!important;opacity:1!important;text-shadow:none!important;filter:none!important}
:root.reading-mode :is(body,a,button,summary){cursor:auto!important}
:root.reading-mode :is(a,button,summary){cursor:pointer!important}
:root.reading-mode :is(.hero-intro,.hero-message p,.studio-columns p,.practice-list p,.project-copy p,.contact-bottom,footer){font-size:20px!important;line-height:1.85!important}
:root.reading-mode :is(.primary-nav a,.language-options a,.hero-aside a,.text-link,.legal-nav a,.timeline-phase,.eyebrow,.section-label,.project-title small){font-size:17px!important;line-height:1.65!important}
:root.reading-mode :is(.practice-list h3,.project-title){font-size:24px!important;line-height:1.5}
:root.reading-mode :is(.section h2,.contact h2){font-size:34px!important}
:root.reading-mode .hero h1{font-size:clamp(36px,4.5vw,56px)!important;line-height:1.4}
:root.reading-mode :is(a,button,summary){min-height:44px}
:root.reading-mode .language-options{width:58px}
:root.reading-mode .language-options>a{width:54px}
:root.reading-mode .project-list::before,:root.reading-mode .book-project::before,:root.reading-mode .book-project .timeline-phase::before,:root.reading-mode .book-project .project-title::before{animation:none;box-shadow:none}
:root.reading-mode *{animation:none!important;scroll-behavior:auto!important}
@media(max-width:650px){header{gap:2px}.reading-toggle{width:40px;padding:7px}:root.reading-mode .hero-aside{grid-template-columns:1fr}:root.reading-mode .hero-layout{padding-top:55px}:root.reading-mode .project-title{min-width:0;width:100%}}

/* Search lives next to the globe; results navigate within the current language. */
.search-toggle{display:flex;align-items:center;justify-content:center;width:40px;height:44px;flex:none;padding:10px;border:0;background:transparent;color:inherit;opacity:.68}
.search-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round}
.search-toggle:is(:hover,:focus-visible){opacity:1}
.site-search{position:fixed;inset:12vh auto auto 50%;transform:translateX(-50%);margin:0;width:min(560px,calc(100vw - 32px));max-height:75vh;overflow:auto;padding:24px;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--ink);box-shadow:0 20px 70px rgba(0,0,0,.14)}
.site-search::backdrop{background:rgba(20,30,28,.28);backdrop-filter:blur(3px)}
.search-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}
.search-heading h2{font-size:21px;font-weight:400;margin:0}
.search-close{width:44px;height:44px;flex:none;border:0;background:transparent;color:inherit;font-size:26px;font-weight:300}
.search-label{display:block;font-size:14px;margin:12px 0 6px}
.site-search input{width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--muted);border-radius:6px;background:transparent;color:inherit;font:inherit;font-size:18px}
.search-status{font-size:15px;line-height:1.6}
.search-results{display:flex;flex-direction:column;gap:6px}
.search-results a{display:block;padding:14px 8px;border-bottom:1px solid var(--line);min-height:44px}
.search-results strong{display:block;font-size:18px;font-weight:400}
.search-results span{display:block;font-size:15px;line-height:1.7;opacity:.8;margin-top:5px}
.search-results a:is(:hover,:focus-visible){background:rgba(120,135,130,.08);text-decoration:none}
:root.reading-mode .site-search input{font-size:20px}
:root.reading-mode .search-results span{font-size:18px;opacity:1}
@media(max-width:650px){.search-toggle{width:34px;padding:8px}.lang-switch{gap:0}.site-search{padding:18px;inset-block-start:9vh}}

/* Frosted search surface lets the sky remain quietly visible. */
.site-search{background:rgba(244,249,249,.62);backdrop-filter:blur(14px) saturate(110%);-webkit-backdrop-filter:blur(14px) saturate(110%);border-color:rgba(135,156,151,.22);box-shadow:0 16px 55px rgba(25,40,36,.12)}
:root[data-theme="dark"] .site-search{background:rgba(23,34,31,.62);border-color:rgba(220,235,227,.16)}
:root[data-theme="twilight"] .site-search{background:rgba(16,19,85,.62);border-color:rgba(146,170,255,.22)}
:root[data-theme="dream"] .site-search{background:rgba(237,231,248,.62);border-color:rgba(137,137,169,.2)}
.site-search::backdrop{background:rgba(20,30,28,.12);backdrop-filter:none;-webkit-backdrop-filter:none}
:root.reading-mode .site-search{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none;border-color:var(--muted)}

/* Language choices stay anchored; only light and opacity respond to selection. */
.language-picker{position:relative;flex:0 0 44px;width:44px;height:44px}
.language-picker .language-options{top:44px;left:50%;right:auto;transform:translateX(-50%);animation:language-reveal-still .18s ease-out}
.language-picker .language-options::after{height:10px;top:-10px;left:0;width:100%}
:root[data-theme] .language-options a,:root[data-theme] .language-options a:is(:hover,:focus-visible,:active){transform:none;transition:opacity .2s,color .2s,filter .2s;text-decoration:none}
:root[data-theme] .language-options a.language-flash{animation:language-select-still .18s ease-out both;transform:none}
@keyframes language-reveal-still{from{opacity:0}to{opacity:1}}
@keyframes language-select-still{0%{text-shadow:none}45%{color:#b9deff;text-shadow:0 0 5px #70b6ff,0 0 13px rgba(146,116,255,.7)}100%{text-shadow:0 0 3px rgba(113,169,255,.4)}}
@media(prefers-reduced-motion:reduce){.language-picker .language-options,:root[data-theme] .language-options a.language-flash{animation:none}}

/* A concise media-art introduction with a distinct human voice. */
.hero-message .hero-dialogue{font-size:clamp(18px,1.8vw,23px);line-height:1.65;color:var(--ink);margin:0 0 24px;letter-spacing:.02em;max-width:640px}
.hero-message .hero-intro{font-size:17px;line-height:1.85;max-width:610px}
.hero-intro span+span{margin-top:.85em}
.hero h1[lang="de"]{font-family:Georgia,'Times New Roman',serif;letter-spacing:.01em;margin-bottom:17px}
@media(max-width:650px){.hero-message .hero-dialogue{font-size:19px;margin-bottom:22px}.hero-message .hero-intro{font-size:16px}.hero h1[lang="de"]{font-size:clamp(34px,9vw,45px)}}
:root.reading-mode .hero-dialogue{font-size:24px!important;line-height:1.7!important}

.language-picker[open] .language-options{animation:language-reveal-still .18s ease-out;transform:translateX(-50%)}

/* A quieter title shares the text column and uses a contemporary sans serif. */
.hero-message h1#hero-title{font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:clamp(28px,2.6vw,36px);font-weight:400;line-height:1.45;letter-spacing:.015em;max-width:610px;margin:28px 0 24px;padding:0;text-indent:0}
body:is(:lang(zh-Hant),:lang(zh-Hans)) .hero-message h1#hero-title{font-family:'PingFang TC','PingFang SC','Noto Sans CJK TC','Microsoft JhengHei',sans-serif;letter-spacing:.035em}
@media(max-width:650px){.hero-message h1#hero-title{font-size:26px;line-height:1.5;margin:24px 0 22px}}
:root.reading-mode .hero-message h1#hero-title{font-size:clamp(32px,3.6vw,44px)!important}

/* Pointer light adds a soft accent without washing out the lettering. */
:root[data-theme="dark"]{--torch-color:#ced8d2}
:root[data-theme="twilight"]{--torch-color:#95b7e4}
:root[data-theme="dream"]{--torch-color:#69617f}
:root[data-theme] .uv-lit{opacity:.9;text-shadow:0 0 4px rgba(var(--torch-rgb),calc(var(--uv-strength,.7)*.16));filter:none;transition:color .28s,text-shadow .28s,opacity .28s}
:root[data-theme] .blue-uv-light.visible{opacity:.25}
:root[data-theme="twilight"] :is(.primary-nav a,:is(.lang-switch,.language-picker) a,.language-picker>summary,.theme-toggle,.text-link,.hero-aside a,.project-list summary):is(:hover,:focus-visible){color:#95b7e4;opacity:.9;text-shadow:0 0 4px rgba(78,163,255,.15);filter:none}
:root[data-theme="light"] .uv-lit{color:#344b41!important;text-shadow:none;opacity:.9}
:root.reading-mode .uv-lit{opacity:1!important;text-shadow:none!important}

/* A captured previous sky dissolves over the new atmosphere. */
.sky-transition-snapshot{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.sky-transition-snapshot>div{position:absolute;inset:0;width:100%;height:100%}
.sky-transition-snapshot>div canvas{display:block;width:100%;height:100%}
.sky-transition-snapshot>canvas{position:absolute;inset:-18px;width:calc(100% + 36px);height:calc(100% + 36px);filter:blur(17px)}
body{transition:background-color 2.2s cubic-bezier(.4,0,.2,1),color 1.8s ease}
:is(.hero h1,.hero-message p,.eyebrow,.section-label,.hero-aside,.section h2,.practice-list h3,.practice-list p,footer,.contact-bottom){transition:color 1.8s ease}
#fog-canvas{transition:opacity 2.2s ease,filter 2.2s ease}
:root.reading-mode .sky-transition-snapshot{display:none}

/* Tau is a quieter, smaller warm light in the lower-left sky. */
.sky-controls .sky-star[data-planet="tau"]{left:8%;top:87%;--planet-size:3px;--planet-color:#d6c991;--planet-glow:rgba(204,188,122,.28)}
.sky-controls .sky-star[data-planet="tau"]::before{background:radial-gradient(circle,#eee6c8,#d6c991 70%,#bcad76);box-shadow:0 0 3px rgba(204,188,122,.3),0 0 7px rgba(204,188,122,.14)}
@media(max-width:650px){.sky-controls .sky-star[data-planet="tau"]{left:8%;top:89%}}
/* Dream shares the clean, legible daytime cursor. */
:root[data-theme="dream"] .oslab-cursor-core{width:4px;height:4px;background:#424b48;opacity:.9;border:0;outline:0;box-shadow:none;filter:none;animation:none;transform:translate(-50%,-50%);transition:width .18s,height .18s,background-color .18s}
:root[data-theme="dream"] .oslab-cursor-aura{width:23px;height:23px;border:0;background:transparent;box-shadow:none;filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;transition:width .25s cubic-bezier(.2,.7,.3,1),height .25s cubic-bezier(.2,.7,.3,1),opacity .18s,background-color .25s}
:root[data-theme="dream"] .oslab-cursor-aura::before{display:none}
:root[data-theme="dream"] .oslab-cursor-aura::after{inset:0;border:.7px solid #56635f;background:transparent;opacity:.42;box-shadow:none;filter:none;animation:none;transform:none;transition:opacity .25s,border-color .25s}
:root[data-theme="dream"] .oslab-cursor-aura.interactive{width:39px;height:39px;background:rgba(84,110,101,.045)}
:root[data-theme="dream"] .oslab-cursor-aura.interactive::after{opacity:.7;border-color:#43594f}
:root[data-theme="dream"] :is(.blue-uv-light,.oslab-light-pulse){display:none}
:root[data-theme="dream"] .uv-lit{color:#344b41!important;text-shadow:none;filter:none;opacity:.9}

/* Separate soft white cloud banks drift across the romantic sky. */
.dream-clouds{display:none;position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:3}
:root[data-theme="dream"] .dream-clouds{display:block}
.dream-cloud{position:absolute;left:calc(-1 * var(--cloud-width));top:var(--cloud-top);width:var(--cloud-width);height:clamp(150px,25vw,290px);border-radius:50%;background:radial-gradient(ellipse at 30% 58%,rgba(255,255,255,.95),transparent 55%),radial-gradient(ellipse at 58% 39%,rgba(255,255,255,.9),transparent 58%),radial-gradient(ellipse at 76% 62%,rgba(255,255,255,.8),transparent 50%);filter:blur(24px);opacity:0;animation:dream-cloud-passage var(--cloud-duration) linear forwards}
@keyframes dream-cloud-passage{0%{transform:translateX(0);opacity:0}12%{opacity:var(--cloud-opacity)}75%{opacity:var(--cloud-opacity)}100%{transform:translate(calc(100vw + var(--cloud-width) * 2),var(--cloud-rise));opacity:0}}
@media(prefers-reduced-motion:reduce){.dream-clouds{display:none!important}}

/* Denser clouds momentarily veil the star field. */
.dream-cloud{filter:blur(18px);background:radial-gradient(ellipse at 30% 58%,#fff 0%,rgba(255,255,255,.95) 23%,transparent 58%),radial-gradient(ellipse at 58% 39%,#fff 0%,rgba(255,255,255,.9) 25%,transparent 62%),radial-gradient(ellipse at 76% 62%,rgba(255,255,255,.95),transparent 56%)}
/* A short, translucent lake reflection passes across the dream sky. */
.dream-lake{position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none;opacity:0;visibility:hidden;background:linear-gradient(180deg,rgba(225,239,252,.06),rgba(247,232,247,.32) 48%,rgba(183,220,239,.45))}
:root[data-theme="dream"] .dream-lake.lake-active{visibility:visible;animation:lake-appearance 6.5s ease-in-out both}
.lake-reflection{position:absolute;inset:0;width:100%;height:100%;filter:blur(.7px);opacity:.5;mask-image:linear-gradient(transparent 25%,#000 55%);-webkit-mask-image:linear-gradient(transparent 25%,#000 55%)}
.lake-light-wave{position:absolute;left:-30%;top:-30%;width:160%;height:25%;transform:rotate(-9deg);background:linear-gradient(transparent,rgba(255,255,255,.18) 35%,rgba(255,255,255,.68) 50%,rgba(225,251,255,.25) 60%,transparent);filter:blur(12px)}
.lake-active .lake-light-wave{animation:lake-wave 6s ease-in-out both}
.lake-ripple{position:absolute;width:110px;height:110px;border:1px solid rgba(255,255,255,.62);border-radius:50%;box-shadow:0 0 9px rgba(255,255,255,.25),inset 0 0 8px rgba(255,255,255,.15);opacity:0;transform:translate(-50%,-50%) scale(0) scaleY(.28)}
.lake-ripple::after{content:'';position:absolute;inset:12%;border:.7px solid rgba(255,255,255,.4);border-radius:50%}
.lake-active .lake-ripple{animation:lake-ripple 5.5s ease-out both}
@keyframes lake-appearance{0%,100%{opacity:0}25%,65%{opacity:.8}}
@keyframes lake-wave{from{top:-30%;opacity:0}20%{opacity:.7}70%{opacity:.5}to{top:115%;opacity:0}}
@keyframes lake-ripple{0%{opacity:0;transform:translate(-50%,-50%) scale(.25) scaleY(.28)}20%{opacity:.55}100%{opacity:0;transform:translate(-50%,-50%) scale(4.5) scaleY(.28)}}
@media(prefers-reduced-motion:reduce){.dream-lake{display:none!important}}

/* Cotton-like irregular lobes and loose wisps replace the smooth cloud bank. */
.lake-light-wave{display:none!important}
.dream-cloud{height:var(--cloud-height);background:none;filter:none;border-radius:0}
.dream-cloud i{position:absolute;display:block;border-radius:43% 57% 61% 39% / 56% 42% 58% 44%;background:radial-gradient(ellipse,rgba(255,255,255,.98) 0%,rgba(255,255,255,.9) 35%,rgba(255,255,255,.45) 60%,transparent 77%);filter:blur(9px);transform:rotate(var(--cloud-tilt));}
.dream-cloud i:nth-child(3n){filter:blur(5px);border-radius:63% 37% 42% 58% / 41% 59% 36% 64%}
.dream-cloud i:nth-child(4n)::after{content:'';position:absolute;inset:-12% -40%;background:radial-gradient(ellipse,rgba(255,255,255,.4),transparent 68%);filter:blur(6px);transform:rotate(-18deg) scaleY(.35)}

/* Compact transparent contact controls retain a comfortable invisible hit area. */
.social-links{gap:8px}
:root[data-theme] .social-links a{width:40px;height:40px;min-width:40px;min-height:40px;padding:10px;border:0;border-radius:50%;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;position:relative}
.social-links a::before{content:'';position:absolute;inset:5px;border:.6px solid currentColor;border-radius:9px;opacity:.22;pointer-events:none}
.social-links a svg{width:18px;height:18px}
:root.reading-mode .social-links a{width:48px;height:48px;min-width:48px;min-height:48px;padding:12px}

:root[data-theme] .contact .social-links a{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* Broad, slow cirrostratus veils, with fine stretched cloud fibres. */
.dream-cloud{left:calc(-.55 * var(--cloud-width));filter:blur(9px)}
.dream-cloud i{filter:blur(16px);background:radial-gradient(ellipse,rgba(255,255,255,.83),rgba(255,255,255,.52) 40%,rgba(255,255,255,.2) 62%,transparent 80%);transform:rotate(var(--cloud-tilt)) scaleY(.65)}
.dream-cloud i:nth-child(3n){filter:blur(12px)}
.dream-cloud i:nth-child(4n)::after{inset:-10% -65%;filter:blur(8px);transform:rotate(-12deg) scaleY(.18)}

/* A fine paper plane glides across daylight and dream skies. */
:root:is([data-theme="light"],[data-theme="dream"]) .oslab-cursor-core{width:26px;height:26px;border:0;outline:0;border-radius:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cpath d='M6.1 5.2Q3.2 3.8 4.3 7L10.2 22Q11.4 25 13.1 22.1L16.6 16.6 22.3 13.4Q25.3 11.8 22.4 10.5Z' fill='%23f9fcfc' fill-opacity='.8' stroke='%23536168' stroke-width='1.05' stroke-linejoin='round'/%3E%3Cpath d='M16.6 16.6 5.3 6M16.6 16.6l.5 3q.2 1.4-1.1.8l-2.8-1.8' fill='none' stroke='%23536168' stroke-width='.8' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;box-shadow:none;filter:none;animation:none;transform:translate(-50%,-50%);transition:width .2s,height .2s;opacity:.95}
:root:is([data-theme="light"],[data-theme="dream"]) .oslab-cursor-core.interactive{width:29px;height:29px}
:root:is([data-theme="light"],[data-theme="dream"]) .oslab-cursor-aura{display:none}
.cursor-water-ripple{position:fixed;left:0;top:0;width:22px;height:22px;border:.7px solid rgba(100,139,151,.35);border-radius:50%;pointer-events:none;z-index:2147483645;animation:cursor-water-spread 1.9s ease-out forwards}
.cursor-water-ripple::before,.cursor-water-ripple::after{content:'';position:absolute;inset:18%;border:.65px solid rgba(119,163,173,.25);border-radius:50%}
.cursor-water-ripple::after{inset:36%;border-color:rgba(255,255,255,.65)}
.cursor-water-ripple.clicked{width:28px;height:28px;border-color:rgba(100,139,151,.45)}
@keyframes cursor-water-spread{0%{opacity:0;transform:translate(-50%,-50%) scale(.4) scaleY(.62)}15%{opacity:.65}100%{opacity:0;transform:translate(-50%,-50%) scale(3.6) scaleY(.62)}}
:root.reading-mode .cursor-water-ripple{display:none!important}
@media(prefers-reduced-motion:reduce){.cursor-water-ripple{display:none!important}}

/* Oblique paper-plane perspective: two wings and a subtle folded keel. */
:root:is([data-theme="light"],[data-theme="dream"]) .oslab-cursor-core{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cpath d='M3.4 10.2Q2.4 9.8 3.7 9.4L23.4 5.4Q25.3 5 24.4 6.8L19.7 14.2 23.5 19.6Q24.5 21.2 22.5 21L3.4 10.2Z' fill='%23fbfdfc' fill-opacity='.87' stroke='%23536168' stroke-width='1' stroke-linejoin='round'/%3E%3Cpath d='M3.6 10 19.7 14.2 22.5 21 12.1 16.3Z' fill='%23d8e2df' fill-opacity='.58'/%3E%3Cpath d='M3.6 10 19.7 14.2M12.1 16.3l1.4 3.2q.4.9 1.3.2l4.9-5.5' fill='none' stroke='%23536168' stroke-width='.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

/* Rear three-quarter view, with two rounded wings opening toward the viewer. */
:root:is([data-theme="light"],[data-theme="dream"]) .oslab-cursor-core{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cpath d='M22.5 4.2Q24.6 2.8 23.8 5.4L20.4 21.2Q20 23.2 18.4 21.9L13.3 17.6 6.1 19.2Q3.8 19.8 5.3 17.9Z' fill='%23fbfdfc' fill-opacity='.88' stroke='%23536168' stroke-width='1' stroke-linejoin='round'/%3E%3Cpath d='M23.3 4.5 13.3 17.6 18.4 21.9 16.4 15.8Z' fill='%23d8e2df' fill-opacity='.5'/%3E%3Cpath d='M23.3 4.5 13.3 17.6M13.3 17.6l-.2 4q0 1.2 1 .4l4.3-3.3' fill='none' stroke='%23536168' stroke-width='.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

/* A soft side-profile glider with a gently curved folded wing. */
:root:is([data-theme="light"],[data-theme="dream"]) .oslab-cursor-core{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cpath d='M3.8 13Q2 12.4 4.1 11.9L23.1 7.3Q25.3 6.8 24 8.7L18.4 15.1 20.2 20.1Q20.8 21.8 18.9 21L10.2 16Z' fill='%23fbfdfc' fill-opacity='.86' stroke='%23616d70' stroke-width='.95' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M4 12.4 18.4 15.1 18.9 21 10.2 16Z' fill='%23dce5e2' fill-opacity='.42'/%3E%3Cpath d='M4 12.4Q11 13.1 18.4 15.1M10.2 16l3.1 1.1' fill='none' stroke='%23616d70' stroke-width='.75' stroke-linecap='round'/%3E%3C/svg%3E")}

/* Hand-drawn paper plane: loose contour and a softly uneven fold. */
:root:is([data-theme="light"],[data-theme="dream"]) .oslab-cursor-core{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cpath d='M4.1 12.4Q8.7 10.7 13.8 9.4L23 6.5Q24.1 6.2 23.5 7.3L18.6 14.8Q19.5 17.3 20.4 20.3Q20.6 21 19.7 20.6L10.5 16.6Q7.1 14.4 4.1 12.4Z' fill='%23fffefa' fill-opacity='.62' stroke='%235e686a' stroke-width='1.05' stroke-linejoin='round' stroke-linecap='round'/%3E%3Cpath d='M4.5 12.5Q11.3 13.7 18.6 14.8M18.5 14.9Q20.8 10.8 23.1 7M10.7 16.4l1.5 3.1q.4.7 1 .2l3.3-2.3' fill='none' stroke='%235e686a' stroke-width='.8' stroke-linecap='round'/%3E%3Cpath d='M5 11.8Q14.2 8.7 22 6.2' fill='none' stroke='%235e686a' stroke-opacity='.22' stroke-width='.45' stroke-linecap='round'/%3E%3C/svg%3E")}

/* Blue-violet luminous orb with a bright centre and a short fading wake. */
:root[data-theme] .oslab-cursor-core{width:14px;height:14px;border:0;outline:0;border-radius:50%;background:radial-gradient(circle,#f5ffff 0%,#c3f4ff 20%,#8b9fff 48%,rgba(106,84,245,.25) 72%,transparent 100%);box-shadow:0 0 7px rgba(182,237,255,.8),0 0 17px rgba(96,89,244,.7),0 0 29px rgba(94,58,218,.3);filter:none;animation:none;opacity:1;transform:translate(-50%,-50%);transition:width .2s,height .2s}
:root[data-theme] .oslab-cursor-core.interactive{width:17px;height:17px}
:root[data-theme] .oslab-cursor-aura{display:block;width:58px;height:58px;border:0;border-radius:50%;background:radial-gradient(circle,rgba(125,121,255,.28),rgba(89,54,225,.16) 40%,transparent 73%);box-shadow:none;filter:blur(4px);backdrop-filter:none;-webkit-backdrop-filter:none}
:root[data-theme] .oslab-cursor-aura.interactive{width:68px;height:68px;background:radial-gradient(circle,rgba(125,121,255,.3),rgba(89,54,225,.15) 40%,transparent 73%)}
:root[data-theme] .oslab-cursor-aura::before,:root[data-theme] .oslab-cursor-aura::after{display:none}
.orb-wake{position:fixed;width:24px;height:24px;border-radius:50%;pointer-events:none;z-index:2147483645;background:radial-gradient(circle,rgba(146,178,255,.42),rgba(94,57,231,.18) 40%,transparent 74%);filter:blur(3px);animation:orb-wake-fade .55s ease-out forwards}
@keyframes orb-wake-fade{from{opacity:.55;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.45)}}
:root.reading-mode :is(.oslab-cursor-aura,.orb-wake){display:none!important}
@media(prefers-reduced-motion:reduce){.orb-wake{display:none!important}}

/* Continuous neon light ribbon, with a precise pointer at its leading edge. */
.neon-cursor-ribbon{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:2147483644}
:root[data-theme] .oslab-cursor-aura{display:none}
:root[data-theme] .oslab-cursor-core{width:6px;height:6px;background:#f5fcff;box-shadow:0 0 4px #c8eaff,0 0 10px #8e77ff;opacity:1}
:root[data-theme] .oslab-cursor-core.interactive{width:8px;height:8px}
:root.reading-mode .neon-cursor-ribbon{display:none}
@media(prefers-reduced-motion:reduce){.neon-cursor-ribbon{display:none}}

/* Fine double-circle cursor inspired by the Codrops filter demo. */
.oslab-filter-cursor{position:fixed;top:0;left:0;width:140px;height:140px;pointer-events:none;z-index:2147483645;opacity:0;overflow:visible;color:#dbe3df}
.oslab-filter-cursor circle{fill:none;stroke:currentColor;stroke-width:1.2px}
:root[data-theme="light"] .oslab-filter-cursor,:root[data-theme="dream"] .oslab-filter-cursor{color:#45514f}
:root[data-theme="twilight"] .oslab-filter-cursor{color:#adc1ee}
:root.reading-mode .oslab-filter-cursor{display:none}
@media(prefers-reduced-motion:reduce),(hover:none),(pointer:coarse){.oslab-filter-cursor{display:none}}
/* Centered, translucent circular inquiry panels. */
.site-search{--inquiry-size:min(560px,92vw,84dvh);inset:50% auto auto 50%;transform:translate(-50%,-50%);width:var(--inquiry-size);height:var(--inquiry-size);max-height:none;box-sizing:border-box;border-radius:50%;padding:calc(var(--inquiry-size)*.15) calc(var(--inquiry-size)*.12);overflow:hidden;background:rgba(244,249,249,.24);backdrop-filter:blur(5px) saturate(105%);-webkit-backdrop-filter:blur(5px) saturate(105%);box-shadow:0 12px 48px rgba(25,40,36,.08)}
.site-search[open]{display:flex;flex-direction:column;justify-content:center}
:root[data-theme="dark"] .site-search{background:rgba(23,34,31,.25)}
:root[data-theme="twilight"] .site-search{background:rgba(16,19,85,.25)}
:root[data-theme="dream"] .site-search{background:rgba(237,231,248,.24)}
.site-search .search-results{min-height:0;overflow:auto;max-height:calc(var(--inquiry-size)*.28);scrollbar-width:thin}
.site-search .search-heading{flex:none}
.site-search .search-heading h2{font-size:18px}
.site-search input{flex:none;border-radius:24px;font-size:16px}
.site-search .search-status{font-size:13px;line-height:1.5;margin:10px 0}
.site-search::backdrop{background:rgba(20,30,28,.05)}
@media(max-width:650px){.site-search{padding:calc(var(--inquiry-size)*.14) calc(var(--inquiry-size)*.12)}.site-search .search-heading h2{font-size:16px}.site-search .search-label{font-size:13px}.site-search .search-results strong{font-size:15px}.site-search .search-results span{font-size:13px}}
:root.reading-mode .site-search{background:var(--surface)}
/* Separate the studio introduction from its creative disciplines. */
.studio-columns{margin-bottom:0}
.studio-columns+h3{margin-top:clamp(64px,8vw,96px);margin-bottom:24px}
@media(max-width:650px){.studio-columns+h3{margin-top:64px;margin-bottom:20px}}

/* A generous pause before the creative disciplines. */
.studio-columns+h3{margin-top:clamp(112px,12vw,160px);margin-bottom:32px}
@media(max-width:650px){.studio-columns+h3{margin-top:104px;margin-bottom:28px}}
/* Make the geographic introduction easier to read. */
.hero-message>.eyebrow{font-size:15px;line-height:1.65}
@media(max-width:650px){.hero-message>.eyebrow{font-size:13px;line-height:1.7}}

/* Navigation remains accessible as visitors explore the page. */
header{position:sticky;top:0;z-index:20}
header::before{bottom:0;mask-image:none;-webkit-mask-image:none;opacity:.35}
.language-picker .language-options{margin-top:0;padding-top:10px}
/* Only the navigation symbol follows visitors while scrolling. */
header{position:relative;top:auto}
header>.navigation-picker{position:fixed;top:32px;right:calc(5vw + 56px);z-index:20}
header>.language-picker{margin-left:52px}
@media(max-width:650px){header>.navigation-picker{top:19px;right:calc(6vw + 46px)}header>.language-picker{margin-left:38px}}
/* A quiet translucent bubble for the floating navigation. */
.navigation-picker>summary{position:relative;isolation:isolate;width:44px;height:44px;border-radius:50%}
.navigation-picker>summary::before{content:'';position:absolute;inset:3px;border-radius:48% 52% 51% 49%;border:1px solid rgba(180,202,195,.45);background:radial-gradient(ellipse at 29% 22%,rgba(239,251,247,.14),transparent 49%),rgba(166,198,186,.025);box-shadow:inset 0 0 8px rgba(225,244,235,.06);transition:transform .35s ease,border-radius .35s ease,background .35s ease;z-index:-1}
:root[data-theme="light"] .navigation-picker>summary::before,:root[data-theme="dream"] .navigation-picker>summary::before{border-color:rgba(79,105,98,.35);background:radial-gradient(ellipse at 29% 22%,rgba(255,255,255,.32),transparent 49%),rgba(161,192,184,.04)}
:root[data-theme="twilight"] .navigation-picker>summary::before{border-color:rgba(157,185,239,.42);background:radial-gradient(ellipse at 29% 22%,rgba(178,204,255,.13),transparent 49%)}
.navigation-picker>summary:is(:hover,:focus-visible)::before,.navigation-picker[open]>summary::before{transform:scale(1.08);border-radius:52% 48% 47% 53%}
.navigation-picker .navigation-icon{width:19px;height:19px;overflow:visible}
.navigation-picker .navigation-icon path{d:path('M6 8h12M6 16h12');transition:d .3s ease}
.navigation-picker[open] .navigation-icon path{d:path('M7 7l10 10M7 17L17 7')}
@media(prefers-reduced-motion:reduce){.navigation-picker>summary::before,.navigation-picker .navigation-icon path{transition:none}}

header>.navigation-picker{top:var(--menu-top,32px)}
@media(max-width:650px){header>.navigation-picker{top:var(--menu-top,19px)}}

/* The header keeps its plain menu; a breathing bubble appears after scrolling. */
header>.navigation-picker{position:relative;top:auto;right:auto}
header>.language-picker{margin-left:0}
header>.navigation-picker>summary::before{display:none}
header>.navigation-picker .navigation-icon path{d:path('M6 8h12M6 16h12')}
header>.navigation-picker[open] .navigation-icon path{d:path('M7 7l10 10M7 17L17 7')}
.floating-navigation{position:fixed;top:32px;right:calc(5vw + 56px);z-index:20;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(8px) scale(.94);transition:opacity .7s ease,transform .7s ease,visibility .7s}
.floating-navigation.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1)}
.floating-navigation>summary::before{animation:menu-bubble-breathe 4.8s ease-in-out infinite}
@keyframes menu-bubble-breathe{0%,100%{opacity:.55;box-shadow:0 0 4px rgba(183,208,222,.08);transform:scale(.98)}50%{opacity:.95;box-shadow:0 0 12px rgba(183,208,222,.2);transform:scale(1.04)}}
@media(max-width:650px){header>.navigation-picker{top:auto;right:auto}header>.language-picker{margin-left:0}.floating-navigation{top:19px;right:calc(6vw + 46px)}}
@media(prefers-reduced-motion:reduce){.floating-navigation{transition:none}.floating-navigation>summary::before{animation:none}}

/* Restore the luminous breathing cursor across all four skies. */
@media (hover:hover) and (pointer:fine){
  html.breathing-cursor,html.breathing-cursor *{cursor:none!important}
}
:root[data-theme] .oslab-cursor-core{width:5.5px;height:5.5px;border:0;outline:0;border-radius:50%;background:#fffefa;color:#ffc5ec;filter:none;transition:width .2s,height .2s;animation:oslab-restored-breath 3.6s ease-in-out infinite,oslab-restored-spectrum 12s linear infinite}
:root[data-theme] .oslab-cursor-core.interactive{width:7px;height:7px}
:root[data-theme] .oslab-cursor-aura{display:block;width:32px;height:32px;border:0;background:transparent;box-shadow:none;filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;transition:width .24s,height .24s,opacity .18s}
:root[data-theme] .oslab-cursor-aura.interactive{width:44px;height:44px;background:transparent}
:root[data-theme] .oslab-cursor-aura::before{display:none}
:root[data-theme] .oslab-cursor-aura::after{content:'';display:block;position:absolute;inset:0;border:.75px solid currentColor;border-radius:50%;background:transparent;filter:none;color:#ff9ed2;box-shadow:0 0 3px currentColor;animation:oslab-restored-rim-breath 3.6s ease-in-out infinite,oslab-restored-spectrum 12s linear infinite}
@keyframes oslab-restored-breath{0%,100%{opacity:.72;transform:translate(-50%,-50%) scale(.82);box-shadow:0 0 4px 1px currentColor,0 0 9px currentColor}50%{opacity:1;transform:translate(-50%,-50%) scale(1.38);box-shadow:0 0 6px 1px #fff,0 0 12px 3px currentColor,0 0 22px currentColor}}
@keyframes oslab-restored-rim-breath{0%,100%{opacity:.48;transform:scale(.91)}50%{opacity:.86;transform:scale(1.09)}}
@keyframes oslab-restored-spectrum{0%,100%{color:#ff8fc7}16.667%{color:#ffb478}33.333%{color:#dcca66}50%{color:#6bcda1}66.667%{color:#72b9ee}83.333%{color:#b197e9}}
@media(prefers-reduced-motion:reduce),(hover:none),(pointer:coarse){:root[data-theme] .oslab-cursor-core,:root[data-theme] .oslab-cursor-aura{display:none}}
:root.reading-mode .oslab-cursor-core,:root.reading-mode .oslab-cursor-aura{display:none!important}