:root{--ink:#112b45;--navy:#236a77;--teal:#28bea7;--cream:#f9f7ed;--paper:#f9f7ed;--orange:#f46a68;--muted:#7795a4;--line:#173b51}
body{background:#143d4a;font-family:"Microsoft YaHei","PingFang SC",sans-serif}svg.pixel-icon{fill:none;stroke:none;image-rendering:pixelated;width:24px;height:24px;overflow:hidden}.phone-game{background:#256f7b;border:0;max-width:480px;box-shadow:0 0 70px #071c3290}.topbar{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:6px;padding:7px 7px 6px;background:linear-gradient(100deg,#22616d,#287580);min-height:78px}.brand{display:block;min-width:0}.brand h1{margin:0;width:100%;line-height:0}.brand h1>svg{display:block;width:100%;height:auto;aspect-ratio:507/86;stroke:none;image-rendering:pixelated}.season{font-size:10px;color:#bdd8df;white-space:nowrap;letter-spacing:.5px}.calendar-button{display:flex;gap:4px;align-items:center;background:#eef6ef;border:2px solid #163c50;box-shadow:2px 2px 0 #4a91a2;padding:4px 5px;min-height:32px;font-size:10px;font-weight:700;border-radius:0;white-space:nowrap}.calendar-button .sun{width:17px;height:17px;stroke:none;image-rendering:pixelated}.resources{grid-column:1/-1;display:grid;grid-template-columns:1.45fr 1.25fr 1fr 26px;gap:6px}.resource{height:28px;display:flex;gap:4px;padding:3px 6px;background:#f8f8ed;clip-path:polygon(2px 0,calc(100% - 2px) 0,calc(100% - 2px) 2px,100% 2px,100% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 100%,2px 100%,2px calc(100% - 2px),0 calc(100% - 2px),0 2px,2px 2px);white-space:nowrap}.resource>span{line-height:0;flex-shrink:0}.resource svg.pixel-icon{width:18px;height:18px}.resource label{font-size:10px}.resource strong{font-size:14px;font-weight:900;letter-spacing:.1px}.resource:nth-child(2) strong{font-size:13px}.resource:nth-child(3){justify-content:center}.settings-button{height:28px;width:26px;padding:5px;border:0;background:#f8f8ed}.settings-button svg{stroke:none;width:17px;height:17px}.statusbar{position:absolute;right:7px;top:100%;z-index:9;display:flex;gap:16px;background:var(--cream);border:2px solid var(--line);margin:0;padding:6px 10px;box-shadow:3px 4px 0 #0b374c66}.statusbar>span{color:var(--ink)}.statusbar .icon-button,.statusbar .speed{width:36px;height:40px;border-radius:0}.speed.selected{background:#277b87}.muted-slash{box-shadow:0 0 0 1.5px var(--cream)}
.play-area{display:flex;flex-direction:column;padding:0;overflow-y:auto;background:linear-gradient(100deg,#246b76,#277d89);scrollbar-width:none}.office-view{border:0;border-radius:0;box-shadow:none;aspect-ratio:941/654;flex-shrink:0;background:#c4a87f}.office-view canvas{image-rendering:pixelated}.scene-label{top:auto;bottom:6px;left:6px;border:1px solid #12364d;background:#f9f7ede8;border-radius:0;opacity:0;transition:opacity .15s;font-size:9px;pointer-events:none}.office-view:hover .scene-label,.paused .scene-label{opacity:1}.scene-label i{border-radius:0;background:#29be9e}.team-label{display:none}.worker-hotspot{border:0;border-radius:0;min-width:40px;min-height:44px;outline-offset:-2px}.worker-hotspot>span{opacity:0;transform:translateY(2px);font-size:9px;padding:3px 4px;border-radius:0;border:1px solid var(--line);box-shadow:2px 2px 0 #12334455}.worker-hotspot:hover>span,.worker-hotspot:focus-visible>span,.employee-labels .worker-hotspot>span{opacity:1}.worker-hotspot:active{background:#fff3bf26}.loading{background:#faf7ec;color:var(--ink)}.loader{border-radius:0;border-width:5px;animation:spin 1.3s steps(4,end) infinite}
.project-card{margin:8px 7px 0;padding:12px 10px 13px;border:0;border-radius:0;box-shadow:none;background:#f9f7ed;clip-path:polygon(5px 0,calc(100% - 5px) 0,calc(100% - 5px) 3px,100% 3px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px),0 3px,5px 3px);flex-shrink:0}.project-summary{display:grid;grid-template-columns:31% minmax(0,1fr);gap:13px;align-items:stretch}.project-cover{display:block;width:100%;height:auto;aspect-ratio:1;image-rendering:pixelated;align-self:start;background:#123149}.project-copy{min-width:0;display:flex;flex-direction:column;justify-content:space-between}.project-heading{gap:4px;align-items:center;min-width:0}.project-heading h2{font-size:23px;letter-spacing:.5px;font-weight:900;line-height:1.2;margin:0;flex:1;min-width:0;overflow-wrap:anywhere}.round-button{padding:1px;min-width:32px;width:32px;height:32px;flex-shrink:0;color:#8faab9;display:grid;place-items:center}.round-button svg{width:22px;height:22px;stroke:none}.genre-pills{margin:6px 0 4px;display:flex;align-items:center;gap:6px;font-size:11px;line-height:1.3;white-space:nowrap;color:#8498a7}.genre-pills span{background:#cec4e2;color:var(--ink);padding:3px 7px;font-weight:700}.genre-pills span:last-child{background:#b5d8f0}.project-description{font-size:11px;line-height:1.6;margin:4px 0 8px;color:#294965;min-height:33px}.progress-row{display:flex;align-items:center;gap:9px}.progress-track{margin:0;height:16px;border:2px solid #236071;border-radius:0;background:#cbd4d8;box-shadow:inset 1px 1px #9eafb7;flex:1;min-width:0}.progress-track>div{background:linear-gradient(#47d6c4 0 15%,#26bdaa 15% 85%,#22a994 85%);border:0;box-shadow:inset 2px 0 #67e8d1;transition:width .15s linear}.progress-row strong{font-size:18px;white-space:nowrap;font-weight:900}.progress-row b{font-size:19px}.project-state{display:flex;align-items:center;gap:7px;font-size:9px;color:#6e8794;margin:9px 0 0;min-height:17px}.project-state .eyebrow{color:#297889;letter-spacing:0;font-size:9px;background:#deece9;padding:2px 5px;flex-shrink:0}.project-state #progress-caption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.metric-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:9px 0 12px;position:relative}.metric-grid:after{content:'';position:absolute;left:67%;height:100%;border-left:2px dashed #b4c7cc;pointer-events:none}.metric-grid>.metric{border:0;border-radius:0;padding:7px 1px 6px;background:#ffa59d;text-align:center;min-height:54px;clip-path:polygon(3px 0,calc(100% - 3px) 0,calc(100% - 3px) 3px,100% 3px,100% calc(100% - 3px),calc(100% - 3px) calc(100% - 3px),calc(100% - 3px) 100%,3px 100%,3px calc(100% - 3px),0 calc(100% - 3px),0 3px,3px 3px)}.metric-grid>.metric:nth-child(2){background:#99c9f0}.metric-grid>.metric:nth-child(3){background:#8dceb8}.metric-grid>.metric:nth-child(4){background:#b5a2eb}.metric-grid>.metric:nth-child(5){background:#ffb0a0;margin-left:2px}.metric-grid>.metric:nth-child(6){background:#f8d58d}.metric-grid span{font-size:10px;gap:2px;display:flex;align-items:center;justify-content:center}.metric-grid i{line-height:0}.metric-grid svg.pixel-icon{width:16px;height:19px}.metric-grid strong{font-size:21px;line-height:1.05;margin-top:5px;font-weight:900}.metric-grid button{color:var(--ink);cursor:pointer}.metric-grid button:active{filter:brightness(.92)}
.action-row{gap:9px;align-items:stretch}.planning-action,.action-row>.primary-action{width:50%;min-height:62px;padding:8px 6px;border:2px solid #183a50;border-radius:0;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 3px 0 #8299a3,2px 3px 0 #8299a3;font-size:18px;background:#faf9ef;font-weight:900;clip-path:polygon(3px 0,calc(100% - 3px) 0,calc(100% - 3px) 2px,100% 2px,100% calc(100% - 3px),calc(100% - 3px) 100%,3px 100%,0 calc(100% - 3px),0 3px)}.action-row .primary-action{background:linear-gradient(#ff8c7e 0 8%,#f46968 8% 89%,#e75c61 89%);color:white;border-color:#542e40;box-shadow:0 3px 0 #8299a3}.planning-action>span:first-child,.action-row .primary-action>span:first-child{line-height:0;flex-shrink:0}.planning-action svg.pixel-icon{width:34px;height:38px}.action-row .primary-action svg.pixel-icon{width:23px;height:30px}.planning-action b,.action-row .primary-action b{display:block;line-height:1.3;white-space:nowrap;font-size:18px}.planning-action small,.action-row .primary-action small{display:block;margin-top:4px;font-size:9px;font-weight:400;color:#476a83;white-space:nowrap}.action-row .primary-action small{color:#fff5ee}.planning-action:active:not(:disabled),.action-row .primary-action:active:not(:disabled){transform:translateY(2px);filter:brightness(.96)}.action-row .primary-action:disabled{opacity:.72}.action-row .primary-action svg:not(.pixel-icon){height:28px;width:28px}.event-card{margin:9px 7px 0;width:calc(100% - 14px);border:0;border-radius:0;min-height:42px;padding:7px 9px;background:#edf4e9;box-shadow:none;flex-shrink:0}.event-card.pending{background:#ffdf9d;border:2px solid #ce8f3d}.event-icon{background:none;border-radius:0;width:24px;height:28px}.event-icon svg.pixel-icon{width:22px;height:25px}.event-card small{font-size:8px;color:#668190;letter-spacing:0}.event-card p{font-size:10px;margin:3px 0 0;line-height:1.5}.tiny-footer{color:#b5d4d8;font-size:8px;padding:7px 10px 7px;margin-top:auto;gap:10px;flex-shrink:0}.bottom-bar{background:linear-gradient(100deg,#21616e,#267e89);border-top:2px solid #153e55;box-shadow:inset 0 3px #87b6b540;padding:6px 8px calc(6px + env(safe-area-inset-bottom));flex-shrink:0}.navigation{gap:4px}.nav-button{min-height:66px;padding:5px 4px;font-size:14px;gap:5px;border-radius:0;color:#f1faf1;border:2px solid transparent;position:relative}.nav-button:after{content:'';position:absolute;right:-3px;top:10px;height:40px;border-right:1px dashed #4b95a2}.nav-button:last-child:after{display:none}.nav-button.active{background:linear-gradient(#2799a4,#25b3b4);border:2px solid #63d9d0;box-shadow:inset 2px 2px #a4eee270;color:white;clip-path:polygon(4px 0,calc(100% - 4px) 0,calc(100% - 4px) 3px,100% 3px,100% calc(100% - 3px),calc(100% - 3px) 100%,3px 100%,0 calc(100% - 3px),0 3px,4px 3px)}.nav-button>span:first-child{line-height:0}.nav-button svg.pixel-icon{width:26px;height:28px}.nav-button:nth-child(4) svg.pixel-icon{width:30px;height:23px}.nav-button i{border-radius:0;background:#f7766c;border:1px solid #feffd8;right:7px;top:3px;width:7px;height:7px}
dialog{border-radius:0;border:3px solid #173b51;border-bottom:0;background:#f9f7ed;box-shadow:0 -6px 0 #70b3bd66;max-height:89dvh}dialog::backdrop{background:#071c36a6;backdrop-filter:blur(1px)}.sheet-handle{border-radius:0;background:#97b3ba}.modal-header{background:#e6efeb;border-bottom:2px solid #9fbcc3}.modal-header h2{font-size:19px}.modal-header small{color:#418493}.modal-header .icon-button{border-radius:0}.modal-box,.staff-card,.history-item,.player-letter,.reward-note,.market-hint,.decision-choice,.focus-choice,.result-grid>div,.discovery-list>div,.budget-options label,.small-action,.form-row input,.form-row select{border-radius:0;border-color:#9cb7c0;border-width:2px}.primary-action,.secondary-action{border-radius:0;background:#f47a6d;box-shadow:0 3px 0 #718e9a;color:#fffaf4;border-width:2px}.primary-action small{color:#fdf0dc}.small-action{background:#c9e6dd;color:var(--ink);min-height:44px}.small-action.warm{background:#ffcc9c}.focus-choice.chosen{background:#b9e0d8;border-color:#348b98}.energy-bar,.energy-bar i{border-radius:0}.staff-portrait{stroke:none;image-rendering:pixelated;fill:none;width:84px;height:94px;background:none!important;border:2px solid #92b6bf;flex-shrink:0}.staff-top{gap:10px}.history-cover,.release-cover{width:62px;height:62px;image-rendering:pixelated;background:#214658;flex-shrink:0;border:2px solid #648e9c}.release-cover{width:82px;height:82px}.score,.history-item strong{color:#ce6b53}.form-row input:focus,.form-row select:focus{border-color:#277f91}.goal-item>span{border-radius:0}.toast{border-radius:0;border:2px solid #173b51;box-shadow:3px 4px 0 #06243d66;bottom:calc(86px + env(safe-area-inset-bottom))}.number-pop{animation:number-pop .35s steps(3,end)}@keyframes number-pop{0%{transform:translateY(-3px);filter:brightness(1.4)}100%{transform:none;filter:none}}
@media(max-width:360px){.topbar{padding:6px}.season{font-size:8px}.calendar-button{font-size:9px;padding:3px;min-height:30px}.calendar-button .sun{width:13px;height:13px}.resources{gap:4px;grid-template-columns:1.4fr 1.2fr .9fr 25px}.resource{padding:3px;gap:3px}.resource strong,.resource:nth-child(2) strong{font-size:12px}.resource label{font-size:9px}.resource svg.pixel-icon{width:15px;height:17px}.project-card{padding:10px 8px;margin:6px 6px 0}.project-summary{gap:9px;grid-template-columns:30% minmax(0,1fr)}.project-heading h2{font-size:20px}.project-description{font-size:10px;line-height:1.5;margin-bottom:6px}.genre-pills{font-size:10px;gap:4px}.genre-pills span{padding:2px 5px}.metric-grid{gap:4px}.metric-grid span{font-size:9px;gap:1px}.metric-grid strong{font-size:19px}.metric-grid svg.pixel-icon{width:13px;height:16px}.action-row{gap:6px}.planning-action b,.action-row .primary-action b{font-size:16px}.planning-action small,.action-row .primary-action small{font-size:8px}.planning-action svg.pixel-icon{width:27px;height:33px}.planning-action,.action-row>.primary-action{gap:5px;min-height:57px}.nav-button{min-height:60px;font-size:13px}}
@media(min-width:600px){.topbar{padding-top:10px}.office-view{aspect-ratio:941/654}.phone-game{border-left:1px solid #438b99;border-right:1px solid #438b99}}
@media(max-height:740px){.office-view{aspect-ratio:941/654}.topbar{padding-top:5px;min-height:72px}.project-card{padding:10px 9px}.metric-grid{margin-top:8px}.metric-grid>.metric{min-height:49px;padding-top:5px}.project-state{margin-top:6px}.event-card{min-height:38px}.nav-button{min-height:58px}.bottom-bar{padding-top:5px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}}
.settings-button,.calendar-button{position:relative}.settings-button{width:100%}.settings-button:after{content:'';position:absolute;inset:-8px -6px -8px -13px}.calendar-button:after{content:'';position:absolute;inset:-6px}.resource strong,.resource:nth-child(2) strong{font-size:17px}.resource label{font-size:11px}.progress-track>div{transition:width .15s steps(2,end)}.release-hero{position:relative}.release-hero:after{content:'✦';color:#ffd678;font-size:27px;position:absolute;right:5px;top:2px;text-shadow:-14px 31px 0 #51bba9,10px 55px 0 #f18b7d;animation:release-sparkle 1.2s steps(3,end) infinite}@keyframes release-sparkle{0%,100%{transform:translateY(0);opacity:1}50%{transform:translateY(-3px);opacity:.4}}
@media(max-width:360px){.resource strong,.resource:nth-child(2) strong{font-size:13px}.resource label{font-size:9px}}
.no-animation *,.no-animation *:before,.no-animation *:after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.progress-track>div{transition:none}}
