@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#080e21;--surface:#101a31;--line:rgba(161,188,238,.14);--muted:#8f9fbc;--text:#eef3ff;--gold:#f4cf8c;--blue:#9ac7ff;--font:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px var(--font);overflow:hidden}button,a,input,textarea{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;border:0}button:disabled{cursor:default;opacity:.5}button,a{ -webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,textarea:focus-visible,input:focus-visible{outline:2px solid #b8dbff;outline-offset:4px}button{transition:background .15s,border-color .15s,color .15s}svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.65;fill:none;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;flex-shrink:0}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.skip-link{position:fixed;left:20px;top:-70px;z-index:500;background:var(--surface);padding:15px;color:white}.skip-link:focus{top:15px}.app{height:100dvh;min-height:600px;display:grid;grid-template-rows:76px minmax(0,1fr) 94px 48px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid var(--line);z-index:30;background:rgba(8,14,33,.98);gap:20px}.brand{display:flex;align-items:center;gap:13px;color:white;text-decoration:none}.brand-mark{font-size:20px;letter-spacing:-3px;font-weight:800;position:relative;width:45px;height:45px;display:flex;align-items:center;justify-content:center;border-radius:14px;background:linear-gradient(135deg,#253e65,#0c172c);border:1px solid #536884;color:#bde5ff;box-shadow:0 0 22px #23395540}.brand-mark span{font-size:12px;position:absolute;right:5px;top:3px;color:var(--gold)}.brand-name{font-family:Manrope,var(--font);font-size:24px;letter-spacing:2px;font-weight:800;line-height:1.15}.brand-name small{display:block;font:8px var(--font);color:#8e9eba;letter-spacing:1.5px;margin-top:5px}.header-center{display:flex;align-items:center;gap:9px;color:#b1bdd3;font-size:12px;letter-spacing:.2px}.orbit-dot{width:6px;height:6px;border-radius:50%;background:#9fbce7;box-shadow:0 0 10px #68a3ff}.header-actions{display:flex;align-items:center;gap:22px}.demo-badge{display:flex;gap:7px;align-items:center;font-size:11px;color:#9eafc8}.demo-badge>span{width:5px;height:5px;border-radius:50%;background:#e0c188}.pending-button{display:flex;align-items:center;gap:9px;padding:9px 10px 9px 13px;border:1px solid #82714e60;background:#433b262d;border-radius:10px;color:#f1d4a4;font-size:12px}.pending-button:hover{background:#7d64372f}.pending-button b{background:#f4cf8c;color:#2d261a;font-size:11px;min-width:22px;line-height:22px;border-radius:6px}.world{position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 90%,#18357060,transparent 65%),#080f24;isolation:isolate}.world:before{content:'';position:absolute;inset:0;z-index:-1;opacity:.5;background-image:radial-gradient(#97acdb 1px,transparent 1px),radial-gradient(#6687c9 .7px,transparent .7px);background-position:0 0,23px 54px;background-size:113px 97px,181px 157px}.world-heading{position:absolute;top:25px;left:32px;z-index:10;pointer-events:none;text-shadow:0 2px 12px #070c21}.eyebrow{font-size:9px;letter-spacing:2px;color:#a2b3d0;font-weight:600}h1{font-family:Manrope,var(--font);font-size:24px;letter-spacing:-.8px;font-weight:500;margin:9px 0 6px}.world-heading p{font-size:12px;color:#8da0c2;margin:0}.world-meta{position:absolute;right:32px;top:28px;z-index:10;display:flex;align-items:center;gap:10px;font-size:12px;color:#d1dcef;line-height:1.6;text-align:right}.world-meta small{font-size:10px;color:#92a5c5}.sparkle{font-size:26px;color:#a2caff}.viewport{position:absolute;inset:20px 0 5px;overflow:hidden}.map{position:absolute;aspect-ratio:1672/941;width:min(100%,calc((100dvh - 243px) * 1.777));top:50%;left:50%;transform:translate(-50%,-50%);transform-origin:50% 50%;transition:transform 850ms cubic-bezier(.23,.8,.22,1),left 850ms,width 850ms;container-type:inline-size}.island{display:block;width:100%;pointer-events:none;user-select:none;mask-image:linear-gradient(to bottom,transparent 0%,#000 5%,#000 94%,transparent 100%);filter:saturate(.9) brightness(.94)}.map:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 35px 0 35px -26px #080f24,inset -35px 0 35px -26px #080f24;z-index:1}.building{position:absolute;transform:translate(-50%,-50%);background:transparent;border-radius:40%;z-index:2;border:1px solid transparent}.building:hover,.building:focus-visible{background:radial-gradient(ellipse,#b9e1ff12,transparent 70%);border-color:#a9d6ff30;box-shadow:0 0 30px #8dc6ff18}.building-name{pointer-events:none;position:absolute;top:2%;left:50%;transform:translate(-50%,-100%);white-space:nowrap;padding:7px 10px;border-radius:8px;background:#0a132ced;border:1px solid #a3c6fa60;font-size:10px;opacity:0;box-shadow:0 4px 14px #0004;transition:opacity .2s}.building:hover .building-name,.building:focus-visible .building-name{opacity:1}.robot{position:absolute;left:var(--x);top:var(--y);width:3.8%;height:8%;padding:0;transform:translate(-50%,-88%);background:transparent;z-index:4;isolation:isolate;border-radius:45%;animation-delay:var(--delay)}.robot:before{content:'';position:absolute;bottom:4%;left:5%;right:5%;height:14%;border-radius:50%;background:#18284968;filter:blur(2px);z-index:-1}.robot:after{content:'';position:absolute;bottom:1%;left:0;right:0;height:19%;border-radius:50%;border:1px solid var(--status);opacity:.6;box-shadow:0 0 6px #1e4b68}.robot-body{position:absolute;inset:0;transform-origin:50% 90%;animation:idle 4.7s ease-in-out infinite;animation-delay:var(--delay)}.robot img{width:145%;height:100%;max-width:none;margin-left:-22.5%;object-fit:contain;filter:drop-shadow(1px 3px 2px #071b3144)}.robot .accessory{position:absolute;bottom:22%;right:-3%;background:#17345b;border:1px solid #adbfda;box-shadow:1px 2px 2px #0006;border-radius:3px;color:#eed3a2;width:32%;height:29%;display:flex;align-items:center;justify-content:center;transform:rotate(-8deg)}.accessory svg{width:75%;height:75%;stroke-width:2}.robot .signal{position:absolute;top:0;right:0;min-width:28%;height:27%;display:flex;align-items:center;justify-content:center;background:var(--status);color:#10223a;border:1px solid #fff8;border-radius:50%;font-size:clamp(7px,1.05cqw,14px);line-height:1;font-weight:800;box-shadow:0 1px 4px #0008}.robot[data-state=working] .robot-body{animation:work 3.3s ease-in-out infinite;animation-delay:var(--delay)}.robot[data-state=waiting] .robot-body{animation:attention 3.6s ease-in-out infinite;animation-delay:var(--delay)}.robot[data-state=paused] .robot-body{animation:none;transform:rotate(-5deg) translateY(3px)}.robot[data-state=disabled] .robot-body{animation:none;filter:grayscale(.7) brightness(.7);transform:translateY(6px) scale(.88)}.robot[data-state=blocked] .robot-body{animation:none}.robot[data-state=stale] .robot-body{animation:uncertain 6s ease-in-out infinite}.robot[data-pending=true] .signal{background:#ffd185;color:#2d261a}.robot.selected:after{border:2px solid #d9eeff;box-shadow:0 0 15px #71baff;opacity:1}.robot.selected:before{background:#72baff80}.robot:hover,.robot:focus-visible{z-index:20!important}.robot:hover .robot-body,.robot:focus-visible .robot-body{filter:brightness(1.2)}.robot-tooltip{position:absolute;bottom:115%;left:50%;transform:translateX(-50%);background:#09162bf5;border:1px solid #819ab066;box-shadow:0 6px 20px #0006;color:white;border-radius:7px;padding:7px 9px;white-space:nowrap;font-size:10px;line-height:1.4;opacity:0;pointer-events:none;transition:opacity .15s}.robot-tooltip small{display:block;color:var(--status);font-size:9px;font-weight:400}.robot:hover .robot-tooltip,.robot:focus-visible .robot-tooltip{opacity:1}.robot.walker{animation:walk-route 18s ease-in-out infinite;animation-delay:var(--delay)}.robot[data-phase=travel]{animation:mission-route 3s ease-in-out both}.robot[data-phase=receive] .robot-body{animation:attention .55s ease-in-out 3}.robot[data-phase=celebrate] .robot-body,.robot.celebrating .robot-body{animation:celebrate .7s ease-in-out 3}.robot.celebrating:after{box-shadow:0 0 20px #ffd185;border-color:#ffd185}.robot[data-phase=travel] .accessory{background:#ce9b47}.robot[data-phase=work]:after{animation:glow 1.2s ease-in-out infinite}.map-controls{position:absolute;bottom:19px;right:26px;z-index:11;display:flex;align-items:center;padding:3px;border:1px solid var(--line);border-radius:10px;background:#10192de8;color:#aebed8;box-shadow:0 6px 20px #0002}.map-controls span#zoom-label{font-size:10px;min-width:42px;text-align:center}.icon-button{width:32px;height:32px;background:transparent;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;color:#aabbd7}.icon-button:hover{background:#ffffff0c;color:white}.separator{width:1px;height:17px;background:var(--line);margin:0 4px}.scene-tip{position:absolute;left:32px;bottom:24px;display:flex;align-items:center;gap:8px;color:#97aacb;font-size:10px;z-index:10}.scene-tip svg{width:14px;height:14px}.keycap{border:1px solid #59729760;border-radius:4px;padding:1px 4px;margin-left:2px}.back-map{position:absolute;left:32px;top:22px;z-index:11;background:#15233de8;border:1px solid #6685ad50;border-radius:8px;padding:9px 12px;font-size:11px;display:flex;align-items:center;gap:7px}.back-map:hover{background:#233a5d}.world.focused .world-heading{top:75px}.world.focused .world-meta{display:none}.world.focused .scene-tip{display:none}.area-roster{position:absolute;bottom:16px;left:26px;width:300px;max-height:44%;overflow:auto;z-index:13;padding:13px;background:#0c172ce8;border:1px solid #a3badb26;border-radius:14px;backdrop-filter:blur(20px);box-shadow:0 12px 40px #0003}.roster-heading{display:flex;align-items:center;justify-content:space-between;padding:0 4px 9px;color:#8fa6c9;font-size:10px;letter-spacing:.4px}.roster-list{display:grid;grid-template-columns:1fr 1fr;gap:5px}.roster-item{padding:9px 7px;text-align:left;background:#ffffff03;border:1px solid #ffffff06;border-radius:7px;font-size:10px;display:flex;align-items:center;gap:7px;line-height:1.35}.roster-item:hover{background:#ffffff0d}.roster-item.active{border-color:#9dc9ff77;background:#88bfff15}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--status);flex-shrink:0;box-shadow:0 0 6px color-mix(in srgb,var(--status) 30%,transparent)}.roster-item small{display:block;color:#8196b7;font-size:8px;margin-top:3px}.area-dock{display:flex;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#0b1226;z-index:25;padding:0 26px;gap:28px}.dock-label{font-size:9px;font-weight:600;letter-spacing:1.5px;color:#92a7c7;min-width:115px;line-height:1.8}.dock-label span{display:block;font-size:11px;color:#5f769a;letter-spacing:0;font-weight:400}.area-buttons{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;flex:1}.area-button{display:flex;align-items:center;gap:10px;border-radius:10px;padding:12px 10px;background:transparent;text-align:left;border:1px solid transparent;position:relative}.area-button:hover{background:#ffffff06;border-color:#ffffff0b}.area-button.active{background:#15233b;border-color:#4d658e5c}.area-button .area-icon{width:33px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--area);background:color-mix(in srgb,var(--area) 7%,transparent);border:1px solid color-mix(in srgb,var(--area) 12%,transparent);border-radius:9px;flex-shrink:0}.area-button .area-icon svg{width:19px;height:19px}.area-button strong{display:block;font-size:11px;font-weight:500;white-space:nowrap}.area-button small{display:block;font-size:9px;color:#6f87aa;margin-top:5px}.area-button .pending-dot{position:absolute;right:7px;top:7px;width:4px;height:4px;background:var(--gold);border-radius:50%}.statusbar{display:flex;align-items:center;justify-content:space-between;padding:0 30px;gap:16px;background:#080f21;z-index:25}.state-legend{display:flex;align-items:center;gap:19px}.state-count{display:flex;gap:6px;align-items:center;font-size:10px;color:#7f93b4;white-space:nowrap}.state-count b{font-size:11px;font-weight:500;color:#b7c7e0}.preferences{display:flex;gap:12px;align-items:center}.preferences button{display:flex;align-items:center;gap:6px;background:transparent;color:#7e91b2;padding:4px 0;font-size:10px}.preferences button:hover,.preferences button[aria-pressed=true]{color:#ccdef9}.preferences svg{width:14px;height:14px}.detail-panel{position:absolute;z-index:20;top:16px;right:20px;bottom:16px;width:360px;overflow-y:auto;border:1px solid #91a9d032;border-radius:18px;background:linear-gradient(155deg,#19263bea,#0c1528f5 55%);backdrop-filter:blur(28px);box-shadow:0 20px 80px #0007;padding:23px;scrollbar-width:thin;scrollbar-color:#425778 transparent;animation:panel-in .35s ease-out}.panel-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:9px;letter-spacing:1.4px;color:#93a8c8}.panel-top .icon-button{width:26px;height:26px}.character-intro{display:flex;align-items:center;gap:12px;margin:14px 0 18px}.portrait{width:69px;height:80px;position:relative;border-radius:16px;background:radial-gradient(ellipse at bottom,#5a96dd30,transparent 70%);flex-shrink:0;overflow:hidden}.portrait img{width:100%;height:100%;object-fit:contain;transform:scale(1.25)}.character-intro h2{font:600 21px/1.2 Manrope,var(--font);letter-spacing:-.6px;margin:0 0 9px}.status-chip{display:inline-flex;align-items:center;gap:6px;color:var(--status);font-size:10px;line-height:1.4}.objective{font-size:12px;line-height:1.65;color:#a9b8d0;margin:0 0 23px}.section-label{font-size:9px;letter-spacing:1.1px;color:#859dbf;margin-bottom:9px;display:flex;align-items:center;justify-content:space-between}.activity-block{border-top:1px solid var(--line);padding:18px 0}.activity-copy{font-size:13px;line-height:1.5;color:#d9e4f5;margin:0}.progress-track{height:4px;background:#263853;border-radius:4px;margin:12px 0 7px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#598ddd,#9bcfff);border-radius:4px;transition:width .8s}.progress-caption{font-size:9px;color:#7e95b9;display:flex;justify-content:space-between}.pending-card{padding:14px;border-radius:11px;border:1px solid #8f72463d;background:#a47d2410;margin:2px 0 18px}.pending-card .section-label{color:#e6be7e}.pending-card p{font-size:12px;color:#d8c7a8;line-height:1.5;margin:8px 0 12px}.btn{display:flex;align-items:center;justify-content:center;gap:7px;padding:11px 14px;border-radius:8px;font-size:12px;font-weight:500;width:100%;border:1px solid #97b6e32c;background:#172942;color:#c6dbf7}.btn:hover{background:#233d5c}.btn-gold{background:#edcb8b;color:#352b1c;border-color:#efcf9a}.btn-gold:hover{background:#ffdc9a}.btn-primary{background:#a4cdff;color:#102744;border-color:#bedbff}.btn-primary:hover{background:#b6d9ff}.btn-quiet{background:transparent;color:#9aaecf}.btn + .btn{margin-top:8px}.next-line{font-size:12px;line-height:1.5;color:#aebfd8;display:flex;align-items:flex-start;gap:8px}.next-line svg{width:14px;height:14px;margin-top:2px;color:#819abe}.delivery-preview{display:flex;align-items:center;gap:11px;padding:11px;background:#ffffff03;border:1px solid var(--line);border-radius:9px;margin-top:8px}.delivery-preview .mini-art{width:49px;height:49px;border-radius:5px;flex-shrink:0;background:linear-gradient(145deg,#4a7597,#13213b 70%);display:grid;place-items:center;overflow:hidden}.mini-art img{width:100%;height:100%;object-fit:cover}.delivery-preview strong{font-size:10px;color:#c0cfe6;line-height:1.5;font-weight:500;display:block}.delivery-preview small{font-size:9px;color:#6f88ac;display:block;margin-top:3px}.panel-actions{padding-top:12px;border-top:1px solid var(--line)}.panel-note{font-size:9px;color:#7189ad;line-height:1.6;text-align:center;margin:13px 0 0}.notice{font-size:11px;color:#d8bf95;line-height:1.5;background:#d4aa5720;padding:11px;border-radius:8px;margin-top:12px}.notice.blue{color:#a9caff;background:#6b9bdd16}.notice.red{color:#ffb5b8;background:#b8506414}.process-list{display:flex;gap:6px;flex-wrap:wrap;margin-top:13px}.process-list span{border:1px solid #8ca9d221;background:#8ba6cf06;color:#8fa8ce;font-size:8px;padding:4px 7px;border-radius:4px}.process-list span:first-child{color:#bddbff;border-color:#5c95d75c}.last-seen{margin-top:9px;font-size:10px;color:#a88e6a}.pending-list{display:flex;flex-direction:column;gap:9px;margin-top:20px}.pending-item{padding:13px;background:#fff04d04;border:1px solid #d8b47426;border-radius:10px;text-align:left;display:flex;gap:11px;align-items:center}.pending-item:hover{background:#d8b47412}.pending-item .pending-avatar{width:42px;height:46px;object-fit:contain}.pending-item strong{font-size:12px;display:block;font-weight:500}.pending-item small{display:block;font-size:10px;color:#9aaecb;margin-top:4px}.pending-item svg{width:15px;height:15px;margin-left:auto;color:#bea16e}.empty-state{text-align:center;padding:36px 0;color:#99b0d0;line-height:1.8}.empty-state svg{width:38px;height:38px;color:#83d2be;margin-bottom:10px}.modal-backdrop{position:fixed;inset:0;z-index:100;background:#030812bb;backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;padding:24px}.modal{width:560px;max-height:calc(100dvh - 48px);overflow:auto;background:linear-gradient(145deg,#1b2a42,#101b30);border:1px solid #a3bfdf33;border-radius:20px;box-shadow:0 35px 100px #0009;padding:27px;animation:panel-in .2s ease-out}.modal-header{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;margin-bottom:20px}.modal h2{font:600 22px Manrope,var(--font);letter-spacing:-.5px;margin:7px 0 0}.modal h3{font-size:14px;font-weight:500}.modal p{font-size:13px;color:#a9bcd6;line-height:1.65}.modal-actions{display:flex;gap:10px;margin-top:23px}.modal-actions .btn{margin:0}.modal .demo-note{font-size:10px;color:#7f96b9;text-align:center;margin:16px 0 0}.art-preview{height:235px;border-radius:12px;overflow:hidden;position:relative;background:#102441;margin-bottom:18px}.art-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.55) saturate(.7)}.art-preview:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#081527bf,transparent)}.art-text{position:absolute;z-index:1;inset:30px;display:flex;flex-direction:column;justify-content:space-between}.art-text small{font-size:9px;letter-spacing:2px;color:#cae3ff}.art-text strong{font:500 31px/1.15 Manrope,var(--font);letter-spacing:-1px;max-width:280px;color:#f5eee1}.art-text span{font-size:10px;color:#bcd4ef}.review-meta{display:grid;grid-template-columns:65px 1fr;gap:8px 16px;font-size:11px;line-height:1.6}.review-meta dt{color:#7d96b9}.review-meta dd{margin:0;color:#b8cbe6}.revision-field{display:block;font-size:12px;color:#c4d3e8;margin:18px 0 7px}.modal textarea{display:block;width:100%;min-height:100px;resize:vertical;background:#091427;border:1px solid #617ca550;border-radius:8px;color:#dce8fa;font:12px/1.6 var(--font);padding:12px}.cover-options{display:grid;grid-template-columns:1fr 1fr;gap:14px}.cover-option{cursor:pointer;position:relative}.cover-option input{position:absolute;top:12px;left:12px;z-index:2;accent-color:#eac47f}.cover-art{height:200px;display:flex;flex-direction:column;justify-content:space-between;padding:45px 18px 18px;border:2px solid transparent;border-radius:12px;background:radial-gradient(circle at 100% 0,#4c91b1,#173457 65%);font-family:Manrope,var(--font)}.cover-art.alt{background:radial-gradient(circle at 100% 0,#c8a76a,#403853 65%)}.cover-art strong{font-size:24px;line-height:1.1;letter-spacing:-1px}.cover-art small{font:9px var(--font);letter-spacing:1px}.cover-option input:checked+.cover-art{border-color:#e8c48a}.cover-option>span{display:block;font-size:11px;color:#a5b9d5;padding-top:8px}.example-document{padding:19px;border-radius:11px;background:#ecf1f7;color:#34425b;font-size:12px;line-height:1.7}.example-document h3{color:#10243c;margin:0 0 10px}.example-document p{color:#526078;font-size:12px}.example-document p:last-child{margin-bottom:0}.example-document .record{display:flex;justify-content:space-between;border-bottom:1px solid #d5deea;padding:10px 0}.example-document .record:last-child{border:0}.toast{position:fixed;z-index:200;left:50%;bottom:162px;transform:translateX(-50%);padding:13px 18px;background:#20364df7;border:1px solid #6d97ba77;border-radius:11px;box-shadow:0 10px 35px #0005;color:#d8ebff;font-size:12px;max-width:90vw;text-align:center;animation:toast-in .25s ease-out}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation:none!important;transition-duration:0s!important}.animations-paused .robot,.animations-paused .robot *,.animations-paused .robot:after{animation-play-state:paused!important}
@keyframes idle{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-1px) rotate(1deg)}}@keyframes work{0%,100%{transform:rotate(-2deg)}30%{transform:rotate(3deg) translateY(-1px)}60%{transform:rotate(-1deg) translateY(1px)}}@keyframes attention{0%,70%,100%{transform:rotate(0)}80%{transform:rotate(-6deg) translateY(-3px)}90%{transform:rotate(5deg)}}@keyframes uncertain{0%,70%,100%{transform:rotate(-5deg)}80%,90%{transform:rotate(7deg)}}@keyframes walk-route{0%,10%,90%,100%{transform:translate(-50%,-88%)}40%,60%{transform:translate(-10%,-105%)}}@keyframes mission-route{0%{transform:translate(-50%,-88%)}50%{transform:translate(15%,-103%)}100%{transform:translate(-50%,-88%)}}@keyframes celebrate{0%,100%{transform:translateY(0)}45%{transform:translateY(-7px) rotate(-8deg)}65%{transform:translateY(-4px) rotate(8deg)}}@keyframes glow{50%{box-shadow:0 0 16px var(--status)}}@keyframes panel-in{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}@keyframes toast-in{from{opacity:0;bottom:150px}to{opacity:1;bottom:162px}}
@media(min-width:1600px){.map{width:min(94%,calc((100dvh - 218px) * 1.777))}.world-heading{top:35px;left:40px}.area-dock{padding:0 38px}.area-button{padding:13px 18px}.detail-panel{width:390px}}
@media(max-width:1200px){.header-center{display:none}.dock-label{display:none}.area-dock{padding:0 14px;gap:0}.area-button{gap:7px;padding:10px 7px}.state-legend{gap:12px}.statusbar{padding:0 18px}.preferences button span:not([data-icon]){display:none}.detail-panel{width:330px;right:12px;padding:19px}.world-heading h1{font-size:21px}.world-meta{display:none}}
@media(max-width:900px){.app{grid-template-rows:65px minmax(0,1fr) 82px 62px}.topbar{padding:0 20px}.brand-mark{width:38px;height:38px}.brand-name{font-size:20px}.brand-name small{font-size:7px}.header-actions{gap:13px}.area-button{flex-direction:column;gap:5px;padding:8px 2px;text-align:center}.area-button .area-icon{width:30px;height:28px;background:transparent;border:none}.area-button strong{font-size:9px}.area-button small{display:none}.state-legend{flex-wrap:wrap;gap:7px 13px;max-width:620px}.state-count{font-size:9px}.preferences{gap:13px}.scene-tip{font-size:9px;left:20px}.map{width:min(115%,calc((100dvh - 234px) * 1.777))}.world-heading{left:22px}.detail-panel{width:320px}.area-roster{width:255px;left:15px}.roster-item{font-size:9px}.world.focused .world-heading{max-width:300px}.world.focused .world-heading h1{font-size:18px}.world.focused .world-heading p{font-size:10px;max-width:240px}.toast{bottom:160px}}
@media(max-width:650px){body{overflow:auto}.app{height:100dvh;min-height:640px;grid-template-rows:64px minmax(0,1fr) 93px 75px}.topbar{padding:0 15px;gap:8px}.brand{gap:9px}.brand-mark{width:35px;height:35px;border-radius:11px;font-size:17px}.brand-name{font-size:20px}.brand-name small{display:none}.header-actions{gap:9px}.demo-badge{font-size:8px;gap:4px}.pending-button{padding:7px;gap:5px}.pending-word{display:none}.pending-button svg{width:16px;height:16px}.pending-button b{min-width:19px;line-height:19px;font-size:10px}.world-heading{top:24px;left:21px}.world-heading h1{font-size:23px;max-width:260px;line-height:1.2}.world-heading p{font-size:11px;max-width:260px;line-height:1.5}.eyebrow{font-size:8px}.viewport{inset:65px 0 45px}.map{width:146%;max-width:none}.island{mask-image:linear-gradient(to bottom,transparent,#000 4%,#000 94%,transparent)}.scene-tip{left:0;right:0;justify-content:center;bottom:17px;font-size:9px;gap:6px}.scene-tip .keycap{display:none}.map-controls{right:12px;bottom:47px;border-radius:8px}.map-controls .icon-button{width:27px;height:27px}.map-controls #zoom-label{min-width:34px;font-size:9px}.area-dock{padding:0 8px;overflow-x:auto;scrollbar-width:none}.area-buttons{min-width:540px;gap:1px}.area-button strong{font-size:10px}.area-button{padding:12px 8px;gap:6px}.area-button .area-icon svg{width:21px;height:21px}.statusbar{padding:9px 13px;gap:8px;align-items:center}.state-legend{gap:7px 10px;max-width:300px}.state-count{font-size:8px;gap:4px}.state-count b{font-size:9px}.status-dot{width:5px;height:5px}.preferences{gap:9px;flex-wrap:wrap;justify-content:flex-end;max-width:66px}.preferences button{padding:2px}.preferences button:first-child{width:60px;justify-content:flex-end}.preferences svg{width:15px;height:15px}.world.focused .viewport{inset:20px 0 125px}.world.focused .world-heading{left:20px;top:67px}.world.focused .world-heading h1{font-size:19px;max-width:310px}.world.focused .world-heading p{display:none}.back-map{left:20px;top:20px}.area-roster{left:12px;right:12px;width:auto;bottom:12px;max-height:170px;padding:10px}.roster-list{grid-template-columns:repeat(2,1fr)}.roster-item{font-size:10px;padding:8px}.roster-item small{font-size:8px}.world.focused .map-controls{bottom:191px}.detail-panel{position:fixed;inset:76px 10px 10px;width:auto;max-height:calc(100dvh - 86px);z-index:50;padding:21px;border-radius:18px;background:linear-gradient(150deg,#1a2941f7,#0c1528fc)}.detail-panel .character-intro{margin-top:12px}.detail-panel .objective{margin-bottom:16px}.detail-panel .activity-block{padding:16px 0}.modal-backdrop{padding:12px}.modal{padding:22px;max-height:calc(100dvh - 24px);border-radius:16px}.modal h2{font-size:20px}.modal-actions{flex-direction:column-reverse}.art-preview{height:210px}.art-text{inset:24px}.art-text strong{font-size:28px}.toast{bottom:185px;font-size:11px;width:max-content;max-width:90vw}.cover-art{height:180px;padding:44px 14px 16px}.cover-art strong{font-size:21px}.robot-tooltip{font-size:7px;padding:4px}.robot-tooltip small{font-size:6px}}
@media(prefers-reduced-motion:reduce){.robot,.robot *,.robot:after{animation:none!important}.map,.detail-panel,.modal{transition:none;animation:none}}

/* A ficha móvel fica acima da navegação e mantém todas as ações acessíveis. */
@media(max-width:650px){
 .app.panel-open .world{z-index:50}
 .area-roster{max-height:190px}
 .world.focused .map-controls{bottom:211px}
}

/* VMX Hub: atalhos para o painel e para o primeiro sistema real. */
.hub-links{display:flex;gap:6px}.hub-links a{color:#b9cae4;text-decoration:none;font-size:11px;padding:8px 11px;border:1px solid #8fb1e026;border-radius:9px;background:#13203a80}.hub-links a:hover{background:#1d3155;color:white}.hub-links a.login{border-color:#a4cdff55;color:#cfe5ff}
.live-tag{display:inline-flex;align-items:center;gap:5px;font-size:9px;letter-spacing:.6px;color:#9fe3cf;border:1px solid #66d9c355;border-radius:5px;padding:3px 6px;margin-left:6px;vertical-align:middle}
.robot[data-live=true] .accessory{background:#1d4f6b;border-color:#9fe3cf}
.panel-link{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:8px;color:#bfe0ff;font-size:12px;text-decoration:none;padding:10px;border-radius:8px;border:1px solid #9dc9ff3a}.panel-link:hover{background:#ffffff08}
.art-preview.real img{filter:none}.art-preview.real:after{display:none}.art-preview.real{height:auto;aspect-ratio:4/5;max-height:52vh;background:#06101f}.art-preview.real img{object-fit:contain}
@media(max-width:1200px){.hub-links a{padding:7px 8px}}
@media(max-width:900px){.hub-links a:last-child{display:none}}
@media(max-width:650px){.hub-links{display:none}}
