/* World Experiment 001. A quiet instrument frame around a living pixel world. */
:root { --lab-bg:#0f2224; --lab-panel:#152e2d; --lab-ink:#eeeade; --lab-muted:#a9bcb0; --lab-accent:#b6d6ad; --lab-line:#b8cba52b; --lab-mono:ui-monospace,SFMono-Regular,Consolas,monospace; }
body { font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--lab-ink); }
button,a,input,select,summary { -webkit-tap-highlight-color:transparent; }
button { transition:background-color .16s,border-color .16s,transform .16s; }
button:active:enabled { transform:translateY(1px); }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible { outline:2px solid #dbd0a1; outline-offset:3px; }
.glass { border:1px solid var(--lab-line); background:linear-gradient(145deg,#1c3432f7,#112827f7); border-radius:14px; box-shadow:0 12px 40px #061d2438,inset 0 1px #deebd00b; }
.top { background:#102725f7; border-radius:12px; }
.brand-copy b,.identity b { font:650 14px system-ui,sans-serif; letter-spacing:.08em; }
.top .stats small,.eyebrow,.panel-title,.live-clock { font-family:var(--lab-mono); font-weight:400; letter-spacing:.075em; }
.top .controls button { background:#c3dab4; color:#20392e; border:1px solid #d5e5c7; border-radius:7px; box-shadow:none; }
.economy-link { border-radius:7px; border-color:var(--lab-line); }
.live-clock { color:#b6c9b8; font-size:9px; }
.live-clock i,.experiment-tag i { animation:signal-breathe 3s ease-in-out infinite; }
.experiment-tag { display:inline-flex; align-items:center; gap:9px; font-size:10px; }
.experiment-tag i { display:inline-block; width:6px; height:6px; background:#b6d6ad; border-radius:50%; box-shadow:0 0 0 4px #b6d6ad10; }
.intro { background:#091d22bd; backdrop-filter:blur(6px); }
.intro > .genesis-landing { border:1px solid #b7c6a638; border-radius:18px; background:linear-gradient(120deg,#1c3431,#102b2d); box-shadow:0 32px 120px #03192166; }
.genesis-copy { padding:52px 40px 40px; }
.intro .genesis-copy h1 { font-family:system-ui,sans-serif; font-size:clamp(40px,4.7vw,67px); font-weight:450; letter-spacing:-.065em; line-height:1.04; }
.genesis-copy em { font-style:normal; color:#d2ddb8; }
.intro .genesis-copy p { font-size:15px; line-height:1.75; color:#b9c9bd; max-width:390px; }
.landing-proof { border-top:1px solid var(--lab-line); padding-top:17px; }
.landing-proof span { background:transparent; border:0; padding:0 12px 0 0; color:#bdd0bd; font:10px/1.7 var(--lab-mono); }
#enter,.creator .awaken { background:#d3dcba; color:#233d31; border-radius:7px; box-shadow:none; border:1px solid #e7ead4; letter-spacing:.02em; }
#enter:hover,.creator .awaken:hover { background:#e5e9cd; box-shadow:0 0 24px #c6dba715; }
.genesis-art { background:radial-gradient(ellipse at 50% 48%,#4b797550,#163b40 60%,#132e33); }
.genesis-art::before { content:''; position:absolute; inset:0; background:linear-gradient(#c5d7bc04 1px,transparent 1px),linear-gradient(90deg,#c5d7bc04 1px,transparent 1px); background-size:40px 40px; pointer-events:none; }
.scene-caption { font-family:var(--lab-mono); color:#acc7b4; letter-spacing:.08em; }
.realm-switcher button { border-radius:5px; font:10px var(--lab-mono); background:#102e2a88; }
.realm-switcher button[aria-pressed=true] { background:#ccd7b5; color:#1b382b; }
.island-label { background:#112b2be8; border:1px solid var(--lab-line); border-radius:8px; }
.island-label b { font:450 18px system-ui; }
.island-label small { font-family:var(--lab-mono); }
.creator-card { border-radius:16px; }
.creator h1 { font-family:system-ui; font-weight:450; letter-spacing:-.055em; }
.creator .preview { background:radial-gradient(ellipse at 50% 44%,color-mix(in srgb,var(--realm-accent) 15%,transparent),#183532 65%,#112b2b); }
.creator input,.creator select { background:#102723; border:1px solid #b6c8a52f; border-radius:6px; }
.creator .seed-row button,.mindset { border-radius:6px; }
.creator .close { border-radius:50%; color:#d3decc; }
.creator-copy > p,.mindset-detail { color:#b4c6b7; }
#traits span { font:10px var(--lab-mono); border-radius:4px; }
.colony-panel { border-radius:13px; }
.colony-panel header,.leaderboard header { background:#19322f; border-radius:7px; }
.colony-identity #colony-name { font:450 23px/1.15 system-ui; letter-spacing:-.04em; }
.colony-identity > canvas { border-radius:10px; background:#b5d5a510; }
.colony-identity small { font-family:var(--lab-mono); font-size:9px; }
.colony-resources div { border-radius:6px; background:#afc8a709; border:1px solid #c3cda51d; }
.colony-resources b { font:450 23px var(--lab-mono); letter-spacing:-.06em; }
.colony-resources small { font:10px var(--lab-mono); }
.quest-card { background:linear-gradient(110deg,#dbe0c1,#cbd5b2); border:1px solid #e6e9d1; border-radius:8px; box-shadow:none; }
.quest-card h3 { font:550 17px/1.35 system-ui; letter-spacing:-.025em; }
.quest-card .eyebrow { font:9px var(--lab-mono); }
.quest-card p { font-size:11px; }
.quest-card small,.quest-heading > b { font:10px var(--lab-mono); }
.goal-track { height:5px; background:#9daa86; border-radius:6px; }
.goal-track i { background:#456c50; border-radius:6px; }
.quest-action { border-radius:7px; background:#cbd6ac; color:#203b2b; box-shadow:none; border-color:#dce3c3; font-weight:550; }
.quest-action:hover:enabled { background:#dee4c8; }
.priority-choices button { border-radius:6px; background:#102824; }
.priority-choices button[aria-pressed=true] { background:#55765b; border-color:#99b38a; }
.build-heading { font:500 16px system-ui; letter-spacing:-.025em; }
.colony-builds button { border-radius:8px; background:#c5d7ae0b; border-color:var(--lab-line); box-shadow:none; }
.colony-builds button:hover:enabled { background:#c5d7ae1a; border-color:#c5d7ae60; }
.colony-builds button[data-recommended=true] { background:#cbd6ac; color:#203b2b; }
.build-icon { height:44px; width:44px; }
.colony-builds button b { font-weight:550; }
.legacy-path summary,.colony-sub { font-family:var(--lab-mono); font-size:10px; }
.colony-thought { font-size:12px; border-left:1px solid #b3c79a55; }
.world-modes { border-radius:12px; background:#102826f2; }
.world-modes button { border-radius:7px; font-size:12px; }
.world-modes button[aria-pressed=true] { background:#cbd6ac; color:#203b2b; box-shadow:none; }
.leaderboard h2,.dashboard-dialog h2,.registration-dialog h2 { font:450 27px/1.2 system-ui; letter-spacing:-.045em; }
.leaderboard h2 { font-size:22px; }
.leaderboard { border-radius:13px; }
.period-tabs { border-radius:8px; border-color:var(--lab-line); background:#0b252555; }
.period-tabs button { border-radius:5px; font-family:var(--lab-mono); font-size:11px; }
.period-tabs button[aria-pressed=true] { background:#ccd6b7; color:#253d2d; }
.podium-place,.board-you { border-radius:8px; background:#b8caa10a; }
.board-row { border-radius:7px; min-height:52px; }
.board-row > span:first-child { font-family:var(--lab-mono); color:#b7c7ac; }
.board-you small,.board-rule,#board-reset { font-family:var(--lab-mono); line-height:1.65; }
.dashboard-dialog,.registration-dialog { background:#122b2a; border:1px solid #b5c99f40; border-radius:16px; box-shadow:0 30px 100px #02191baa; }
.dashboard-dialog::backdrop,.registration-dialog::backdrop { background:#061a20bb; backdrop-filter:blur(5px); }
.dashboard-dialog > header,.registration-dialog > header { background:#122b2af7; border-bottom:1px solid var(--lab-line); }
.dashboard-metrics { gap:8px; }
.dashboard-metrics > div { border:1px solid var(--lab-line); border-radius:8px; background:#b3cca008; }
.dashboard-metrics b { font:400 30px var(--lab-mono); letter-spacing:-.065em; color:#d4dfbf; }
.dashboard-metrics small { font:9px var(--lab-mono); color:#aabfa9; }
.dashboard-columns h3 { font-size:15px; font-weight:500; }
.experiment-status { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px; margin:18px 0; background:#b6ce9e08; border:1px solid var(--lab-line); border-radius:9px; }
.experiment-status > div:first-child { display:grid; gap:8px; }
.experiment-status b { font:11px var(--lab-mono); color:#c6d6b8; }
.experiment-status .eyebrow { font-size:9px; }
.experiment-progress { width:130px; height:4px; background:#b2c59a22; border-radius:4px; overflow:hidden; flex:none; }
.experiment-progress i { display:block; width:var(--epoch-progress,0%); height:100%; background:#b5d29e; transition:width 1s linear; }
.activity-item { position:relative; border-left:1px solid #a7c89340; border-bottom:0; padding:2px 0 17px 16px; margin:0 0 0 4px; }
.activity-item::before { content:''; position:absolute; width:5px; height:5px; background:#b7cb9b; border-radius:50%; left:-3px; top:5px; }
.activity-item small { font:9px var(--lab-mono); color:#b4cba4; }
.activity-item p { font-size:12px; line-height:1.6; }
.registration-dialog h3 { font:450 26px system-ui; letter-spacing:-.035em; }
.registration-dialog canvas { image-rendering:pixelated; }
#visit-registered { background:#cbd6ac; color:#203b2b; border-radius:7px; border-color:#dce4c5; }
.inspector { border-radius:14px; }
.inspector h2 { font:450 28px system-ui; letter-spacing:-.04em; }
.mind > span,.civ-readout { border-radius:7px; background:#adc6a308; }
.inspector blockquote { font-size:12px; color:#b4c7b5; border-color:#b6cba13b; }
.pantheon,.chronicle,.minimap,.zoom-tools { border-radius:10px; }
.roster-card,.roster-row { border-radius:7px; }
.bottom { background:#102725ef; border-radius:10px; }
.achievement-toast { border-radius:10px; background:#dce2c3; border:1px solid #e7ead5; box-shadow:0 16px 50px #092b2555; }
.achievement-toast b { font:500 21px system-ui; letter-spacing:-.035em; }
.achievement-toast small,.achievement-toast span { font-family:var(--lab-mono); }
/* The research page carries the same instruments and restrained realm lighting. */
.economy-page { background:#102626; color:#eeeade; }
.economy-page::before { background:radial-gradient(ellipse at 75% 8%,#709e6920,transparent 52%); }
.economy-page .nav { background:#102725f5; border-color:var(--lab-line); }
.economy-page .hero h1,.economy-page .section h2,.economy-page .cta h2 { font-family:system-ui; font-weight:450; letter-spacing:-.055em; }
.economy-page .hero h1 { font-size:clamp(44px,5.5vw,76px); line-height:1.06; }
.economy-page .eyebrow { font:10px var(--lab-mono); color:#b7cba8; }
.economy-page .hero-copy > p { font-size:15px; line-height:1.8; }
.economy-page .identity b { font-family:system-ui; }
.economy-page .node,.economy-page .panel,.economy-page .market-grid article,.economy-page .sim-grid,.economy-page .cta { background:#18322d; border:1px solid var(--lab-line); border-radius:12px; box-shadow:none; }
.economy-page .loop-grid article { border-color:var(--lab-line); }
.economy-page .loop-grid .icon { color:#c6d5ac; }
.economy-page .loop-grid h3 { font:500 23px/1.2 system-ui; letter-spacing:-.04em; }
.economy-page .principles span { font:9px var(--lab-mono); border-radius:5px; color:#c5d5ac; border-color:var(--lab-line); }
.economy-page .metrics b { font:450 15px var(--lab-mono); color:#d1dfb5; }
.economy-page .metrics small { font:9px var(--lab-mono); }
.economy-page input[type=range] { accent-color:#b7cea0; cursor:pointer; }
.economy-page .cta a { border-radius:7px; background:#d3dcba; color:#233d31; }
.economy-realm img { animation:realm-hover 7s ease-in-out infinite; }
.reveal-section { opacity:1; }
@media(prefers-reduced-motion:no-preference) { .reveal-section:not(.is-revealed) { opacity:0; transform:translateY(14px); } .reveal-section { transition:opacity .45s,transform .45s; } }
@keyframes signal-breathe { 50% { opacity:.45; } }
@keyframes realm-hover { 50% { transform:translateY(-7px); } }
@media(max-width:760px) {
 .genesis-copy { padding:25px 22px; }
 .intro .genesis-copy h1 { font-size:39px; }
 .experiment-tag { font-size:8px; }
 .colony-panel { border-radius:14px 14px 0 0; }
 .colony-identity #colony-name { font-size:20px; }
 .quest-card h3 { font-size:16px; }
 .experiment-status { gap:10px; padding:13px; }
 .experiment-progress { width:74px; }
 .experiment-status .eyebrow { font-size:8px; }
 .dashboard-dialog,.registration-dialog { border-radius:13px; }
 .dashboard-dialog h2 { font-size:26px; }
 .economy-page .hero h1 { font-size:43px; }
 .economy-page .nav { padding:0 12px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } .reveal-section { opacity:1; transform:none; } }
/* Keep instruments within their map lane. */
@media(min-width:761px) {
 .zoom-tools { right:344px; top:auto; bottom:100px; }
 .achievement-toast { top:auto; bottom:100px; left:50%; transform:translateX(-50%); max-width:330px; }
}
@media(min-width:761px) and (max-width:1499px) { .minimap { display:none; } }
#board-you { position:sticky; bottom:0; z-index:2; background:#1a3430; box-shadow:0 -10px 20px #142e2acc; }
.stats b,.colony-resources b,.dashboard-metrics b { font-variant-numeric:tabular-nums; }
html[data-hidden=true] .live-clock i,html[data-hidden=true] .experiment-tag i,html[data-hidden=true] .economy-realm img { animation-play-state:paused; }
@media(max-height:500px) and (min-width:761px) and (max-width:980px) { .zoom-tools { right:12px; top:84px; bottom:auto; } }
.creator label:has(#god-instructions) { display:block; }
.creator #god-instructions { width:100%; min-height:120px; padding:12px; background:#102723; border:1px solid #b6c8a52f; color:#eeeade; border-radius:6px; font:14px/1.6 system-ui; resize:vertical; }
.mind-config { margin:18px 0; padding:14px; border:1px solid var(--lab-line); border-radius:8px; }
.mind-config legend { color:#c6d5ac; font-size:12px; padding:0 6px; }
.runtime-boundary { font-size:11px !important; line-height:1.6 !important; color:#afc2ad; }
.mind-settings { border:1px solid var(--lab-line); border-radius:8px; padding:8px 12px; }
.mind-settings summary { display:flex; align-items:center; justify-content:space-between; gap:6px; min-height:44px; }
#mind-status { font:9px var(--lab-mono); color:#bdd4a7; }
.mind-settings textarea { width:100%; background:#102723; color:#eeeade; padding:10px; border:1px solid var(--lab-line); border-radius:6px; font:14px/1.6 system-ui; resize:vertical; }
#save-mind { min-height:44px; width:100%; margin-top:12px; background:#cbd6ac; color:#203b2b; border:0; border-radius:6px; }
#mind-receipt { overflow-wrap:anywhere; font:10px/1.6 var(--lab-mono); color:#b2c6aa; }
@media(max-width:760px) { .creator #god-instructions,.mind-settings textarea {font-size:16px;} }

/* Provider controls share the colony form rhythm on every screen. */
.provider-config{min-width:0;border:1px solid var(--line, #36504a);padding:1rem;margin:1rem 0;display:grid;gap:.8rem}
.provider-config[hidden]{display:none}.provider-config input{box-sizing:border-box;max-width:100%;width:100%}
.provider-consent{display:flex!important;align-items:flex-start;gap:.7rem;line-height:1.5}.provider-consent input{width:1.1rem;flex:0 0 1.1rem;margin-top:.2rem}