:root{color-scheme:dark;--ink:#f7f3ff;--muted:#bcb2d0;--violet:#b6a5ff;--line:rgba(225,209,255,.14);--panel:#201933;--accent:#b6a5ff;font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:#171125;color:var(--ink);overflow:hidden}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button{border:0;background:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #adf4e0;outline-offset:5px}button:disabled{opacity:.4;cursor:wait}[hidden]{display:none!important}.skip{position:fixed;top:-80px;left:20px;z-index:100;background:#b7a5ff;padding:12px;color:#171125}.skip:focus{top:15px}
.topbar{height:78px;padding:0 32px;display:flex;align-items:center;gap:32px;position:relative;z-index:30;background:linear-gradient(180deg,#20172f,#1b1529);border-bottom:1px solid var(--line)}.wordmark{display:flex;gap:14px;align-items:center;font-size:20px;font-weight:650;letter-spacing:3px}.wordmark small{display:block;letter-spacing:2.8px;font-size:8px;color:#a99dbd;margin-top:5px;font-weight:400}.logo-orb{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 33% 25%,#fff 0,#ded2ff 12%,#a199f1 46%,#7160a9 75%);box-shadow:0 0 22px #b19ffc45,inset -3px -3px 6px #25183755;border:1px solid #d1c9ff90}.topbar nav{display:flex;gap:24px;margin-left:auto}.topbar nav button{font-size:12px;color:#d4c9e3;padding:12px 0}.topbar nav span{font-size:10px;color:#a99cbf;margin-left:4px}.mode-control{padding:4px;display:flex;border:1px solid var(--line);border-radius:26px;background:#ffffff03}.mode-control button{font-size:11px;border-radius:22px;padding:9px 17px;color:#b9aecb;white-space:nowrap}.mode-control button[aria-pressed=true]{background:#ddd0ff20;color:#fff;box-shadow:inset 0 0 0 1px #e6d2ff12}.mode-control span{margin-left:5px}
.world-stage{height:calc(100dvh - 188px);min-height:270px;position:relative;overflow:hidden;background:#2b2144;isolation:isolate}.stage-vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#160e2650,transparent 18%,transparent 88%,#20172f15)}.world-canvas{position:absolute;inset:0}.world-canvas canvas{width:100%;height:100%;display:block;touch-action:none}.stage-toolbar{position:absolute;left:24px;bottom:24px;display:flex;gap:10px;z-index:4}.round-button{height:38px;width:38px;border-radius:50%;background:#20162eaa;backdrop-filter:blur(12px);border:1px solid #e8dcff24;display:inline-flex;align-items:center;justify-content:center;font-size:19px;color:#e1d3f2}.round-button:hover{background:#534063b0}.zoom-controls{display:flex;gap:6px}.stage-caption{position:absolute;bottom:32px;right:24px;font-size:11px;letter-spacing:1px;display:flex;align-items:center;gap:9px;color:#ece3f8;text-shadow:0 1px 4px #000;pointer-events:none;transition:opacity .3s}.status-dot{height:5px;width:5px;border-radius:50%;background:#afe1d2;box-shadow:0 0 10px #afe1d2}.has-island .stage-caption{opacity:0}.stage-toolbar{transition:opacity .3s}.scene-loading{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);display:flex;gap:14px;align-items:center;padding:18px 26px;border:1px solid var(--line);border-radius:18px;backdrop-filter:blur(20px);background:#20162ee0;font-size:13px;z-index:9}.spinner{width:18px;height:18px;border:1px solid #ffffff35;border-top-color:#a8e5d6;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}

.island-panel{position:absolute;right:0;top:0;bottom:0;width:390px;z-index:10;overflow-y:auto;background:linear-gradient(145deg,#291d3af2,#191329fa);backdrop-filter:blur(28px);border-left:1px solid #e6d2ff20;padding:40px 28px 20px;box-shadow:-25px 0 70px #170d2930;animation:slidein .45s cubic-bezier(.22,1,.36,1)}@keyframes slidein{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}.panel-close,.dialog-close{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;font-size:23px;color:#c8bcd7}.panel-close{position:absolute;top:18px;right:20px}.eyebrow{font-size:9px;letter-spacing:2.5px;font-weight:550;color:var(--accent);margin:0 0 14px}.island-panel h1{font-size:29px;font-weight:600;letter-spacing:2px;margin:0 0 14px;line-height:1.4}.island-line{font-size:14px;line-height:1.9;color:#e1d3ef;margin:0 0 12px}.island-description{font-size:12px;line-height:1.9;color:var(--muted);margin:0 0 17px}.planting-note{display:flex;gap:9px;align-items:center;color:var(--accent);font-size:10px;letter-spacing:.5px}.planting-note>span:first-child{font-size:22px}.panel-rule{display:flex;justify-content:space-between;padding-top:25px;border-top:1px solid var(--line);margin:24px 0 16px;color:#b0a0c3;font-size:10px;letter-spacing:1px}.project-card{display:grid;grid-template-columns:94px 1fr;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);position:relative}.project-image{border-radius:12px;height:98px;background:radial-gradient(circle at 50% 35%,#ffffff14,#ffffff03);overflow:hidden;display:grid;grid-template:minmax(0,1fr)/minmax(0,1fr);place-items:center;border:1px solid #ffffff09}.project-image img{width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain;padding:5px;transition:transform .4s}.project-card:hover img{transform:scale(1.07)}.project-card h3{font-size:14px;line-height:1.6;margin:0 18px 5px 0;font-weight:550}.project-card p{font-size:10px;color:#b7a8c7;line-height:1.8;margin:0}.project-card .card-arrow{position:absolute;right:0;top:20px;color:var(--accent);transition:transform .25s}.project-card:hover .card-arrow{transform:translate(2px,-2px)}.panel-footnote{font-size:10px;color:#9b8caf;display:flex;justify-content:space-between;letter-spacing:.5px;margin:24px 0 0}
.memory-bar{height:110px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 32px;background:linear-gradient(180deg,#1c152b,#21172f);border-top:1px solid var(--line);position:relative;z-index:20}.headquarters-caption{width:180px;flex-shrink:0}.headquarters-caption .eyebrow{font-size:8px;color:#a99bbf;display:block;margin-bottom:7px}.headquarters-caption strong{display:block;font-size:13px;letter-spacing:1px;font-weight:500}.headquarters-caption small{display:block;font-size:10px;margin-top:7px;color:#9586a8}/* Small transparent portraits use each island's actual current 3D model. */
.memory-dock{display:flex;align-items:center;justify-content:center;gap:16px;min-width:0}
.memory-button{min-width:0;flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;position:relative;padding:4px 6px 8px;border-radius:16px;transition:transform .25s,background .25s}
.memory-button:hover{transform:translateY(-3px);background:#ffffff06}
.memory-button:after{content:'';position:absolute;bottom:2px;left:32%;right:32%;height:2px;border-radius:2px;background:var(--orb);opacity:0;transform:scaleX(.45);transition:opacity .25s,transform .25s}
.memory-button[aria-current=true]{background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--orb) 10%,transparent))}
.memory-button[aria-current=true]:after{opacity:.9;transform:scaleX(1)}
.memory-thumbnail{position:relative;display:grid;place-items:center;isolation:isolate;width:88px;max-width:100%;height:64px}
.memory-thumbnail:before{content:'';position:absolute;z-index:-1;bottom:4px;width:70%;height:20px;border-radius:50%;background:var(--orb);filter:blur(14px);opacity:.13;transition:opacity .25s}
.memory-thumbnail img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 4px #09061380);transition:transform .25s,filter .25s}
.memory-button:hover img,.memory-button:focus-visible img{transform:translateY(-2px) scale(1.05)}
.memory-button[aria-current=true] .memory-thumbnail:before{opacity:.42}
.memory-button[aria-current=true] img{filter:drop-shadow(0 2px 8px color-mix(in srgb,var(--orb) 32%,transparent));transform:translateY(-2px)}
.memory-label{font-size:10px;color:#bcaed0;white-space:nowrap;letter-spacing:.5px}.memory-button[aria-current=true] .memory-label{color:#fff}.self-button{display:flex;align-items:center;gap:12px;text-align:left;flex-shrink:0;color:#d6c8e9;font-size:11px}.self-button small{display:block;color:#9182a7;font-size:7px;letter-spacing:1.5px;margin-top:4px}.self-orbit{font-size:38px;color:#98c9ff;filter:drop-shadow(0 0 8px #a2b6ff45)}
dialog{background:#20172f;color:var(--ink);border:1px solid #d7c2f135;border-radius:24px;box-shadow:0 40px 140px #0e081abb;padding:34px;width:min(1050px,calc(100% - 40px));max-height:85dvh;scrollbar-width:thin}dialog::backdrop{background:#100b22a0;backdrop-filter:blur(12px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.dialog-top .eyebrow{margin:0;color:#ae9cc8}dialog h2{font-size:30px;font-weight:500;letter-spacing:1px;line-height:1.5;margin:20px 0 28px}.directory-tools{display:flex;gap:16px;margin-bottom:22px}.search-label{display:flex;align-items:center;gap:12px;background:#ffffff06;border:1px solid var(--line);border-radius:10px;flex:1;padding:0 14px}.search-label>span{font-size:26px;color:#ada0bf}.search-label input{width:100%;background:none;color:#fff;border:0;height:44px;outline:none;font-size:12px}.search-label input::placeholder{color:#8d7caa}.directory-tools select{border:1px solid var(--line);background:#2b203c;color:#d6c9e7;border-radius:10px;padding:0 12px;font-size:12px}.directory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.collection-card{display:block;padding:14px;border:1px solid var(--line);border-radius:15px;background:#ffffff03;transition:background .25s,transform .25s}.collection-card:hover{background:#ffffff08;transform:translateY(-3px)}.collection-card .project-image{height:150px;border:0;margin-bottom:15px}.collection-card h3{font-size:14px;font-weight:550;line-height:1.6;margin:0 0 8px}.collection-card p{font-size:10px;color:#a79aba;margin:0;line-height:1.8}.collection-card .collection-island{display:flex;justify-content:space-between;color:var(--accent);font-size:9px;letter-spacing:1px;margin-top:15px}.collection-card .collection-island span:last-child{font-size:16px}#directory-empty{padding:30px;color:#b4a5c6;font-size:13px;text-align:center}#about-dialog{width:min(630px,calc(100% - 32px));padding:36px 42px}.about-art{height:110px;width:150px;position:relative;margin:20px auto 0;color:#afccff}.about-art>span{position:absolute;inset:10px 0;border:1px solid #b4c6ff80;border-radius:50%;box-shadow:0 0 16px #879df820;transform:rotate(-25deg)}.about-art>span:nth-child(2){transform:rotate(55deg);inset:0 35px}.about-art>span:nth-child(3){transform:rotate(-50deg);inset:25px 0}.about-art>span:last-child{inset:0;display:grid;place-items:center;font-size:60px;border:0;box-shadow:none;transform:none}#about-dialog h2{font-size:28px;margin-bottom:18px}.about-lead{font-size:13px;line-height:2.1;color:#c0b3d0}.about-direction{border-top:1px solid var(--line);padding-top:20px;font-size:18px;letter-spacing:1px}.about-direction small{display:block;font-size:10px;color:#a798bb;letter-spacing:1.5px;margin-bottom:12px}.about-direction>span{color:#9f91bf;margin:0 8px}.about-skills{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.about-skills span{font-size:10px;padding:8px 12px;border-radius:20px;border:1px solid var(--line);color:#cabbe0}.primary-button{border-radius:12px;background:#b6a5ff;color:#211731;padding:13px 18px;display:flex;align-items:center;justify-content:space-between;gap:32px;font-size:12px;margin-top:28px}.hover-label{position:absolute;padding:8px 12px;border:1px solid #d5c2ee55;background:#241a35ed;border-radius:9px;font-size:11px;pointer-events:none;z-index:15;white-space:nowrap}.toast{position:fixed;left:50%;bottom:140px;transform:translateX(-50%);background:#372545f5;color:#eadef5;padding:13px 20px;border-radius:12px;border:1px solid var(--line);z-index:80;font-size:12px;width:max-content;max-width:90%;text-align:center}.noscript-note{position:fixed;inset:100px 30px auto;z-index:60;background:#21172e;padding:30px}.noscript-note a{text-decoration:underline}
@media(min-width:1600px){.topbar{padding:0 44px}.memory-bar{padding:0 44px}.memory-dock{gap:28px}.memory-button{min-width:108px}.memory-thumbnail{width:100px;height:70px}.island-panel{width:430px;padding:48px 36px}.project-image{height:110px}.project-card{grid-template-columns:110px 1fr}}
@media(max-width:900px){.topbar{height:66px;padding:0 20px;gap:18px}.wordmark{font-size:16px;gap:9px;letter-spacing:2px}.wordmark small{font-size:6px;letter-spacing:2px}.logo-orb{width:24px;height:24px}.topbar nav{gap:14px}.mode-control button{padding:8px 12px;font-size:10px}.memory-bar{height:106px;padding:0 18px;gap:12px}.headquarters-caption{width:115px}.headquarters-caption strong{font-size:11px}.headquarters-caption small{font-size:8px}.memory-dock{gap:6px}.memory-button{min-width:73px;gap:2px;padding:6px 3px 8px}.memory-thumbnail{width:76px;height:56px}.memory-label{font-size:9px}.self-button{display:none}.world-stage{height:calc(100dvh - 172px)}.island-panel{width:340px;padding:38px 23px 20px}.island-panel h1{font-size:25px}.directory-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.topbar{height:65px;padding:0 14px;gap:9px}.wordmark{font-size:14px}.topbar nav{gap:10px}.topbar nav button{font-size:10px}.topbar nav span{display:none}#about-button{display:none}.mode-control{margin-left:auto;padding:3px}.mode-control button{font-size:9px;padding:7px 9px}.mode-control span{display:none}.world-stage{height:calc(100dvh - 153px);min-height:320px}.stage-caption{bottom:24px;font-size:9px;right:14px;letter-spacing:0}.stage-toolbar{left:14px;bottom:17px;gap:6px}.round-button{height:33px;width:33px;font-size:17px}.memory-bar{height:88px;padding:0 10px}.headquarters-caption{display:none}.memory-dock{gap:4px;width:100%;justify-content:space-around}.memory-button{min-width:0;flex:1;padding:7px 1px}.memory-label{font-size:9px;letter-spacing:0}.memory-thumbnail{width:72px;max-width:100%;height:48px}.island-panel{top:auto;bottom:0;width:100%;height:56%;min-height:245px;border-left:0;border-top:1px solid #d6bbee40;border-radius:24px 24px 0 0;padding:26px 22px 18px;background:linear-gradient(150deg,#291e3af5,#20162efb)}.island-panel .eyebrow{font-size:8px;margin-bottom:7px}.island-panel h1{font-size:22px;margin-bottom:7px}.island-line{font-size:12px;margin-bottom:8px}.island-description{display:none}.planting-note{font-size:9px}.planting-note>span:first-child{font-size:16px}.panel-rule{padding-top:13px;margin:12px 0 5px}.project-card{grid-template-columns:72px 1fr;padding:8px 0;gap:12px}.project-image{height:72px}.project-card h3{font-size:13px;margin-bottom:3px}.project-card p{font-size:9px}.panel-footnote{margin-top:15px}.has-island .stage-toolbar{bottom:auto;top:14px}.has-island .zoom-controls{display:none}dialog{padding:22px;width:calc(100% - 22px);max-height:90dvh;border-radius:20px}dialog h2{font-size:21px;margin:18px 0 22px}.directory-tools{gap:8px}.directory-tools select{max-width:120px;font-size:10px;padding:0 8px}.search-label{padding:0 9px;gap:7px}.search-label input{font-size:11px}.directory-grid{gap:10px}.collection-card{padding:10px}.collection-card .project-image{height:112px;margin-bottom:10px}.collection-card h3{font-size:12px}.collection-card p{font-size:9px}.collection-card .collection-island{font-size:8px}.collection-card .collection-island span:last-child{font-size:13px}#about-dialog{padding:24px}#about-dialog h2{font-size:23px}.about-lead{font-size:12px}.about-direction{font-size:15px}.scene-loading{font-size:11px;padding:16px 20px;white-space:nowrap}.toast{bottom:107px;font-size:11px}.topbar nav button:hover{color:#fff}}
/* The collection keeps its controls visible while all projects scroll below. */
#directory-dialog[open]{display:flex;flex-direction:column;width:min(1120px,calc(100vw - 40px));height:min(840px,calc(100dvh - 40px));max-height:calc(100dvh - 40px);padding:26px;overflow:hidden}
#directory-dialog>.dialog-top,#directory-dialog>h2,#directory-dialog>.directory-tools{flex-shrink:0}
#directory-dialog>.dialog-top{margin-bottom:8px}
#directory-dialog>h2{font-size:clamp(22px,2.6vw,30px);margin:8px 0 18px}
#directory-dialog>.directory-tools{min-width:0;margin-bottom:16px}
#directory-dialog .search-label,#directory-dialog .search-label input{min-width:0}
#directory-grid{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#8f80a7 #ffffff08;align-content:start;grid-auto-rows:max-content;padding:3px 8px 12px 2px}
#directory-grid:empty{display:none}
#directory-dialog .collection-card{min-width:0}
#directory-dialog .collection-card .project-image{height:clamp(120px,21dvh,170px)}
#directory-dialog #directory-empty:not([hidden]){display:grid;place-items:center;flex:1;min-height:0}
@media(max-width:600px){
  #directory-dialog[open]{width:calc(100vw - 20px);height:calc(100dvh - 24px);max-height:calc(100dvh - 24px);padding:16px;border-radius:18px}
  #directory-dialog>h2{font-size:21px;margin:6px 0 14px;letter-spacing:0}
  #directory-dialog>.directory-tools{gap:8px;margin-bottom:12px}
  #directory-grid{padding-right:5px;gap:10px}
  #directory-dialog .collection-card .project-image{height:112px}
}
@media(max-height:520px){
  #directory-dialog[open]{padding:14px;overflow-y:auto}
  #directory-dialog>.dialog-top{position:sticky;top:0;z-index:1;background:#20172f;padding:8px 0}
  #directory-grid{flex:none;overflow:visible}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
