@font-face{font-family:'Fusion Pixel';src:url('/assets/fonts/fusion-pixel-12px-proportional-zh_hans.otf.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
:root{font-family:system-ui,-apple-system,'PingFang SC',sans-serif;color:var(--text);background:var(--canvas);font-size:14px}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}button,input,select{font:inherit}.window{height:52px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px;gap:24px;position:sticky;top:0;z-index:2}.window b,.brand strong,.mono{font-family:monospace;letter-spacing:.04em}.dots{display:flex;gap:7px}.dots i{width:10px;height:10px;border-radius:50%;background:#e66b67}.dots i:nth-child(2){background:#eea23b}.dots i:nth-child(3){background:#49b77c}.tools{margin-left:auto;display:flex;align-items:center;gap:20px}.tools input{width:190px;border:1px solid var(--border);border-radius:6px;padding:8px 12px;background:var(--search-bg)}aside{position:fixed;top:52px;bottom:0;width:200px;border-right:1px solid var(--border);background:var(--surface);padding:24px 16px;display:flex;flex-direction:column}.brand{display:flex;gap:10px;align-items:center;margin-bottom:34px}.brand strong{font-size:12px}.brand small,.label{display:block;color:var(--muted);font:10px monospace;letter-spacing:.08em;margin-top:5px}.crab{color:var(--accent);line-height:8px;font-size:15px}nav{display:grid;gap:6px}nav a{padding:12px;border-radius:6px}nav a.active{background:var(--selected);color:var(--accent-strong);font-weight:700}.bottom{margin-top:auto}.clock{border:1px solid var(--border);border-radius:8px;padding:14px;background:var(--clock-bg)}.clock small,.clock span{display:block;color:var(--muted);font-size:11px}.clock strong{display:block;font:24px monospace;margin:6px 0}.bottom p{font:10px/1.7 monospace;color:var(--muted);margin:22px 4px 0}main{margin-left:200px;padding:24px;min-width:0}.hero,.panel,.card{border:1px solid var(--border);border-radius:9px;background:var(--surface)}.hero{min-height:125px;background:linear-gradient(110deg,var(--selected),var(--surface));padding:24px 28px;display:flex;justify-content:space-between;align-items:center}.hero h1{font: bold 30px monospace;letter-spacing:.04em;margin:0 0 8px}.hero p{margin:5px 0}.hero .slogan{font:12px monospace;color:var(--muted)}.panel{margin-top:16px;padding:24px}.quota{min-height:240px;background-color:var(--surface);background-image:radial-gradient(var(--dot) 1px,transparent 1px);background-size:12px 12px}.heading{display:flex;justify-content:space-between;align-items:flex-start}.heading h2,.card h2{font-size:17px;margin:0}.empty{text-align:center;padding:45px 12px;color:var(--muted)}.empty strong{display:block;color:var(--text);font-size:15px;margin-bottom:8px}.empty .icon{font-size:28px;color:var(--border);display:block;margin-bottom:12px}.duo{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.card{padding:24px;min-height:155px}.card p{line-height:1.8}.card a,.heading a{color:var(--accent);font-weight:600}.page{max-width:800px}.page h1{font-size:22px}.page p{line-height:1.9}.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.filters button{border:1px solid var(--border);background:var(--surface);border-radius:6px;padding:9px 15px;color:var(--text);cursor:pointer}.filters button.active{background:var(--selected);border-color:var(--accent)}footer{display:flex;justify-content:space-between;color:var(--muted);font:11px monospace;padding:28px 2px 8px}input{outline-color:var(--accent)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}@media(max-width:767px){aside{position:static;width:auto;padding:8px 12px;border-right:0;border-bottom:1px solid var(--border)}.brand,.bottom{display:none}nav{display:flex;overflow:auto}nav a{white-space:nowrap;padding:10px}main{margin:0;padding:16px}.duo{grid-template-columns:1fr}.hero .slogan{display:none}.window{padding:0 14px;gap:12px}.tools input{width:120px}.window b{font-size:12px}.panel,.card{padding:20px}}
button{border:1px solid var(--border);background:var(--surface);border-radius:6px;padding:9px 14px;color:var(--text);cursor:pointer}button:hover{border-color:var(--accent);background:var(--hover)}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:var(--accent);color:white;border-color:var(--accent)}.primary:hover{background:var(--accent-hover);color:white}.text-button{border:0;background:transparent;color:var(--accent);padding:4px}.quota-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 30px;margin-top:16px}.quota-item{min-width:0;border-top:1px solid var(--dot);padding:15px 0}.quota-value{font:24px monospace;margin:8px 0}.pixels{display:grid;grid-template-columns:repeat(10,10px);gap:4px;margin:8px 0}.pixels i{height:10px;background:var(--pixel-off)}.pixels .on{background:var(--accent)}.pixels.orange .on{background:#eea23b}.pixels.red .on{background:#e66b67}.muted{color:var(--muted)}.workrow{display:grid;grid-template-columns:40px 1fr 100px 20px;align-items:center;gap:12px;padding:17px 8px;border-bottom:1px solid var(--border-soft)}.workrow p{margin:6px 0 0;color:var(--muted)}.workrow time{color:var(--muted);font-size:12px}.number{font:18px monospace;color:var(--accent)}.tag{display:inline-block;background:var(--selected);color:var(--accent);border-radius:4px;padding:3px 7px;font-size:11px}.pre{white-space:pre-wrap;overflow-wrap:anywhere}.contact-row{display:flex;justify-content:space-between;margin:16px 0}.filters input,.filters select{border:1px solid var(--border);border-radius:6px;padding:9px}.filters input{margin-left:auto}.links{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.links a{border:1px solid var(--border);border-radius:6px;padding:9px}.login{max-width:420px;margin:80px auto}.login form,form{display:grid;gap:12px}label{display:grid;gap:6px;color:var(--secondary)}label input,label textarea,label select{width:100%;border:1px solid var(--border);border-radius:6px;background:var(--input-bg);padding:10px;color:var(--text)}textarea{font:inherit;resize:vertical}.check{display:flex;align-items:center}.check input{width:auto}.admin-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:16px}.admin-grid .panel{margin-top:0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stats .card{min-height:100px}.task{border-bottom:1px solid var(--border-soft);padding:12px 0}.toast{position:fixed;right:20px;top:65px;background:var(--surface);border:1px solid #49b77c;border-radius:6px;padding:12px 18px;z-index:5;box-shadow:2px 3px var(--selected)}.toast.bad{border-color:#e66b67}#pagination{display:flex;gap:6px;margin-top:15px}#pagination .active{background:var(--selected)}@media(max-width:767px){.quota-grid,.admin-grid,.stats{grid-template-columns:1fr}.quota-grid>div:empty{display:none}.workrow{grid-template-columns:30px 1fr 20px}.workrow time{grid-column:2}.filters input{margin-left:0;width:100%}.admin-grid .panel{margin-top:0}}
.dialog{border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);width:min(620px,calc(100vw - 32px));max-height:85vh;box-shadow:4px 4px var(--selected-hover);padding:24px}.dialog::backdrop{background:var(--backdrop)}.dialog form{display:block}.dialog h2{margin:0 0 16px;font-size:18px}.dialog-content{max-height:60vh;overflow:auto;line-height:1.6}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.preview-field{border-top:1px solid var(--border-soft);padding:10px 0}.preview-field p{margin:4px 0;color:var(--secondary)}
.mobile-menu{display:none}@media(max-width:767px){.mobile-menu{display:block;width:100%;text-align:left;min-height:44px;border:0;background:transparent}aside nav{display:none;flex-wrap:wrap}aside nav.open{display:flex}aside nav a{min-height:44px;display:flex;align-items:center}}
.contact-url{display:block;overflow-wrap:anywhere;font-size:12px;color:var(--muted);margin-top:4px}.contact-row{gap:16px;align-items:center}
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}.pixel-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:miter;stroke-linecap:square;flex:none;shape-rendering:crispEdges;vertical-align:middle}.crab{width:28px;height:28px;color:#e66b67;stroke-width:1.2}nav a{display:flex;align-items:center;gap:12px;min-height:44px}nav a:hover{background:var(--tint-bg)}.empty .pixel-icon{width:28px;height:28px}.skip-link{position:fixed;left:12px;top:-80px;z-index:10;background:var(--surface);padding:12px;border:1px solid var(--accent)}.skip-link:focus{top:12px}.workrow>div{min-width:0;overflow-wrap:anywhere}.hero h1,.page h1,.card h2{overflow-wrap:anywhere}@media(max-width:767px){.window .tools{gap:10px}.window .tools input{width:min(30vw,120px)}.window b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.workrow{grid-template-columns:30px minmax(0,1fr) 20px}.workrow b{grid-column:3;grid-row:1}.workrow time{grid-column:2;grid-row:2}.hero h1{font-size:26px}.dialog-actions button{min-height:44px}.filters button,.filters select,.links a{min-height:44px}}
.quota-header-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end;text-align:right;font-size:12px}.quota-header-actions .text-button{min-height:36px}@media(max-width:767px){.quota-header-actions{max-width:55%;gap:4px}.quota-header-actions span{width:100%}}
.panel,.card,.admin-grid>*{min-width:0}.panel h1,.panel h2,.panel p,.card p,.task,.quota-item{overflow-wrap:anywhere}#pagination{display:flex;flex-wrap:wrap}#pagination button{min-width:44px;min-height:44px}
.pixel-title{display:block;max-width:100%;height:auto;fill:currentColor;shape-rendering:crispEdges}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skeleton-line,.skeleton-block{display:block;border-radius:4px;background:var(--skeleton)}.skeleton-line{height:12px;margin:10px 0}.skeleton-title{width:min(300px,55vw);height:25px}.skeleton-short{width:180px;max-width:60vw}.skeleton-label{width:140px}.skeleton-block{height:100px;margin-top:20px;background:var(--skeleton-soft)}.loading-text{color:var(--muted);font-size:12px}
.project-meta{font-size:12px;line-height:1.8;color:var(--quiet-text);margin:12px 0 18px}
.preview-sheet{margin:16px 0;padding:18px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}.preview-sheet h1{font-size:22px;overflow-wrap:anywhere}.preview-sheet h2{font-size:17px;margin-top:20px}.preview-sheet .preview-link{display:inline-block;border:1px solid var(--border);border-radius:6px;padding:9px;color:var(--secondary)}.preview-sheet .detail-content p{line-height:1.8;overflow-wrap:anywhere}
/* Keep the specified palette while giving interactive text enough contrast. */
.primary,.primary:hover{color:var(--text)}.primary:hover{background:var(--selected);border-color:var(--accent)}a:hover{color:var(--text);text-decoration:underline;text-decoration-color:var(--accent)}.card a,.heading a,.text-button{color:var(--text);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}nav a.active,.tag{color:var(--text)}.brand small,.label{font-size:12px}
:focus-visible{outline-color:var(--text)}
.contact-identity{display:flex;align-items:center;gap:12px;min-width:0}.contact-identity>div{min-width:0}.contact-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;flex:none;border:1px solid var(--border);border-radius:6px;background:var(--selected);color:var(--text)}.contact-row>a{flex:none}
.about-page{margin-left:auto;margin-right:auto}.about-page h2{font-size:17px;margin:28px 0 14px}.interest-tags{display:flex;flex-wrap:wrap;gap:8px}.interest-tags span{border:1px solid var(--border);border-radius:6px;background:var(--selected);padding:7px 10px;font:12px monospace;overflow-wrap:anywhere}.about-links{display:flex;gap:20px;flex-wrap:wrap;border-top:1px solid var(--border-soft);margin-top:28px;padding-top:20px}.about-links a{min-height:44px;display:inline-flex;align-items:center}

/* Small pixel details and a single, restrained entrance for the public page. */
.bottom p{position:relative;padding-right:34px}
.bottom p::after{content:"";position:absolute;right:7px;bottom:4px;width:4px;height:4px;background:var(--border);box-shadow:8px 0 var(--dot-alt),16px 0 var(--border),0 -8px var(--dot-alt),8px -8px var(--border),16px -8px var(--dot-alt),0 -16px var(--border),8px -16px var(--dot-alt),16px -16px var(--border)}
.hero .slogan{display:flex;align-items:center;gap:10px}
.hero .slogan::after{content:"";width:5px;height:5px;flex:none;background:var(--accent);box-shadow:8px 0 var(--border),0 8px var(--border),8px 8px var(--dot);margin-right:8px}
.panel,.card{box-shadow:2px 2px 0 var(--shadow)}
button,nav a,.workrow{transition:background-color 140ms ease,border-color 140ms ease,color 140ms ease}
button:active{transform:translateY(1px)}
@media (prefers-reduced-motion: no-preference){main:not([aria-busy="true"]){animation:page-arrive 160ms ease-out both}@keyframes page-arrive{from{opacity:.85}to{opacity:1}}}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}}
/* Pixel studio illustration, drawn locally without portfolio imagery. */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:176px;background:#8bb5dd url('/assets/pixel-studio.svg') center / cover no-repeat}
.hero>div:first-child{position:relative;z-index:1;background:var(--hero-label);border:1px solid var(--illustration-border);box-shadow:3px 3px 0 var(--illustration-shadow);padding:17px 20px;max-width:min(64%,510px)}
.hero .slogan{position:relative;z-index:1;background:var(--selected);border:1px solid var(--illustration-border);padding:10px;color:var(--text);margin-right:72px}
.hero-crab{position:absolute;z-index:1;width:78px;right:22px;bottom:10px;image-rendering:pixelated;transform-origin:center bottom}
@media(prefers-reduced-motion:no-preference){.hero-crab{animation:crab-wave 4s steps(2,end) infinite}@keyframes crab-wave{0%,88%,100%{transform:translateY(0)}92%,96%{transform:translateY(-3px)}}}
@media(max-width:767px){.hero{min-height:164px;padding:18px}.hero>div:first-child{max-width:calc(100% - 48px);padding:13px}.hero h1{font-size:23px}.hero-crab{width:54px;right:8px;bottom:8px}}
.brand-crab{width:31px;height:27px;flex:none;image-rendering:pixelated}
.corner-art{display:block;width:124px;height:auto;max-height:160px;margin:18px auto -7px;image-rendering:pixelated}
@media(max-height:780px){.corner-art{width:90px;margin:8px auto -8px}.bottom p{margin-top:12px}}
@media(max-height:650px){.corner-art{display:none}}
@media(max-width:767px){.hero .slogan{display:none}.window .tools form{min-width:0}.window .tools input{max-width:100%}}
.login-brand{display:flex;align-items:center;gap:10px;color:var(--text);font-weight:700}.login-brand img{width:42px;height:32px;image-rendering:pixelated}
.about-page{position:relative}
.about-mascot{float:right;display:flex;flex-direction:column;align-items:center;gap:7px;margin:0 0 12px 22px}
.about-mascot span{position:relative;border:2px solid var(--text);background:var(--selected);box-shadow:3px 3px 0 var(--border);padding:7px 10px;font:11px/1.3 monospace;text-align:center}
.about-mascot span::after{content:"";position:absolute;bottom:-7px;left:17px;width:7px;height:5px;background:var(--selected);border-left:2px solid var(--text);border-bottom:2px solid var(--text)}
.about-mascot img{width:65px;height:46px;image-rendering:pixelated}
@media(max-width:480px){.about-mascot{margin-left:10px}.about-mascot img{width:48px;height:35px}.about-mascot span{font-size:10px;padding:5px}}
/* Heavier pixel lettering echoes the reference while retaining readable Chinese copy. */
.hero .pixel-title path{stroke:currentColor;stroke-width:.18;stroke-linejoin:miter;paint-order:stroke fill}
@media(max-width:767px){button,input:not([type="checkbox"]):not([type="hidden"]),select{min-height:44px}.window .tools>a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}.window .tools{gap:4px}}
@media(max-width:767px){.quota-header-actions .text-button{min-height:44px}}
.hero{background-image:url('/assets/pixel-studio.jpg');background-position:center 57%}
.hero-crab{display:none}
@media(prefers-reduced-motion:no-preference){.brand-crab{animation:crab-wave 4s steps(2,end) infinite;transform-origin:center bottom}}
.hero{background-position:center bottom}
@media(min-width:768px){.hero .slogan{position:absolute;right:18px;top:12px;margin:0}}
.hero{background-image:url('/assets/pixel-studio.jpg'),url('/assets/pixel-studio.svg');background-position:center bottom;background-size:cover;background-repeat:no-repeat}
.heading-title,.archive-title{display:flex;align-items:center;gap:12px}.section-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border:1px solid var(--border);border-radius:6px;background:var(--selected);color:var(--text)}.section-icon .pixel-icon{width:22px;height:22px}.archive-title h1{margin:0}.archive-title .label{margin-top:4px}

/* Local bitmap lettering: no external fonts or font-loading shift. */
.window b{min-width:0;overflow-wrap:anywhere}.window b .pixel-title{width:154px}
.brand>div{min-width:0}.brand strong{display:grid;gap:4px}.brand strong .pixel-title{width:auto;height:14px}
.clock #time{min-height:28px}.clock #time .pixel-title{width:116px;height:28px}
.pixel-dashes{display:flex;gap:4px;margin:14px 4px 0}.pixel-dashes i{width:16px;height:5px;border:1px solid var(--border);border-radius:2px;background:var(--selected)}.pixel-dashes i:first-child{background:var(--accent);border-color:var(--accent)}
@media(max-width:767px){.window b .pixel-title{width:116px}}
@media(prefers-reduced-motion:no-preference){.about-mascot:hover img{animation:mascot-greet 600ms steps(2,end) 2}@keyframes mascot-greet{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}}
@media(min-width:768px){.hero .slogan{left:55%;right:auto}}
/* Quiet ambient light in the studio; text remains above the effect. */
.hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(216,239,255,.14) 47%,transparent 61%);opacity:.35}
.hero::after{content:"";position:absolute;z-index:0;pointer-events:none;left:61%;top:28%;width:3px;height:3px;background:#d9edff;box-shadow:18px 12px #d9edff,42px -8px var(--selected),72px 20px #d9edff,100px 1px var(--selected);opacity:.35}
@media(prefers-reduced-motion:no-preference){.hero::before{animation:studio-light 9s ease-in-out infinite alternate}.hero::after{animation:studio-sparkle 4s steps(2,end) infinite}@keyframes studio-light{from{opacity:.2;transform:translateX(-2%)}to{opacity:.65;transform:translateX(2%)}}@keyframes studio-sparkle{0%,100%{opacity:.2}50%{opacity:.75}}}
/* More visible ambient motion across the window and desk. */
.hero::before{inset:-15% -8%;background:linear-gradient(110deg,transparent 25%,rgba(202,232,255,.08) 32%,rgba(228,245,255,.48) 40%,rgba(200,231,255,.11) 47%,transparent 54%);mix-blend-mode:screen;opacity:.6}
.hero::after{left:56%;top:24%;width:5px;height:5px;background:var(--input-bg);box-shadow:20px 18px #d9edff,48px -10px var(--input-bg),76px 24px #d9edff,105px 3px var(--input-bg),138px 30px #d9edff,168px -8px var(--input-bg);opacity:.8}
@media(prefers-reduced-motion:no-preference){.hero::before{animation:studio-light-visible 5s ease-in-out infinite alternate}.hero::after{animation:studio-sparkle-visible 1.8s steps(2,end) infinite}@keyframes studio-light-visible{from{opacity:.35;transform:translateX(-12%)}to{opacity:.9;transform:translateX(12%)}}@keyframes studio-sparkle-visible{0%,100%{opacity:.15;transform:translateY(0)}50%{opacity:1;transform:translateY(-5px)}}}
/* Approximate local time of day with continuously interpolated light and room shade. */
.hero{background-image:linear-gradient(var(--studio-tint,transparent),var(--studio-tint,transparent)),url('/assets/pixel-studio.jpg'),url('/assets/pixel-studio.svg');transition:background-image 1s ease}
.hero::before{background:linear-gradient(var(--studio-light-angle,115deg),transparent 25%,rgba(var(--studio-light-rgb,216,239,255),.06) 32%,rgba(var(--studio-light-rgb,216,239,255),var(--studio-light-strength,.4)) 40%,rgba(var(--studio-light-rgb,216,239,255),.08) 47%,transparent 54%)}
/* Keep daylight clear: sun falls in a narrow band instead of veiling the room. */
.hero::before{background:linear-gradient(var(--studio-light-angle,115deg),transparent 37%,rgba(var(--studio-light-rgb,216,239,255),.04) 41%,rgba(var(--studio-light-rgb,216,239,255),var(--studio-light-strength,.35)) 46%,rgba(var(--studio-light-rgb,216,239,255),.04) 51%,transparent 55%)}

/* The afternoon room is recolored artwork, not a full-image tint. */
.hero{background-image:var(--studio-image,url('/assets/pixel-studio.jpg')),url('/assets/pixel-studio.svg')}
/* Expand the room to its native 3:1 framing while hovered or keyboard focused. */
@media(min-width:768px){.hero{height:176px;transition:height 350ms ease,background-size 350ms ease}.hero:focus-visible{outline:2px solid var(--text);outline-offset:3px}.hero:focus-visible,.hero:hover{height:clamp(176px,calc((100vw - 248px) / 3),450px);background-size:100% auto;background-position:center}.hero:focus-visible>div:first-child,.hero:hover>div:first-child{opacity:0;pointer-events:none}.hero>div:first-child{transition:opacity 180ms ease}}
.plant-layer{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:hidden}
@media(prefers-reduced-motion:no-preference){.plant{animation:plant-breeze 4s ease-in-out infinite alternate}.plant-1,.plant-4,.plant-7{animation-delay:-1.3s;animation-duration:4.8s}.plant-2,.plant-5,.plant-8{animation-delay:-2.1s;animation-duration:5.4s}@keyframes plant-breeze{from{transform:translateX(-1px)}to{transform:translateX(2px)}}}
/* Match SVG's xMidYMax alignment to the artwork at every size. */
@media(min-width:768px){.hero:focus-visible,.hero:hover{background-position:center bottom}}
@media(prefers-reduced-motion:no-preference){@keyframes plant-breeze{from{transform:translateX(-5px)}to{transform:translateX(5px)}}}
/* Each cutout pivots at its own attachment point rather than translating the full layer. */
.plant{transform-box:view-box;animation:none}
.plant-0{transform-origin:70px 70px;--sway:1.1deg}
.plant-1{transform-origin:840px 0px;--sway:1.4deg}
.plant-2{transform-origin:1750px 0px;--sway:1deg}
.plant-3{transform-origin:2135px 20px;--sway:1.3deg}
.plant-4{transform-origin:185px 620px;--sway:0.7deg}
.plant-5{transform-origin:510px 500px;--sway:1.3deg}
.plant-6{transform-origin:870px 500px;--sway:1deg}
.plant-7{transform-origin:1765px 475px;--sway:0.8deg}
.plant-8{transform-origin:1950px 560px;--sway:1.2deg}
@media(prefers-reduced-motion:no-preference){
 .plant{animation:leaf-sway 5s ease-in-out infinite alternate}
 .plant-0{animation-duration:5.7s;animation-delay:-.8s}.plant-1{animation-duration:6.2s;animation-delay:-2.4s}.plant-2{animation-duration:4.9s;animation-delay:-1.1s}.plant-3{animation-duration:6.8s;animation-delay:-3.8s}
 .plant-4{animation-duration:6.5s;animation-delay:-1.5s}.plant-5{animation-duration:4.7s;animation-delay:-3s}.plant-6{animation-duration:5.3s;animation-delay:-.4s}.plant-7{animation-duration:6.9s;animation-delay:-2.9s}.plant-8{animation-duration:5.9s;animation-delay:-4.4s}
 @keyframes leaf-sway{0%{transform:rotate(calc(-1 * var(--sway)))}45%{transform:rotate(calc(var(--sway) * .3))}100%{transform:rotate(var(--sway))}}
}
/* Independently moving sections keep stems near their own root or hanging point. */
.leaf-part{transform-box:view-box;animation:none}
@media(prefers-reduced-motion:no-preference){.leaf-part{animation:leaf-breeze-a var(--duration) cubic-bezier(.37,0,.35,1) var(--delay) infinite}@keyframes leaf-part-sway{0%{transform:translateX(var(--registration,0px)) rotate(calc(-1 * var(--angle))) skewX(calc(-1 * var(--bend))) scaleY(1)}55%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * .25)) skewX(calc(var(--bend) * .4)) scaleY(var(--breath))}100%{transform:translateX(var(--registration,0px)) rotate(var(--angle)) skewX(var(--bend)) scaleY(1)}}}

/* Per-leaf timing and attachment points live in this stylesheet so CSP permits them. */
.leaf-traced-0{transform-origin:138px 85px;--angle:1.8deg;--bend:.35deg;--breath:1.004;--duration:6.7s;--delay:-0.00s}
.leaf-traced-1{transform-origin:780px 22px;--angle:1.7deg;--bend:.35deg;--breath:1.004;--duration:7.8s;--delay:-0.90s}
.leaf-traced-2{transform-origin:830px 20px;--angle:2.1deg;--bend:.35deg;--breath:1.004;--duration:6.3s;--delay:-1.80s}
.leaf-traced-3{transform-origin:960px 12px;--angle:1.9deg;--bend:.35deg;--breath:1.004;--duration:8.1s;--delay:-2.70s}
.leaf-traced-4{transform-origin:1695px 20px;--angle:1.8deg;--bend:.35deg;--breath:1.004;--duration:7.1s;--delay:-3.60s}
.leaf-traced-5{transform-origin:1742px 18px;--angle:2.2deg;--bend:.35deg;--breath:1.004;--duration:8.4s;--delay:-4.50s}
.leaf-traced-6{transform-origin:1800px 18px;--angle:1.7deg;--bend:.35deg;--breath:1.004;--duration:6.9s;--delay:-5.40s}
.leaf-traced-7{transform-origin:175px 515px;--angle:2.0deg;--bend:.35deg;--breath:1.004;--duration:6.4s;--delay:-6.30s}
.leaf-traced-8{transform-origin:190px 515px;--angle:2.2deg;--bend:.35deg;--breath:1.004;--duration:7.3s;--delay:-7.20s}
.leaf-traced-9{transform-origin:172px 570px;--angle:1.8deg;--bend:.35deg;--breath:1.004;--duration:5.9s;--delay:-8.10s}
.leaf-traced-10{transform-origin:170px 594px;--angle:2.4deg;--bend:.35deg;--breath:1.004;--duration:7.7s;--delay:-9.00s}
.leaf-traced-11{transform-origin:205px 558px;--angle:2.1deg;--bend:.35deg;--breath:1.004;--duration:6.8s;--delay:-9.90s}
.leaf-traced-12{transform-origin:204px 590px;--angle:2.3deg;--bend:.35deg;--breath:1.004;--duration:8.2s;--delay:-10.80s}
.leaf-traced-13{transform-origin:494px 486px;--angle:3.5deg;--bend:.35deg;--breath:1.004;--duration:5.6s;--delay:-11.70s}
.leaf-traced-14{transform-origin:494px 486px;--angle:3.1deg;--bend:.35deg;--breath:1.004;--duration:6.4s;--delay:-12.60s}
.leaf-traced-15{transform-origin:846px 490px;--angle:2.8deg;--bend:.35deg;--breath:1.004;--duration:6.1s;--delay:-13.50s}
.leaf-traced-16{transform-origin:846px 490px;--angle:3.2deg;--bend:.35deg;--breath:1.004;--duration:7.2s;--delay:-14.40s}
.leaf-traced-17{transform-origin:846px 490px;--angle:2.9deg;--bend:.35deg;--breath:1.004;--duration:5.8s;--delay:-15.30s}
.leaf-traced-18{transform-origin:1937px 540px;--angle:2.7deg;--bend:.35deg;--breath:1.004;--duration:6.5s;--delay:-16.20s}
.leaf-traced-19{transform-origin:1937px 540px;--angle:3.0deg;--bend:.35deg;--breath:1.004;--duration:7.4s;--delay:-17.10s}
.leaf-traced-20{transform-origin:1937px 540px;--angle:2.6deg;--bend:.35deg;--breath:1.004;--duration:5.9s;--delay:-18.00s}
.leaf-traced-21{transform-origin:1772px 453px;--angle:2.1deg;--bend:.35deg;--breath:1.004;--duration:7.8s;--delay:-18.90s}
.leaf-traced-22{transform-origin:1777px 453px;--angle:2.4deg;--bend:.35deg;--breath:1.004;--duration:6.9s;--delay:-19.80s}
.leaf-traced-23{transform-origin:1780px 453px;--angle:2.0deg;--bend:.35deg;--breath:1.004;--duration:8.3s;--delay:-20.70s}
.leaf-section-0{transform-origin:70px 70px;--angle:0.9deg;--bend:0.75deg;--breath:1.008;--duration:4.60s;--delay:-0.00s}
.leaf-section-1{transform-origin:70px 70px;--angle:0.55deg;--bend:0.35deg;--breath:1.008;--duration:5.13s;--delay:-0.73s}
.leaf-section-2{transform-origin:70px 70px;--angle:1.1deg;--bend:0.55deg;--breath:1.008;--duration:5.66s;--delay:-1.46s}
.leaf-section-3{transform-origin:840px 0px;--angle:0.9deg;--bend:0.75deg;--breath:1.008;--duration:4.97s;--delay:-1.19s}
.leaf-section-4{transform-origin:840px 0px;--angle:0.55deg;--bend:0.35deg;--breath:1.008;--duration:5.50s;--delay:-1.92s}
.leaf-section-5{transform-origin:840px 0px;--angle:1.1deg;--bend:0.55deg;--breath:1.008;--duration:6.03s;--delay:-2.65s}
.leaf-section-6{transform-origin:1750px 0px;--angle:0.9deg;--bend:0.75deg;--breath:1.008;--duration:5.34s;--delay:-2.38s}
.leaf-section-7{transform-origin:1750px 0px;--angle:0.55deg;--bend:0.35deg;--breath:1.008;--duration:5.87s;--delay:-3.11s}
.leaf-section-8{transform-origin:1750px 0px;--angle:1.1deg;--bend:0.55deg;--breath:1.008;--duration:6.40s;--delay:-3.84s}
.leaf-section-9{transform-origin:2135px 20px;--angle:0.9deg;--bend:0.75deg;--breath:1.008;--duration:5.71s;--delay:-3.57s}
.leaf-section-10{transform-origin:2135px 20px;--angle:0.55deg;--bend:0.35deg;--breath:1.008;--duration:6.24s;--delay:-4.30s}
.leaf-section-11{transform-origin:2135px 20px;--angle:1.1deg;--bend:0.55deg;--breath:1.008;--duration:6.77s;--delay:-0.03s}
.leaf-section-12{transform-origin:185px 620px;--angle:0.9deg;--bend:0.75deg;--breath:1.004;--duration:6.08s;--delay:-4.76s}
.leaf-section-13{transform-origin:185px 620px;--angle:0.55deg;--bend:0.35deg;--breath:1.004;--duration:6.61s;--delay:-0.49s}
.leaf-section-14{transform-origin:185px 620px;--angle:1.1deg;--bend:0.55deg;--breath:1.004;--duration:7.14s;--delay:-1.22s}
.leaf-section-15{transform-origin:494px 487px;--angle:0.9deg;--bend:0.75deg;--breath:1.004;--duration:6.45s;--delay:-0.95s}
.leaf-section-16{transform-origin:494px 487px;--angle:0.55deg;--bend:0.35deg;--breath:1.004;--duration:6.98s;--delay:-1.68s}
.leaf-section-17{transform-origin:494px 487px;--angle:1.1deg;--bend:0.55deg;--breath:1.004;--duration:7.51s;--delay:-2.41s}
.leaf-section-18{transform-origin:846px 490px;--angle:0.9deg;--bend:0.75deg;--breath:1.004;--duration:6.82s;--delay:-2.14s}
.leaf-section-19{transform-origin:846px 490px;--angle:0.55deg;--bend:0.35deg;--breath:1.004;--duration:7.35s;--delay:-2.87s}
.leaf-section-20{transform-origin:846px 490px;--angle:1.1deg;--bend:0.55deg;--breath:1.004;--duration:4.88s;--delay:-3.60s}
.leaf-section-21{transform-origin:1765px 475px;--angle:0.9deg;--bend:0.75deg;--breath:1.004;--duration:7.19s;--delay:-3.33s}
.leaf-section-22{transform-origin:1765px 475px;--angle:0.55deg;--bend:0.35deg;--breath:1.004;--duration:4.72s;--delay:-4.06s}
.leaf-section-23{transform-origin:1765px 475px;--angle:1.1deg;--bend:0.55deg;--breath:1.004;--duration:5.25s;--delay:-4.79s}
.leaf-section-24{transform-origin:1937px 540px;--angle:0.9deg;--bend:0.75deg;--breath:1.004;--duration:7.56s;--delay:-4.52s}
.leaf-section-25{transform-origin:1937px 540px;--angle:0.55deg;--bend:0.35deg;--breath:1.004;--duration:5.09s;--delay:-0.25s}
.leaf-section-26{transform-origin:1937px 540px;--angle:1.1deg;--bend:0.55deg;--breath:1.004;--duration:5.62s;--delay:-0.98s}
.leaf-section-27{transform-origin:2138px 455px;--angle:0.9deg;--bend:0.75deg;--breath:1.004;--duration:4.93s;--delay:-0.71s}
.leaf-section-28{transform-origin:2138px 455px;--angle:0.55deg;--bend:0.35deg;--breath:1.004;--duration:5.46s;--delay:-1.44s}
.leaf-section-29{transform-origin:2138px 455px;--angle:1.1deg;--bend:0.55deg;--breath:1.004;--duration:5.99s;--delay:-2.17s}

/* Night foliage was generated against a slightly different source framing. */
.plant-layer.night .plant-base-2{transform:translateX(10px)}
.plant-layer.night .leaf-traced-4,.plant-layer.night .leaf-traced-5,.plant-layer.night .leaf-traced-6,.plant-layer.night .leaf-section-9,.plant-layer.night .leaf-section-10,.plant-layer.night .leaf-section-11{--registration:10px}
.plant-layer.night .plant-base-7,.plant-layer.night .plant-base-8{transform:translateX(2px)}
.plant-layer.night .leaf-traced-18,.plant-layer.night .leaf-traced-19,.plant-layer.night .leaf-traced-20,.plant-layer.night .leaf-traced-21,.plant-layer.night .leaf-traced-22,.plant-layer.night .leaf-traced-23{--registration:2px}
@media(prefers-reduced-motion:reduce){.plant-layer.night .leaf-part{transform:translateX(var(--registration,0px))}}

/* Room, foliage and occluding objects are rendered in the same SVG viewport. */
.hero{background-image:none}
/* Use the content width, including on wide screens, to reveal the full room. */
main{container-type:inline-size}
@media(min-width:768px){.hero:hover,.hero:focus-visible{min-height:0;height:calc((100cqw - 2px) / 3 + 2px)}}

/* A breeze pushes, eases, then settles. Neighbouring leaves respond at different phases. */
@media(prefers-reduced-motion:no-preference){
 .leaf-part:nth-of-type(3n){animation-name:leaf-breeze-b}
 .leaf-part:nth-of-type(3n + 1){animation-name:leaf-breeze-c}
 @keyframes leaf-breeze-a{0%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.35)) skewX(calc(var(--bend) * -0.210))}17%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 0.45)) skewX(calc(var(--bend) * 0.270))}32%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 1)) skewX(calc(var(--bend) * 0.600))}51%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 0.1)) skewX(calc(var(--bend) * 0.060))}69%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.65)) skewX(calc(var(--bend) * -0.390))}83%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.18)) skewX(calc(var(--bend) * -0.108))}100%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.35)) skewX(calc(var(--bend) * -0.210))}}
 @keyframes leaf-breeze-b{0%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 0.25)) skewX(calc(var(--bend) * 0.150))}23%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.7)) skewX(calc(var(--bend) * -0.420))}42%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.2)) skewX(calc(var(--bend) * -0.120))}58%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 0.9)) skewX(calc(var(--bend) * 0.540))}73%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 0.55)) skewX(calc(var(--bend) * 0.330))}89%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 0.05)) skewX(calc(var(--bend) * 0.030))}100%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 0.25)) skewX(calc(var(--bend) * 0.150))}}
 @keyframes leaf-breeze-c{0%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.5)) skewX(calc(var(--bend) * -0.300))}12%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.3)) skewX(calc(var(--bend) * -0.180))}37%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 0.8)) skewX(calc(var(--bend) * 0.480))}54%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * 0.3)) skewX(calc(var(--bend) * 0.180))}72%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.85)) skewX(calc(var(--bend) * -0.510))}90%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.6)) skewX(calc(var(--bend) * -0.360))}100%{transform:translateX(var(--registration,0px)) rotate(calc(var(--angle) * -0.5)) skewX(calc(var(--bend) * -0.300))}}
}

/* Keep the window bar and sidebar edge joined during page scrolling. */
html{overscroll-behavior-y:none}
body{padding-top:52px}
.window{position:fixed;inset:0 0 auto;width:100%}
@media(min-width:768px){aside{top:51px}}
/* Equal frames show each illustration intact; the source screenshot crop excludes only its border and caption. */
.corner-viewport{overflow:hidden;width:100%}
.corner-track{display:flex;width:100%;transition:transform 420ms cubic-bezier(.22,.61,.36,1)}
.corner-track.slide-0{transform:translateX(0)}.corner-track.slide-1{transform:translateX(-100%)}.corner-track.slide-2{transform:translateX(-200%)}.corner-track.slide-3{transform:translateX(-300%)}
.corner-slide{flex:0 0 100%;min-width:0}
.corner-scene{display:block;width:100%;height:105px;margin:10px 0 0}
.corner-scene.scene-0{background:url('/assets/pixel-corner.svg') center bottom / contain no-repeat}
.corner-illustration{display:block;width:100%;height:100%;overflow:hidden}
.corner-slide .corner-caption{height:54px;margin:8px 4px 0;line-height:18px;font-size:9px!important;letter-spacing:-.03em}
.corner-carousel .corner-caption::after{content:none}
.pixel-dashes{gap:0;margin:4px 0 0}
.pixel-dashes button{position:relative;width:25px;height:24px;padding:0;border:0;background:transparent;border-radius:3px}
.pixel-dashes button::after{content:"";position:absolute;left:4px;right:3px;top:9px;height:5px;border:1px solid var(--border);border-radius:2px;background:var(--selected)}
.pixel-dashes button.active::after{background:var(--accent);border-color:var(--accent)}
.pixel-dashes button:hover{background:var(--hover)}
@media(max-height:780px){.corner-scene{height:82px;margin-top:8px}}
@media(max-height:650px){.corner-scene{display:none}}
/* Compact overview keeps each source visually distinct on wider displays. */
@media(min-width:1200px){.quota-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}}
.quota-item{min-width:0;padding:16px;border:1px solid var(--dot);border-radius:8px;background:var(--panel-overlay)}
.quota-item strong{overflow-wrap:anywhere}.quota-item small{display:block;line-height:1.6;overflow-wrap:anywhere}
.quota-toolbar{display:flex;align-items:center;gap:12px;margin:20px 0 14px;color:var(--secondary);font-size:12px}.quota-toolbar input{max-width:280px;width:100%;border:1px solid var(--border);border-radius:6px;padding:9px 12px;background:var(--surface)}.quota-chart{border:1px solid var(--dot);border-radius:8px;background:var(--surface);padding:18px 20px}.quota-chart-title{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.quota-chart-title span{font:10px monospace;color:var(--muted)}.quota-legend{display:flex;gap:10px 18px;flex-wrap:wrap;margin:16px 0 0}.quota-legend-item{display:inline-flex;gap:6px;align-items:center;font-size:12px}.quota-legend-item i{width:8px;height:8px;background:var(--accent)}.quota-legend-item.palette-1 i{background:#49b77c}.quota-legend-item.palette-2 i{background:#eea23b}.quota-legend-item.palette-3 i{background:#e66b67}.quota-legend-item.palette-4 i{background:#9275c6}.quota-legend-item.palette-5 i{background:#478fa5}.quota-chart svg{display:block;width:100%;height:150px;margin-top:10px;overflow:visible}.quota-chart svg text{fill:var(--muted);font:10px monospace}.quota-chart-dates{display:flex;justify-content:space-between;font:10px monospace;color:var(--muted)}.quota-chart-empty{text-align:center;padding:35px 10px;color:var(--muted);line-height:1.9}.quota-chart-note{margin:12px 0 0;color:var(--muted);font-size:11px}.quota-grid{margin-top:14px}.quota-grid [hidden],.quota-series[hidden],.quota-legend-item[hidden],.quota-no-results[hidden]{display:none}.quota-no-results{color:var(--muted);text-align:center;padding:18px}.quota-item .quota-value{overflow-wrap:anywhere}@media(max-width:767px){.quota-toolbar{align-items:flex-start;flex-direction:column}.quota-toolbar input{max-width:none}.quota-chart{padding:16px}.quota-chart svg{height:130px}}
.quota-pages{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:12px;color:var(--muted);font:12px monospace}.quota-pages[hidden]{display:none}
/* Private workspace: compact document panels and clear editing hierarchy. */
.admin-ui .corner-carousel{display:none}.admin-ui aside{overflow-y:auto}.admin-ui aside .bottom{padding-top:24px}.admin-ui nav a.active{box-shadow:inset 3px 0 var(--accent)}.admin-ui main{max-width:1500px}.admin-page-header{padding:6px 0 24px;border-bottom:1px solid var(--border);margin-bottom:24px}.admin-breadcrumb{font-size:12px;color:var(--muted);margin-bottom:12px}.admin-page-header h1{font-size:26px;letter-spacing:.02em;margin:0 0 10px}.admin-page-header p{margin:0;color:var(--secondary);line-height:1.7}.admin-ui .panel{padding:24px;box-shadow:2px 2px 0 var(--shadow-strong)}.admin-ui .panel>h2{margin:0 0 20px;font-size:17px;padding-bottom:14px;border-bottom:1px solid var(--border-soft)}.admin-ui .admin-grid{gap:20px;align-items:start;grid-template-columns:minmax(240px,.8fr) minmax(0,1.6fr)}.admin-ui .admin-grid>.panel{min-width:0}.admin-ui .stats{gap:12px;margin-bottom:24px}.admin-ui .stats .card{min-height:100px;padding:20px;background:var(--surface);box-shadow:2px 2px 0 var(--shadow-strong)}.admin-ui .stats h2{font:28px monospace;margin:14px 0 0}.admin-ui .stats .card:first-child{background:var(--selected)}.admin-ui form{gap:18px}.admin-ui label{font-size:13px;gap:8px;color:var(--text)}.admin-ui label input,.admin-ui label select,.admin-ui label textarea{background:var(--input-soft);border-color:var(--border-input);border-radius:6px;min-height:42px}.admin-ui textarea{min-height:106px;line-height:1.7}.admin-ui form>button{justify-self:start;min-width:110px}.admin-ui .task{padding:18px 0}.admin-ui .task p{line-height:1.7}.admin-ui .task button{padding:6px 12px;font-size:12px}.admin-ui .panel.page{max-width:100%}.admin-ui #settings-form,.admin-ui #work-form,.admin-ui #project-form,.admin-ui .provider-form{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-ui .field-wide,.admin-ui form>.links,.admin-ui form>.muted,.admin-ui form>button{grid-column:1/-1}.admin-ui .check{display:flex;align-items:center;min-height:42px;padding:8px 10px;background:var(--check-bg);border-radius:6px}.admin-ui .check input{min-height:0;width:16px;height:16px;accent-color:var(--accent)}.admin-toolbar{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:18px}.admin-toolbar label{width:min(360px,100%)}.admin-toolbar input{padding:10px 12px;border:1px solid var(--border);border-radius:6px}.admin-ui .provider-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.admin-ui .provider-grid>.panel{padding:0;overflow:hidden}.provider-details summary{cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:12px;padding:20px;list-style:none;background:var(--surface)}.provider-details summary::-webkit-details-marker{display:none}.provider-details summary:hover{background:var(--check-bg)}.provider-details h2{font-size:16px;margin:0;overflow-wrap:anywhere}.provider-status{font-size:11px;padding:3px 7px;border:1px solid var(--border);border-radius:4px;color:var(--secondary)}.provider-summary-value{grid-column:1/-1;font:22px monospace}.provider-summary-hint{grid-column:1/-1;font-size:12px;color:var(--muted)}.provider-details[open]>summary{background:var(--selected);border-bottom:1px solid var(--border)}.provider-details form{padding:20px}.admin-ui [hidden]{display:none!important}
@media(max-width:1024px){.admin-ui .admin-grid{grid-template-columns:1fr}.admin-ui .stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.admin-page-header{padding-bottom:18px;margin-bottom:18px}.admin-page-header h1{font-size:23px}.admin-ui .panel{padding:18px}.admin-ui #settings-form,.admin-ui #work-form,.admin-ui #project-form,.admin-ui .provider-form,.admin-ui .provider-grid{grid-template-columns:1fr}.admin-toolbar{align-items:stretch;flex-direction:column}.admin-toolbar label{width:100%}.admin-ui aside .bottom{display:none}.provider-details summary{padding:18px}}

.admin-select{position:relative;min-width:0}
.select-trigger{width:100%;min-height:42px;text-align:left;padding:10px 40px 10px 12px;background:var(--input-soft);border:1px solid var(--border-input);position:relative;font:inherit}
.select-trigger::after{content:'';position:absolute;right:16px;top:16px;width:7px;height:7px;border-right:1.5px solid var(--text);border-bottom:1.5px solid var(--text);transform:rotate(45deg)}
.select-menu{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:40;padding:5px;background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:2px 4px 0 var(--shadow-strong);max-height:280px;overflow:auto}
.select-menu button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:10px;font:inherit;min-height:40px}
.select-menu button:hover,.select-menu button:focus-visible,.select-menu button[aria-pressed=true]{background:var(--selected)}
.admin-ui .provider-grid>.panel:has(.select-menu:not([hidden])){overflow:visible}

.home-brand,.brand{color:inherit;text-decoration:none}.home-brand{min-width:0;display:flex;align-items:center}.home-brand:focus-visible,.brand:focus-visible{outline:2px solid var(--accent);outline-offset:5px;border-radius:3px}.dots{pointer-events:none;user-select:none}

.admin-select [hidden]{display:none!important}.filters .admin-select{min-width:140px}
.quota-legend{gap:16px 28px;flex-wrap:wrap;margin:18px 0}.quota-legend-item{flex-wrap:wrap;gap:8px}.quota-legend-item small{font-size:11px}
.quota-explorer{display:grid;gap:16px}.quota-plot-scroll{overflow-x:auto}.quota-plot-scroll svg{min-width:540px;width:100%;height:auto;display:block}.quota-plot-scroll circle:focus{outline:none;stroke:var(--text);stroke-width:2}
.quota-explorer,.quota-chart,.quota-plot-scroll{min-width:0;max-width:100%}.quota-chart-title{flex-wrap:wrap;gap:8px}

.usage-picker{position:relative;min-width:140px;font-size:14px;color:var(--text)}.usage-picker summary{list-style:none;cursor:pointer;border:1px solid var(--border);border-radius:6px;background:var(--surface);padding:10px 38px 10px 14px;position:relative}.usage-picker summary::-webkit-details-marker{display:none}.usage-picker summary::after{content:'';position:absolute;right:16px;top:16px;width:6px;height:6px;border-right:1.5px solid;border-bottom:1.5px solid;transform:rotate(45deg)}.usage-options{position:absolute;top:calc(100% + 6px);right:0;width:100%;padding:5px;background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:2px 4px 0 var(--shadow-strong);z-index:10}.usage-options button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:10px;min-height:40px}.usage-options button:hover,.usage-options button[aria-pressed=true]{background:var(--selected)}.usage-picker summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* Compact homepage usage panel. */
.panel.quota{padding:16px 18px;min-height:0}
.quota>.heading{margin-bottom:12px}
.quota .quota-chart{padding:12px 14px}
.quota .quota-chart-title{align-items:center;font-size:13px}
.quota .quota-plot-scroll svg{height:190px;min-width:0;margin-top:4px}
.quota .usage-picker{min-width:125px}
@media(max-width:767px){.panel.quota{padding:14px 12px}.quota .quota-chart{padding:10px 8px}.quota .quota-plot-scroll svg{height:auto;min-width:360px}.quota .heading{flex-wrap:wrap;gap:8px}}

/* Register the foliage to the actual pot; the clean plate supplies its own rim. */
.studio-right-plant{transform:translate(-27px,24px)}
.plant-layer.night .studio-right-plant{transform:none}
.quota .quota-plot-scroll{overflow:visible}
.quota .quota-plot-scroll svg{height:220px;min-width:0;width:100%;margin-top:6px}
.quota .quota-chart svg text{font-size:12px}
@media(max-width:767px){.quota .quota-plot-scroll svg{height:210px;min-width:0}.quota .quota-chart svg text{font-size:11px}}
.quota .quota-plot-scroll svg{height:280px}
@media(max-width:767px){.quota .quota-plot-scroll svg{height:280px}}

.quota .quota-chart-title{justify-content:flex-end}.quota .quota-plot-scroll{overflow-x:auto}.quota .quota-plot-scroll svg{min-width:780px}

.current-balance{margin-right:auto;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;color:var(--secondary);font-size:12px}.current-balance strong{font:20px monospace;color:var(--text)}.current-balance small{color:var(--muted)}
/* Let the usage chart share the surrounding pixel-dot background. */
.quota .quota-chart{background:transparent;border:0;border-radius:0;box-shadow:none}

/* Six original time-of-day paintings. No synthetic tint or old plant overlays. */
.hero .studio-six{position:absolute;inset:0;padding:0;border:0;background:none;box-shadow:none;max-width:none;width:100%;height:100%;z-index:0;opacity:1;pointer-events:none}
.studio-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;opacity:0;transition:opacity 600ms ease;pointer-events:none}
.studio-frame.is-current{opacity:1}
.hero::before,.hero::after{display:none}
@media(min-width:768px){.hero:hover,.hero:focus-visible{height:max(176px,calc((100vw - 248px) / 3))}}
@media(prefers-reduced-motion:reduce){.studio-frame{transition:none}.hero{transition:none}}

/* Individual leaves: anchored pivots, unequal periods, secondary flutter. */
.studio-leaf{transform-box:view-box}
.studio-leaf-0{transform-origin:58px 35px;--leaf-angle:0.45deg;animation-duration:5.10s;animation-delay:-0.30s}
.studio-leaf-1{transform-origin:375px 35px;--leaf-angle:0.61deg;animation-duration:5.57s;animation-delay:-0.91s}
.studio-leaf-2{transform-origin:625px 30px;--leaf-angle:0.77deg;animation-duration:6.04s;animation-delay:-1.52s}
.studio-leaf-3{transform-origin:840px 25px;--leaf-angle:0.93deg;animation-duration:6.51s;animation-delay:-2.13s}
.studio-leaf-4{transform-origin:1100px 25px;--leaf-angle:0.45deg;animation-duration:6.98s;animation-delay:-2.74s}
.studio-leaf-5{transform-origin:1400px 20px;--leaf-angle:0.61deg;animation-duration:7.45s;animation-delay:-3.35s}
.studio-leaf-6{transform-origin:1580px 30px;--leaf-angle:0.77deg;animation-duration:7.92s;animation-delay:-3.96s}
.studio-leaf-7{transform-origin:1750px 25px;--leaf-angle:0.93deg;animation-duration:5.10s;animation-delay:-4.57s}
.studio-leaf-8{transform-origin:2020px 95px;--leaf-angle:0.45deg;animation-duration:5.57s;animation-delay:-5.18s}
.studio-leaf-9{transform-origin:115px 145px;--leaf-angle:0.61deg;animation-duration:6.04s;animation-delay:-0.30s}
.studio-leaf-10{transform-origin:30px 360px;--leaf-angle:0.77deg;animation-duration:6.51s;animation-delay:-0.91s}
.studio-leaf-11{transform-origin:60px 485px;--leaf-angle:0.93deg;animation-duration:6.98s;animation-delay:-1.52s}
.studio-leaf-12{transform-origin:20px 550px;--leaf-angle:0.45deg;animation-duration:7.45s;animation-delay:-2.13s}
.studio-leaf-13{transform-origin:120px 576px;--leaf-angle:0.61deg;animation-duration:7.92s;animation-delay:-2.74s}
.studio-leaf-14{transform-origin:349px 345px;--leaf-angle:0.77deg;animation-duration:5.10s;animation-delay:-3.35s}
.studio-leaf-15{transform-origin:367px 346px;--leaf-angle:0.93deg;animation-duration:5.57s;animation-delay:-3.96s}
.studio-leaf-16{transform-origin:1600px 453px;--leaf-angle:0.45deg;animation-duration:6.04s;animation-delay:-4.57s}
.studio-leaf-17{transform-origin:1620px 447px;--leaf-angle:0.61deg;animation-duration:6.51s;animation-delay:-5.18s}
.studio-leaf-18{transform-origin:1664px 439px;--leaf-angle:0.77deg;animation-duration:6.98s;animation-delay:-0.30s}
.studio-leaf-19{transform-origin:1550px 466px;--leaf-angle:0.93deg;animation-duration:7.45s;animation-delay:-0.91s}
.studio-leaf-20{transform-origin:1723px 495px;--leaf-angle:0.45deg;animation-duration:7.92s;animation-delay:-1.52s}
@media(prefers-reduced-motion:no-preference){
.studio-leaf{animation-name:studio-leaf-drift;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-play-state:paused}
.studio-frame.is-current .studio-leaf{animation-play-state:running}
@keyframes studio-leaf-drift{0%,100%{transform:rotate(0deg)}23%{transform:rotate(var(--leaf-angle))}48%{transform:rotate(calc(var(--leaf-angle) * -.35))}72%{transform:rotate(calc(var(--leaf-angle) * -.8))}87%{transform:rotate(calc(var(--leaf-angle) * .2))}}
}

/* A bounded power-on sequence in the laptop display, replayed on room expansion. */
.navi-light{opacity:.65}.navi-start,.navi-cursor{opacity:0}
@media(prefers-reduced-motion:no-preference){
.studio-frame.is-current .navi-light{animation:navi-light-on 2.8s ease-out both}
.studio-frame.is-current .navi-start{animation:navi-power 1s ease-out both;transform-origin:1088px 448px}
.studio-frame.is-current .navi-letter{animation:navi-type .12s steps(1,end) both}
.studio-frame.is-current .navi-cursor{animation:navi-cursor-boot 3.8s steps(1,end) both}
.hero:is(:hover,:focus-visible) .studio-frame.is-current .navi-letter{animation-name:navi-type-expanded}
.hero:is(:hover,:focus-visible) .studio-frame.is-current .navi-start{animation-name:navi-power-expanded}
.hero:is(:hover,:focus-visible) .studio-frame.is-current .navi-light{animation-name:navi-light-expanded}
.hero:is(:hover,:focus-visible) .studio-frame.is-current .navi-cursor{animation-name:navi-cursor-expanded}
.studio-frame.is-current .navi-letter-0{animation-delay:.9s}
.studio-frame.is-current .navi-letter-1{animation-delay:1.06s}
.studio-frame.is-current .navi-letter-2{animation-delay:1.22s}
.studio-frame.is-current .navi-letter-3{animation-delay:1.38s}
.studio-frame.is-current .navi-letter-4{animation-delay:1.54s}
.studio-frame.is-current .navi-letter-5{animation-delay:1.7s}
.studio-frame.is-current .navi-letter-6{animation-delay:1.86s}
.studio-frame.is-current .navi-letter-7{animation-delay:2.02s}
.studio-frame.is-current .navi-letter-8{animation-delay:2.18s}
.studio-frame.is-current .navi-letter-9{animation-delay:2.34s}
@keyframes navi-type{0%{opacity:0}50%,100%{opacity:1}}
@keyframes navi-type-expanded{0%{opacity:0}50%,100%{opacity:1}}
@keyframes navi-power{0%{opacity:0;transform:scaleX(.1)}25%{opacity:.85}65%{opacity:.85;transform:scaleX(1)}100%{opacity:0}}
@keyframes navi-power-expanded{0%{opacity:0;transform:scaleX(.1)}25%{opacity:.85}65%{opacity:.85;transform:scaleX(1)}100%{opacity:0}}
@keyframes navi-light-on{from{opacity:0}to{opacity:.65}}
@keyframes navi-light-expanded{from{opacity:0}to{opacity:.65}}
@keyframes navi-cursor-boot{0%,20%,40%,60%,80%,96%,100%{opacity:0}10%,30%,50%,70%,90%{opacity:1}}
@keyframes navi-cursor-expanded{0%,20%,40%,60%,80%,96%,100%{opacity:0}10%,30%,50%,70%,90%{opacity:1}}
}

.work-entry{display:flex;align-items:flex-start;gap:14px}
.work-icon{display:block;width:56px;height:56px;flex:0 0 56px;object-fit:contain;border-radius:9px;background:var(--selected)}
.work-copy{min-width:0}
@media(max-width:767px){.work-entry{gap:10px}.work-icon{width:40px;height:40px;flex-basis:40px;border-radius:7px}.workrow:has(.work-icon) time{padding-left:50px}}
.work-version{display:block;margin-top:6px;font-size:12px;line-height:1.6;color:var(--secondary);overflow-wrap:anywhere}

/* Public work detail: readable copy and an actual product/download column. */
main:has(.work-detail){max-width:none}
.page.work-detail{max-width:none;margin-top:0;padding:28px 32px}
.detail-header{padding-bottom:22px;border-bottom:1px solid var(--border-soft);margin-bottom:28px}
.detail-breadcrumb{margin:0 0 16px;color:var(--secondary);font-size:12px}
.detail-header h1{margin:0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.detail-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,32%);gap:clamp(28px,4vw,64px);align-items:start}
.detail-body,.detail-side{min-width:0}
.detail-body section+section{margin-top:28px}
.detail-content h2{font-size:17px;margin:0 0 14px}
.detail-body p{margin:0;max-width:78ch}
.detail-features{margin:0;padding-left:20px;line-height:1.9;max-width:78ch}
.detail-features li+li{margin-top:8px}
.detail-features li::marker{color:var(--accent)}
.detail-links{margin-top:28px;padding-top:20px;border-top:1px solid var(--border-soft)}
.detail-links a{min-height:44px;display:inline-flex;align-items:center;text-decoration:underline;text-decoration-color:var(--border);text-underline-offset:4px}
.detail-side{border-left:1px solid var(--border-soft);padding-left:28px}
.detail-downloads{margin-bottom:26px}
.package-download{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:68px;padding:12px 14px;border:1px solid var(--border);border-radius:6px;background:var(--selected)}
.package-download+.package-download{margin-top:8px}
.package-download:hover{background:var(--selected-hover);border-color:var(--accent);text-decoration:none}
.package-download>span:first-child{min-width:0;overflow-wrap:anywhere}
.package-download strong{display:block;font-size:14px}
.package-version{font-weight:400}
.package-download small{display:block;font-size:11px;color:var(--secondary);line-height:1.6;margin-top:4px}
.download-arrow{font-size:22px;flex:none}
.detail-info{border-top:1px solid var(--border-soft);padding-top:20px}
.detail-info dl{display:grid;grid-template-columns:60px minmax(0,1fr);gap:10px;margin:0;font-size:12px;line-height:1.7}
.detail-info dt{color:var(--secondary)}
.detail-info dd{margin:0;overflow-wrap:anywhere}
.preview-sheet .detail-layout{grid-template-columns:minmax(0,1fr)}
.preview-sheet .detail-side{border-left:0;padding-left:0}
@media(max-width:1024px){.page.work-detail{padding:24px}.detail-layout{grid-template-columns:minmax(0,1fr) minmax(240px,36%);gap:24px}.detail-side{padding-left:20px}}
@media(max-width:767px){.page.work-detail{padding:20px 16px}.detail-header{padding-bottom:18px;margin-bottom:20px}.detail-layout{grid-template-columns:minmax(0,1fr);gap:28px}.detail-side{grid-row:1;border-left:0;padding-left:0}.detail-info{padding-top:16px}.detail-body{border-top:1px solid var(--border-soft);padding-top:24px}.detail-downloads{margin-bottom:20px}.detail-header h1{font-size:22px}}

/* Login persistence options use the same quiet, readable form style. */
.login .login-note{margin:0;font-size:12px;line-height:1.65;color:var(--secondary)}
.login > .login-note{margin-top:16px}
.login .admin-select{min-width:0}
@media(max-width:767px){.login{margin:28px auto}.login input{font-size:16px}}

/* A real CJK pixel face for names outside the compact Latin SVG alphabet. */
.pixel-text{display:block;font-family:'Fusion Pixel',system-ui,sans-serif;font-weight:400;font-synthesis:none;letter-spacing:0;overflow-wrap:anywhere}
.window .pixel-text{font-size:24px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand .pixel-text{font-size:24px;line-height:1.25}
.hero .pixel-text{font-size:36px;line-height:1.25}
@media(max-width:767px){.hero .pixel-text{font-size:24px}}

.publish-panel{margin-top:16px;scroll-margin-top:76px}.publish-config{margin-top:20px}.publish-config summary{cursor:pointer;min-height:44px}.publish-config form{margin-top:16px}.publish-panel .links{flex-wrap:wrap}

/* Foldable inner screens and split windows share a side drawer.
   Content breakpoints stay independent: wider inner screens retain two columns. */
aside{overflow-y:auto}
footer{gap:10px;flex-wrap:wrap}
.drawer-heading,.nav-backdrop{display:none}
@media(max-width:1024px){
 aside{position:fixed;inset:0 auto 0 0;width:min(300px,calc(100vw - 56px));height:100vh;height:100dvh;padding:16px;border-right:1px solid var(--border);border-bottom:0;z-index:31;visibility:hidden;transform:translateX(-100%);transition:transform 180ms ease,visibility 180ms;overscroll-behavior:contain}
 aside.drawer-open{visibility:visible;transform:translateX(0);transition:transform 180ms ease}
 aside .brand{display:flex;margin:20px 0 24px;flex-shrink:0}
 aside .bottom{display:none}
 .window .mobile-menu{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;border:0;background:transparent}
 .window .dots{display:none}
 .window .home-brand{flex:1;min-width:0}
 .window .home-brand b{min-width:0;max-width:100%;overflow:hidden}
 .window .home-brand .pixel-title{max-width:100%}
 .drawer-heading{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;color:var(--muted);font-size:12px;border-bottom:1px solid var(--border-soft);padding-bottom:10px}
 .drawer-close{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0}
 aside nav,aside nav.open{display:grid;overflow:visible;gap:8px}
 aside nav a{display:flex;align-items:center;min-height:48px;white-space:normal;padding:12px}
 .nav-backdrop:not([hidden]){display:block;position:fixed;inset:0;z-index:30;background:var(--backdrop);touch-action:none}
 body.nav-open{position:fixed;width:100%;overflow:hidden}
 main{margin-left:0;padding:16px}
 .window{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
 aside{padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));padding-left:max(16px,env(safe-area-inset-left))}
 main{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right));padding-bottom:max(16px,env(safe-area-inset-bottom))}
}
@media(hover:none),(pointer:coarse){
 .hero,.hero:hover,.hero:focus-visible{height:auto;min-height:176px}
 .hero:hover>div:first-child,.hero:focus-visible>div:first-child{opacity:1;pointer-events:auto}
 .usage-picker summary,.usage-options button,.filters button,.filters select,.links a{min-height:44px}
 .window .tools>a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
}
@media(max-width:520px){
 .quota-header-actions{flex-basis:100%;max-width:none;justify-content:space-between;text-align:left;gap:8px}
 .quota-header-actions span{width:auto;flex:1;min-width:0}
 .quota-header-actions .text-button{flex:none}
 .workrow{align-items:start;padding-inline:0;gap:8px}
 .work-entry{display:block}
 .work-icon{float:left;margin:0 10px 8px 0}
 .work-copy{display:contents}
 .work-copy p{clear:both}
 .workrow:has(.work-icon) time{padding-left:0}
}