:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;background:#08111c;color:#eaf4f8}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% -10%,#17364b 0,#0b1927 33%,#08111c 70%)}a{color:inherit}.shell{max-width:1560px;margin:auto;padding:0 28px 48px}.site-header{height:84px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #315066}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:17px;font-weight:850;letter-spacing:.16em;line-height:1.05}.brand small{display:block;margin-top:5px;color:#80b3bd;font-size:9px;letter-spacing:.24em}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border:1px solid #75d9d8;border-radius:10px;color:#b4f0e7;background:#153c48;box-shadow:0 0 22px #3acaca30;letter-spacing:0;font-size:15px}.status{display:flex;align-items:center;gap:9px;border:1px solid #3b6671;border-radius:999px;padding:8px 13px;background:#17303b;color:#c7f4e7;font-size:12px;font-weight:700}.status.waiting{border-color:#635b4a;background:#28251f;color:#dac9a7}.status-dot{width:8px;height:8px;border-radius:50%;background:#5de6a8;box-shadow:0 0 10px #5de6a8}.waiting .status-dot{background:#d4a766;box-shadow:none}.intro{max-width:850px;padding:50px 0 28px}.eyebrow{color:#70d3cf;letter-spacing:.22em;font-size:11px;font-weight:850}.intro h1{font-size:clamp(35px,4.5vw,70px);line-height:1.04;margin:14px 0 16px;letter-spacing:-.048em}.intro p{font-size:17px;line-height:1.65;color:#b8cbd4;margin:0}.experience{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(310px,.72fr);gap:16px;align-items:stretch}.world,.conversation{border:1px solid #345267;border-radius:16px;overflow:hidden;background:#0f2130;box-shadow:0 18px 50px #0005}.world{display:flex;flex-direction:column}.viewport{position:relative;min-height:520px;flex:1;overflow:hidden;touch-action:none;cursor:grab;background:radial-gradient(circle,#233a4c,#08111c 76%)}.viewport:active{cursor:grabbing}.map{position:absolute;width:1536px;height:1024px;transform-origin:0 0;background:url('/studio/assets/office.png') center/100% 100% no-repeat}.resident{position:absolute;width:120px;height:150px;transform:translate(-50%,-85%);display:flex;flex-direction:column;align-items:center;filter:drop-shadow(0 6px 5px #050b14a0);pointer-events:none}.resident img{width:96px;height:112px;object-fit:contain;image-rendering:pixelated}.resident strong{color:#f5fcff;font-size:18px;line-height:1;text-shadow:0 2px 4px #000}.resident small{margin-top:4px;color:#d9eaf3;font-size:12px;text-shadow:0 2px 4px #000}.speech-bubble{position:absolute;z-index:5;width:330px;max-width:330px;min-height:105px;padding:14px 15px;border:3px solid #57c9d1;border-radius:12px;background:#f4fcff;color:#173247;box-shadow:0 14px 30px #04101bb0;pointer-events:none}.speech-bubble[hidden]{display:none}.speech-bubble b{display:block;color:#236878;font-size:16px;margin-bottom:5px}.speech-bubble span{display:block;font-size:15px;line-height:1.35}.speech-bubble small{display:block;margin-top:5px;color:#5a7480;font-size:11px}.world-footer{display:flex;justify-content:space-between;gap:15px;padding:11px 15px;background:#102536;color:#96b5c5;font-size:10px;letter-spacing:.09em;font-weight:700}.conversation{display:flex;flex-direction:column;min-height:0}.conversation-heading{padding:24px 23px 15px;border-bottom:1px solid #315066}.conversation h2{font-size:25px;letter-spacing:-.03em;margin:9px 0 6px}.conversation-heading p{font-size:13px;line-height:1.45;color:#aac0cd;margin:0}.turns{height:520px;overflow-y:auto;padding:12px 18px;scrollbar-color:#496a7a transparent}.turn{padding:12px 5px;border-bottom:1px solid #294454}.turn-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:5px}.turn strong{color:#7dd3d9;font-size:13px}.turn[data-speaker="Mira"] strong{color:#d7a3ec}.turn[data-speaker="Hera"] strong{color:#efc280}.turn[data-speaker="Forge"] strong{color:#9eb9ed}.turn time{font-size:10px;color:#7898a9}.turn p{font-size:13px;line-height:1.5;color:#e1edf3;margin:0}.empty{padding:20px;color:#a9c1ca;font-size:13px}.conversation-footer{margin-top:auto;border-top:1px solid #315066;padding:16px 22px;color:#90adbd;font-size:12px;line-height:1.5}.conversation-footer strong{color:#d9eaf2}@media(max-width:950px){.experience{grid-template-columns:1fr}.viewport{min-height:420px}.turns{height:300px}}@media(max-width:600px){.shell{padding:0 12px 30px}.site-header{height:68px}.brand{font-size:12px}.brand-mark{width:34px;height:34px;font-size:12px}.status{font-size:10px;padding:7px 9px}.intro{padding:36px 4px 23px}.intro p{font-size:15px}.viewport{min-height:300px}.world-footer{font-size:8px}.conversation-heading{padding:19px}.turns{height:340px}}

.vision{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,.65fr);gap:32px;align-items:start;padding:64px 4px 48px;border-bottom:1px solid #284456}
.resident .resident-animation{width:112px;height:112px;image-rendering:pixelated;object-fit:contain}
.resident [hidden]{display:none}
.turn-head time{margin-left:auto}
.turn-emotion{font-size:10px;line-height:1;border:1px solid #547987;border-radius:999px;padding:3px 6px;color:#b9dfe5;background:#173444}
.vision h2,.building h2{font-size:clamp(28px,3.1vw,43px);line-height:1.12;letter-spacing:-.04em;margin:13px 0 20px}
.vision p,.building-heading p{color:#b8cbd4;font-size:16px;line-height:1.72;margin:0 0 15px;max-width:760px}
.vision p strong{color:#eaf4f8}
.vision-future{border:1px solid #3b6671;border-radius:16px;background:linear-gradient(145deg,#163b48,#0e2434);padding:25px 25px 19px;box-shadow:0 15px 35px #0003}
.vision-future p{font-size:18px;line-height:1.55;color:#e5f2f2;margin:15px 0 0}
.building{padding:48px 4px 64px}
.building-heading p{margin-bottom:25px}
.building-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.building-grid article{border:1px solid #29495b;border-radius:14px;background:#102432;padding:24px;min-height:210px}
.building-grid article span{color:#70d3cf;font-size:11px;font-weight:800;letter-spacing:.15em}
.building-grid h3{font-size:18px;line-height:1.2;margin:17px 0 10px}
.building-grid p{color:#a8bfca;font-size:14px;line-height:1.58;margin:0}
@media(max-width:950px){.vision{grid-template-columns:1fr;gap:16px}.building-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.vision{padding:45px 4px 37px}.vision-future{padding:22px}.building{padding:38px 4px 50px}.building-grid{grid-template-columns:1fr}.building-grid article{min-height:0}.vision p,.building-heading p{font-size:15px}}