

:root{--orange:#ec673a;--paper:#fff3dd;--ink:#23221f;--muted:#786b60;font-family:Claus UI,Arial,sans-serif;color:var(--ink);background:var(--orange);color-scheme:light}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--paper);outline-offset:7px}button:active{scale:.96}[hidden]{display:none!important}svg,img{display:block}svg{stroke-linecap:round;stroke-linejoin:round}button{transition:scale 180ms,background 180ms}button svg,button img{pointer-events:none}
main{height:100svh;min-height:0;position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 48% 41%,#f68859 0%,#ee7144 39%,#e96436 78%)}
.texture{position:absolute;inset:0;pointer-events:none;opacity:.075;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' d='M0 0h180v180H0z' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
.ambient{position:absolute;left:50%;top:49%;width:min(70vw,1000px);aspect-ratio:1.2;translate:-50% -50%;border-radius:50%;background:radial-gradient(ellipse,#ffb17a25,transparent 64%);pointer-events:none}
#scene{position:absolute;inset:10px 22px 55px}
.world{position:absolute;padding:0;border:0;background:transparent;transform:translate(-50%,-50%) scale(var(--scale,1));transform-origin:center;border-radius:35px;isolation:isolate;outline-offset:12px;display:block;color:inherit;text-decoration:none;filter:blur(0);transition:opacity 150ms ease-out,filter 150ms ease-out;z-index:2}.world:active{scale:1}.world.dim{opacity:.5}.world.active{z-index:5}.world .object{position:relative;width:100%;height:100%;pointer-events:none;transition:translate 220ms,rotate 220ms,filter 220ms}.world:hover .object,.world:focus-visible .object,.world.active .object{translate:0 -9px}.world:active .object{scale:.96}.world .object>*{position:absolute}.art-shadow{box-shadow:0 2px 3px #632b1b0b,0 9px 13px #632b1b18,0 29px 40px -13px #632b1b39,0 45px 65px -20px #632b1b26}.glyph{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.65}
.name{position:absolute;top:calc(100% + 19px);left:50%;translate:-50% 0;padding:8px 13px;border-radius:30px;background:#fff3dde8;box-shadow:0 3px 14px #63311b18;font-size:14px;font-weight:550;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity 150ms ease-out,visibility 0s linear 150ms;pointer-events:none}.world:focus-visible .name{opacity:1;visibility:visible;transition-delay:0s}@media(hover:hover) and (pointer:fine){.world:hover .name{opacity:1;visibility:visible;transition-delay:0s}}.world.active .name{opacity:0;visibility:hidden}
.core{z-index:3}.core .object{filter:drop-shadow(0 21px 14px #8f3a2223);transition:translate 240ms,filter 240ms}.core:hover .object,.core:focus-visible .object{translate:0 -5px;filter:drop-shadow(0 27px 20px #8f3a2238)}.mascot{width:100%;height:100%;overflow:visible}.core::before{content:'';position:absolute;bottom:17px;left:20%;right:13%;height:24px;border-radius:50%;background:#78321b1e;filter:blur(17px)}
/* The workspace is a small object with the same file/editor structure as Builder. */
.builder-back{inset:10px 15px 6px 14px;background:#f9b286;border-radius:15px;rotate:4deg;box-shadow:inset 0 1px 0 #ffffff5e,0 8px 15px #6d2e1e12}.builder-window{inset:0 20px 20px 0;background:var(--paper);border-radius:14px;rotate:-7deg;overflow:hidden;box-shadow:inset 0 1px 0 #fff9,0 1px 1px #65362114,0 14px 27px #7e361e26,0 30px 50px -15px #7e361e35}.window-top{height:29px;padding:11px 12px;display:flex;gap:5px;border-bottom:1px solid #342b2012}.window-top i{width:5px;height:5px;background:#ddd1bd;border-radius:50%}.window-top i:first-child{background:#ea744f}.window-top em{margin-left:auto;width:48px;height:4px;border-radius:2px;background:#d6cbb9}.window-body{display:flex;height:calc(100% - 29px)}.filetree{padding:19px 12px;width:68px;border-right:1px solid #342b2010;display:flex;flex-direction:column;gap:13px}.filetree i{height:4px;background:#ddd1bc;border-radius:3px;width:34px;position:relative}.filetree i:before{content:'';width:5px;height:5px;background:#cbbda5;position:absolute;left:-6px;top:0}.filetree i:nth-child(2){background:#e98764;width:27px}.editor{padding:16px;display:flex;gap:8px;flex-direction:column;flex:1}.code-line{display:flex;gap:5px;height:4px}.code-line i{display:block;height:4px;border-radius:2px;background:#bdb3a2;width:38px}.code-line i:first-child{background:#e27b59;width:19px}.code-line:nth-child(2),.code-line:nth-child(3),.code-line:nth-child(5){padding-left:13px}.code-line:nth-child(3) i:last-child{width:23px;background:#b2977b}.code-line:nth-child(4){margin-top:5px}.code-line:nth-child(6) i:first-child{width:8px;background:#b2977b}
/* A research notebook, with sources gathered into a single page. */
.research-paper{inset:10px 17px 4px 17px;border-radius:6px 14px 14px 6px;background:#f8dfb5;rotate:-7deg;box-shadow:0 10px 18px #70391e17}.research-cover{inset:0 4px 16px 4px;border-radius:7px 14px 14px 7px;background:linear-gradient(110deg,#fff7e9,#f8ead2);rotate:5deg;overflow:hidden;box-shadow:inset 3px 0 4px #af906317,0 10px 20px #76351c27,0 25px 37px -15px #76351c27}.binding{position:absolute;left:19px;top:0;bottom:0;width:1px;background:#c4ac872f}.research-cover svg{position:absolute;width:172px;height:105px;left:42px;top:21px}.paper-rule{position:absolute;left:42px;height:3px;background:#baa4823d;border-radius:3px;bottom:24px;width:90px}.paper-rule.short{bottom:16px;width:53px}.bookmark{position:absolute;right:26px;top:-1px;width:17px;height:28px;background:#e9754d;clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%)}
/* The actual collection artwork, kept intact in small print-like frames. */
.print{width:163px;height:198px;left:38px;top:9px;background:#fff3de;border-radius:8px;padding:9px 9px 26px;box-shadow:0 1px 1px #602d1914,0 15px 25px #78381f2a,0 30px 40px -14px #78381f29;overflow:hidden}.print img{width:100%;height:100%;object-fit:cover;border-radius:3px}.print.back{rotate:-16deg;left:-1px;top:17px;background:#ebd6b4}.print.mid{rotate:17deg;left:88px;top:12px;background:#f7ead4}.print.front{rotate:1deg;top:0;left:39px}.print.front:after{content:'';position:absolute;bottom:12px;left:50%;translate:-50%;height:4px;width:21px;border-radius:2px;background:#cab89a}
/* Five installed modules on a single CLAUS contract assembly. */
.board-base{inset:12px 3px 3px 3px;background:#dcb083;border-radius:17px;rotate:-9deg;box-shadow:0 3px 0 #b36b4d,0 19px 24px #773c242e}.board{inset:0 0 17px 0;background:linear-gradient(130deg,#f9eace,#ead6ae);border-radius:17px;rotate:-9deg;overflow:hidden;box-shadow:inset 0 1px 0 #fffa,0 1px 2px #895b2726}.board:before,.board:after{content:'';position:absolute;width:4px;height:4px;border-radius:50%;background:#beab8a;top:11px;box-shadow:0 1px 1px #fff}.board:before{left:12px}.board:after{right:12px}.board-traces{position:absolute;inset:0;width:100%;height:100%;stroke:#baa57a;stroke-width:1;fill:none}.chip{position:absolute;width:69px;height:67px;left:27px;top:28px;background:linear-gradient(140deg,#3a3b31,#25261f);border-radius:12px;display:grid;place-items:center;color:#f5e5c5;box-shadow:inset 0 1px 0 #fff2,0 3px 0 #161a11,0 10px 15px #6f59372a}.chip .glyph{width:39px;height:39px;stroke-width:1.2}.chip:after{content:'';position:absolute;inset:-5px -5px;z-index:-1;border:4px dashed #c6b387;border-radius:12px}.modules{position:absolute;right:23px;top:32px;display:grid;grid-template-columns:repeat(3,32px);gap:10px}.module{width:32px;height:32px;display:grid;place-items:center;border-radius:7px;background:#fff8e7;box-shadow:0 2px 0 #c4af82,0 5px 7px #6b50301b}.module .glyph{width:17px;height:17px;stroke-width:1.4}.module:nth-child(4){grid-column:2}.contract-stitch{position:absolute;bottom:20px;left:29px;width:54px;height:4px;border-radius:4px;background:#baa480;box-shadow:0 8px 0 -1px #c9b795}
/* Holder conversations and the existing virtual-pet experience. */
.message{height:81px;width:220px;border-radius:18px;padding:16px;display:flex;gap:12px;align-items:center}.message:after{content:'';position:absolute;width:19px;height:19px;bottom:-6px;left:25px;rotate:30deg;border-radius:4px;background:inherit}.message.back{top:0;left:36px;background:#f6af80;rotate:8deg;box-shadow:inset 0 1px 0 #fff5,0 12px 19px #723d231c}.message.front{top:61px;left:0;background:var(--paper);rotate:-5deg;box-shadow:inset 0 1px 0 #fff,0 13px 24px #7e3e232b,0 26px 36px -13px #7e3e2326}.avatar{width:43px;height:43px;border-radius:50%;object-fit:cover;flex:none}.message-lines{display:flex;flex-direction:column;gap:7px;flex:1}.message-lines i{height:4px;width:91px;background:#b4a58b64;border-radius:3px}.message-lines i:last-child{width:63px}.message.back .message-lines i{background:#ad5c3d4a}
/* The droplet rests on a soft contact shadow, without a drawn platform. */
.splash-shadow{position:absolute;left:75px;bottom:11px;width:130px;height:12px;border-radius:50%;background:#77361f24;filter:blur(7px)}
.splash-character{position:absolute;height:232px;width:232px;object-fit:contain;top:-1px;left:24px;filter:drop-shadow(0 8px 6px #622a2414)}
.utility{position:absolute;bottom:22px;display:flex;align-items:center;gap:6px;z-index:9;background:#f9b18447;padding:5px;border-radius:40px;box-shadow:inset 0 1px 0 #ffd5aa38}.utility.left{left:25px}.utility.right{right:25px}.utility button,.utility a{display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;border-radius:50%;color:#502e22;text-decoration:none}.utility button:hover,.utility a:hover{background:#fff2d873}.utility .glyph{width:18px;height:18px;stroke-width:1.55}
dialog{position:fixed;margin:0;inset:auto;width:345px;max-width:calc(100vw - 32px);max-height:calc(100svh - 50px);padding:0;overflow:auto;overscroll-behavior:contain;background:#fff4e2;border:1px solid #ffffff6b;border-radius:22px;box-shadow:0 8px 19px #7b371c17,0 30px 80px #7b371c3b;color:var(--ink);z-index:15}dialog:focus{outline:none}.panel-head{padding:22px 22px 10px;display:flex;align-items:center;gap:11px}.panel-head .section-icon{width:40px;height:40px;border-radius:13px;background:#ec673a19;display:grid;place-items:center;color:#8b4227}.section-icon .glyph{width:22px;height:22px}.close{margin-left:auto;width:36px;height:36px;background:transparent;border:0;border-radius:50%;display:grid;place-items:center}.close:hover{background:#4c321011}.close .glyph{width:18px;height:18px}.panel-body{padding:4px 22px 23px}.eyebrow{font-size:10px;font-weight:650;letter-spacing:.09em;text-transform:uppercase;color:#92745c;margin:0 0 9px}h1{font-size:28px;line-height:1.1;letter-spacing:-.035em;margin:0 0 12px;font-weight:600}p{font-size:13px;line-height:1.6;margin:0 0 20px;color:#716250}.items{display:grid;gap:2px}.item{position:relative;display:flex;align-items:center;gap:11px;border:0;background:transparent;text-align:left;width:100%;padding:11px 0;border-top:1px solid #82654919;text-decoration:none;color:inherit}.item .glyph{width:20px;height:20px;flex:none;color:#897357}.item span{display:flex;flex-direction:column;gap:3px}.item b{font-weight:500;font-size:13px}.item small{font-size:10px;color:#9b8067}.item:after{content:'↗';font-size:15px;color:#947d60;margin-left:auto;align-self:center}.item:hover b{text-decoration:underline;text-underline-offset:3px}.item.internal:after{content:'›'}.visit{display:flex;align-items:center;justify-content:space-between;background:#292b23;color:#fff1d7;padding:13px 15px;border-radius:11px;margin-top:17px;text-decoration:none;font-size:13px}.visit .glyph{width:17px;height:17px}.back{border:0;background:transparent;font-size:12px;padding:0;margin:0 0 16px;color:#897257}.back:hover{text-decoration:underline}.footnote{font-size:11px;line-height:1.6;color:#9a8169;margin:20px 0 0}.tag{display:inline-block;border:1px solid #9c7c532e;border-radius:6px;padding:5px 7px;font-size:10px;color:#826345;margin-bottom:14px}.directory .item{padding:11px 0}.directory .item:after{content:'›'}
@media(max-width:620px){#scene{inset:0 10px 64px}.utility{bottom:17px}.utility.left{left:16px}.utility.right{right:16px}dialog{width:calc(100vw - 32px);max-height:70svh}.name{font-size:20px;padding:11px 18px;top:calc(100% + 10px)}.world:focus-visible{outline-width:5px;outline-offset:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}.world:hover .object,.world:focus-visible .object,.world.active .object{translate:0}.core:hover .object{translate:0}}
@media(forced-colors:active){.world:focus-visible{outline:3px solid Highlight}.world{border:1px solid ButtonText}.name{color:ButtonText;background:Canvas}}

/* The approved composition stays intact. Materials share one light source. */
:root{--copy:#675640;--secondary:#78634d;--edge:#402b1518;--focus:#2a2b22}
.world .object{transition:translate 150ms ease-out,scale 150ms ease-out,filter 150ms ease-out}
.world:hover .object,.world:focus-visible .object,.world.active .object{translate:0 -5px}
.world.dim{opacity:.58;filter:blur(2px)}
.panel-open .name{opacity:0!important;visibility:hidden!important}
.world:focus-visible{outline:2px solid var(--focus);outline-offset:12px}
.builder-window{box-shadow:inset 0 1px 0 #fff,0 0 0 .7px #fff4,0 2px 2px #7b48281c,0 11px 17px #71351723,0 25px 36px -13px #79341638}
.builder-back{background:linear-gradient(150deg,#fac69d,#e3a476)}
.window-top{height:30px;background:linear-gradient(#fff8eb80,#f5e7cd20)}
.window-top:after{content:'';width:8px;height:7px;margin-left:7px;border:1px solid #c9bca7;border-radius:1px;translate:0 -2px}
.filetree{background:linear-gradient(90deg,#efdfc027,#f8e9ce18)}
.filetree i:nth-child(3),.filetree i:nth-child(4){margin-left:5px;width:29px}
.filetree i:nth-child(5){width:20px}
.editor{position:relative;gap:9px;padding:17px 15px 16px 20px}
.editor:before{content:'';position:absolute;left:11px;top:41px;width:1px;height:43px;background:#ddcdb043}
.code-line:nth-child(2) i:last-child{width:24px;background:#b2977b}
.code-line:nth-child(4) i:nth-child(2){width:29px}
.code-line:nth-child(5) i:first-child{width:10px}
.code-line:nth-child(6) i:last-child{width:23px}
.code-line:nth-child(7){padding-left:13px}
.code-line:nth-child(7) i{width:9px;background:#bb9b75}
.code-line:nth-child(7) i:nth-child(n+2){display:none}




.research-pages{inset:17px 12px -1px 15px;rotate:-4deg;border-radius:6px 12px 12px 6px;background:repeating-linear-gradient(to bottom,#dbc7a5 0px,#dbc7a5 1px,#f1dfbd 1px,#f1dfbd 3px);box-shadow:0 3px 7px #7d381a13}
.research-cover{box-shadow:inset 1px 0 1px #fff,inset 4px 0 4px #ae916f19,0 1px 2px #63301113,0 11px 17px #71351727,0 29px 32px -19px #79341633}
.research-cover .bookmark{background:linear-gradient(90deg,#c66c46,#e0895d 50%,#d1754c);box-shadow:1px 1px 3px #6b342227}
.notebook-stitch{position:absolute;left:11px;top:13px;bottom:13px;width:2px;background:repeating-linear-gradient(to bottom,#b8a28170 0px,#b8a28170 2px,transparent 2px,transparent 9px);border-radius:2px}

.print{height:188px;padding:9px 9px 34px;border-radius:7px;background:linear-gradient(130deg,#262522,#080808);box-shadow:0 0 0 1px #11110e,0 2px 3px #11110e14,0 12px 18px #11110e22,0 26px 33px -14px #11110e2e}
.print img{height:145px;width:145px;object-fit:contain;border-radius:2px;outline:.75px solid #00000017;outline-offset:-.75px}
.print.back{background:#11110e}
.print.mid{background:#262522}
.print.front:after{height:3px;width:18px;bottom:14px;background:#fff2d8}
.print-grain{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,#fff2d80d,transparent 25%,transparent 75%,#00000012);z-index:1}

.board{background:linear-gradient(135deg,#fff0cf,#ebd6aa);box-shadow:inset 0 1px 0 #fff8,0 0 0 .75px #fff3,0 1px 2px #8c683032}
.board:before,.board:after{width:5px;height:5px;background:radial-gradient(circle,#b69b68 0 22%,#eed8b1 27% 45%,#baa377 50% 68%,#f8e5bc 73%);box-shadow:0 1px 1px #fff7}
.board-base{background:linear-gradient(100deg,#e6c697,#d4af7f);box-shadow:0 3px 0 #b58352,0 7px 7px #8c4c2824,0 22px 25px #7b3d2229}
.board-traces{stroke:#b8a16f;opacity:.67}
.chip{background:linear-gradient(145deg,#da936a,#bd6743);color:#fff4df;box-shadow:inset 0 1px 0 #ffe2b980,inset 1px 0 0 #fff0d433,0 3px 0 #985234,0 6px 7px #71422725}
.chip:after{border-color:#c8b47a;border-width:3px}
.chip:before{content:'';position:absolute;left:6px;top:6px;width:3px;height:3px;border-radius:50%;background:#edbd8a}
.module{background:linear-gradient(135deg,#fff9e9,#f9edce);box-shadow:inset 0 1px 0 #fff,0 2px 0 #c3af7e,0 5px 5px #765c3521}
.module:after{content:'';position:absolute;width:2px;height:2px;margin:23px 0 0 23px;background:#c1b08c;border-radius:50%}
.board-contact{position:absolute;bottom:17px;right:30px;width:29px;height:4px;border-radius:1px;background:repeating-linear-gradient(90deg,#bd9d62 0 3px,transparent 3px 6px)}
.board-contact.two{right:68px;width:16px}
.message.front{background:linear-gradient(120deg,#fff8e8,#f8e9cc);box-shadow:inset 0 1px 0 #fff9,0 1px 2px #5d2a0e15,0 12px 17px #6b361e22,0 26px 30px -16px #783c2230}
.message.back{background:linear-gradient(120deg,#f8bc8c,#efad79)}
.message .avatar{outline:.75px solid #00000017;outline-offset:-.75px}
.message-lines i:nth-child(2){width:107px}.message-lines i:last-child{width:55px}


/* A consistent inspector: stable controls and a separately scrolling body. */
dialog{width:364px;max-width:calc(100vw - 32px);max-height:min(720px,calc(100svh - 42px));overflow:hidden;border:1px solid #fff7;border-radius:21px;background:#fff4e1;box-shadow:0 1px 3px #572d171a,0 12px 24px #6b321b24,0 32px 72px -12px #79351d54}
dialog[open]{display:flex;flex-direction:column}
.panel-head{flex:none;min-height:73px;padding:15px 18px 10px;gap:10px;background:#fff4e1}
.section-icon{flex:none;width:35px!important;height:35px!important;border-radius:11px!important;background:#ead3ae66!important;color:#745139!important}
.section-icon .glyph{width:20px!important;height:20px!important}
#panel-trail{color:var(--secondary);font-size:11px;line-height:1.35;font-weight:500;min-width:0}
.close,#panel-back{flex:none;min-width:40px;height:40px;border:0;background:transparent;border-radius:50%;padding:10px;display:grid;place-items:center;color:#64543e}
.close{margin-left:auto}.close:hover,#panel-back:hover{background:#d5bb8e30}
#panel-back .glyph,.close .glyph{width:18px;height:18px;stroke-width:1.5}
.panel-body{padding:5px 22px 22px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c6aa7f transparent;min-height:0}
.panel-body h2{font-size:27px;line-height:1.12;letter-spacing:-.035em;font-weight:600;margin:0 0 13px}
.panel-body h2:focus{outline:none}
.panel-body p{font-size:13px;line-height:1.65;color:var(--copy);margin:0 0 19px}
.panel-body .eyebrow{font-size:10px;letter-spacing:.085em;color:#8a6b4c;margin-bottom:8px}
.section-title{margin:22px 0 8px;font-size:10px;letter-spacing:.07em;text-transform:uppercase;font-weight:600;color:#876a4c}
.items{gap:0}
.item{min-height:54px;padding:10px 0;gap:11px;border-top:1px solid #82654917;border-radius:0}
.item:after{content:none!important}.item .trailing{margin-left:auto;width:15px;height:15px;color:#9b815f;flex:none}
.item .glyph{color:#81694b;width:20px;height:20px;stroke-width:1.5}
.item>.item-copy{flex:1;min-width:0}
.item>span:not(.item-copy){flex:none;display:grid;place-items:center;width:20px}
.item>.trailing{width:15px!important}
.item>.trailing .glyph{width:14px;height:14px}
.item b{font-size:13px;font-weight:500;line-height:1.35}.item small{font-size:11px;line-height:1.35;color:#816c54}
.item:hover{background:linear-gradient(90deg,transparent,#edddbd38,transparent)}
.item:hover b{text-decoration:none;color:#a04d2d}
.item:focus-visible{outline:2px solid #705538;outline-offset:2px;border-radius:5px}
.connection-row .glyph{color:#ab7650}
.tag{font-size:10px;font-weight:500;letter-spacing:.01em;line-height:1.4;padding:5px 8px;border-color:#a1815838;color:#785b3d;background:#f3e4c756;border-radius:6px;display:inline-flex;gap:6px;align-items:center}
.tag svg{width:12px;height:12px;stroke-width:1.5}
.tag.prototype{border-style:dashed;background:#edbe8d1c}
.context-note{padding:11px 12px;border-radius:8px;background:#ead4ae35;border:1px solid #cba87617;font-size:11px;line-height:1.6;color:#856646;margin-top:19px}
#panel-footer{flex:none;padding:12px 20px 18px;border-top:1px solid #98754419;background:#fff4e1}
#panel-footer .visit{margin:0;min-height:43px;font-size:13px;border-radius:10px;background:linear-gradient(125deg,#383a2b,#292d22);box-shadow:inset 0 1px 0 #88896b42,0 1px 1px #3f2a1512}
#panel-footer .visit:hover{background:#434835}
#panel-footer .visit:focus-visible,.close:focus-visible,#panel-back:focus-visible{outline:2px solid #775334;outline-offset:3px}
.search-wrap{display:flex;align-items:center;gap:9px;border:1px solid #c8ae8559;background:#fffaef;border-radius:10px;padding:0 11px;margin:17px 0 12px;min-height:44px}
.search-wrap:focus-within{outline:2px solid #8c6846;outline-offset:2px}
.search-wrap .glyph{width:17px;height:17px;stroke-width:1.5;color:#927754;flex:none}
.search-wrap input{width:100%;border:0;background:transparent;color:#403b2c;font:inherit;font-size:16px;line-height:1.4;padding:11px 0;outline:none}
.search-wrap input::placeholder{color:#806749}
.search-clear{width:44px;height:44px;border:0;background:transparent;border-radius:7px;padding:13px;display:grid;place-items:center;flex:none}
.search-clear:hover{background:#edddbd80}.search-clear .glyph{width:15px;height:15px}
.search-result-count{font-size:10px;color:#806749;min-height:14px;margin:3px 0 8px}
.empty-search{padding:20px 0;color:#806749!important;font-size:13px!important}
.legend{display:grid;gap:12px;margin:20px 0}.legend>div{display:flex;align-items:flex-start;gap:10px;font-size:12px;line-height:1.5;color:#756047}.legend .glyph{width:17px;height:17px;flex:none;margin-top:1px}
.name{box-shadow:0 2px 4px #663a1412,0 5px 15px #663a1417;font-weight:500}
@media(max-width:680px){dialog{width:calc(100vw - 32px);max-height:min(72svh,700px)}.panel-head{min-height:63px;padding:11px 14px 6px}.close,#panel-back{min-width:44px;height:44px}.panel-body{padding:5px 19px 20px}.panel-body h2{font-size:26px}#panel-footer{padding:12px 17px 16px}.world:focus-visible{outline-width:4px}}
@media(prefers-reduced-motion:reduce){.world:hover .object,.world:focus-visible .object,.world.active .object{translate:0}.world:active .object{scale:1}}
@media(forced-colors:active){.world:focus-visible{outline-color:Highlight}.search-wrap input{color:CanvasText}.tag,.context-note{border:1px solid CanvasText}.item b,.item small,.panel-body p{color:CanvasText}}

@media(hover:none){.world:hover:not(:focus-visible) .object{translate:0}}

/* Each product is one clear object, without the repeated dark accessory tile. */
.builder-window{inset:0 8px 10px 2px}
.builder-back{inset:9px 4px 1px 14px}
.message.front{width:236px;top:65px}
.message.back{left:29px}
.research-cover svg{left:40px;top:18px;width:177px;height:108px}

/* Four distinct product silhouettes, drawn at their displayed proportions. */
.world .product-art{inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 8px 5px #11110e18) drop-shadow(0 18px 16px #11110e20)}

/* Hover and release share a curve; the central character always stays present. */
.world{transition:opacity 220ms cubic-bezier(.2,.7,.2,1),filter 220ms cubic-bezier(.2,.7,.2,1)}
.world .object{transition:translate 220ms cubic-bezier(.2,.7,.2,1),scale 180ms cubic-bezier(.2,.7,.2,1),filter 220ms ease}
.world .name{translate:-50% 4px;transition:opacity 160ms ease,translate 200ms cubic-bezier(.2,.7,.2,1),visibility 160ms allow-discrete}
.world:focus-visible .name{translate:-50% 0}
@media(hover:hover) and (pointer:fine){.world:hover .name{translate:-50% 0}}
@media(prefers-reduced-motion:reduce){.world .object,.world .name{transition:none!important}}

/* Equal product footprints with optical corrections for each silhouette. */
.world .lab-art{width:226px;height:226px;left:27px;top:7px}
.world .nft-stack{position:absolute;width:257px;height:218px;left:43px;top:34px;transform:scale(.74);transform-origin:0 0}
.world .nft-stack>.print{position:absolute}

/* Keep a hovered or keyboard-focused label above neighbouring artwork. */
body[data-ui=network] main#network-main{overflow:clip}
#world-lab .name{top:calc(100% - 12px)}
.world:focus-visible{z-index:6}
@media(hover:hover) and (pointer:fine){.world:hover{z-index:6}}

/* Touch users can read every destination before opening it. */
@media (max-width:700px),(hover:none),(pointer:coarse){
 .world:not(.core) .name{opacity:1;visibility:visible;translate:-50% 0;transition:none;background:transparent;box-shadow:none;color:#11110e;font-weight:550;pointer-events:auto;padding:6px 8px;font-size:calc(13px / var(--scale,1))}
 .world:not(.core).active .name{opacity:1;visibility:visible}
}

/* An upcoming destination still exposes its status on hover and keyboard focus. */
.world[aria-disabled="true"]{cursor:default}
.world[aria-disabled="true"]:active .object{scale:1}
body[data-ui=network] .world[aria-disabled="true"]:active{transform:translate(-50%,-50%) scale(var(--scale,1));scale:1}
@media (min-width:701px) and (hover:hover) and (pointer:fine){
 .world[aria-disabled="true"] .name{font-size:calc(13px / var(--scale,1));padding:calc(6px / var(--scale,1)) calc(10px / var(--scale,1))}
}
@media (max-width:700px){
 #world-build .name{top:calc(100% - 20px)}
}
