:root{--paper:#f5f3eb;--card:#fdfcf7;--ink:#283c32;--muted:#8b9287;--line:#e0e3d6;--green:#315e4d;--green-dark:#244a3b;--mint:#e6eddf;--coral:#c7775c;--yellow:#e8bc69;--font:"Microsoft YaHei UI","Microsoft YaHei","PingFang SC",sans-serif;--display:"STKaiti","KaiTi","Noto Serif SC",serif}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:13px;line-height:1.6}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button{border:0}button:focus-visible,canvas:focus-visible{outline:3px solid #d9a653;outline-offset:4px}button:disabled{cursor:not-allowed}button:not(:disabled){transition:background .18s,transform .18s,box-shadow .18s}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}.topbar{height:85px;max-width:1660px;margin:auto;padding:0 42px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;align-items:center;gap:11px;padding:0;background:transparent;text-align:left;line-height:1.2}.brand-globe{width:39px;height:39px;fill:none;stroke:var(--green);stroke-width:1.4}.brand>span{font-weight:700;font-size:19px;letter-spacing:2px}.brand b{font-size:13px;font-weight:500;letter-spacing:2px;margin-left:3px}.brand small{display:block;font-size:9px;font-weight:400;letter-spacing:3.8px;margin-top:7px;color:var(--muted)}.topbar-center{font-size:11px;letter-spacing:1px;color:#778477;display:flex;align-items:center;gap:8px}.live-dot{width:6px;height:6px;border-radius:50%;background:#7a9a6e;display:inline-block}.header-actions{display:flex;align-items:center;gap:18px}.save-state{font-size:10px;color:var(--muted)}.icon-button{width:29px;height:29px;border:1px solid #cdd3c4;border-radius:50%;background:transparent;font-family:Georgia,serif;font-size:17px}.icon-button:hover{background:var(--mint)}.start-screen{max-width:1440px;margin:auto;padding:34px 70px 0}.welcome-hero{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center}.eyebrow{font-size:9px;letter-spacing:2px;color:#83907f;font-family:var(--font);font-weight:500;display:flex;align-items:center;gap:10px}.eyebrow>span{width:24px;height:1px;background:var(--coral)}.welcome-copy{padding:20px 0}.welcome-copy h1{font-family:var(--display);font-size:68px;letter-spacing:4px;font-weight:600;line-height:1.22;margin:24px 0 21px}.living-word{position:relative;color:var(--green)}.living-word svg{position:absolute;left:-2%;bottom:-12px;width:100%;height:16px;fill:none;stroke:#cc9b64;stroke-width:3;stroke-linecap:round}.welcome-copy>p{font-size:12px;line-height:2.1;color:#7a8377;margin:26px 0}.welcome-note{display:flex;gap:12px;align-items:center;color:#92988c;font-size:11px;line-height:1.9}.welcome-note strong{font-weight:400;color:#556b58}.note-spark{font-size:35px;color:#bd795c;line-height:1}.preview-wrap{position:relative;border:1px solid #d8decd;border-radius:13px;padding:10px;background:#eef0e5;transform:rotate(1.2deg);box-shadow:0 15px 40px #405c3510}.preview-caption{display:flex;justify-content:space-between;font-size:9px;color:#7c8d73;padding:3px 3px 9px;letter-spacing:.4px}.preview-map{height:340px;overflow:hidden;border-radius:7px;border:1px solid #d0dac4;background:#cbdab5}.preview-stamp{position:absolute;bottom:14px;right:-16px;font-size:9px;letter-spacing:2px;transform:rotate(-7deg);border:1px solid #b6785f;background:#f4efe1;color:#ae7055;padding:8px 13px;box-shadow:3px 3px 0 #b6785f20}.section-heading{display:flex;align-items:end;justify-content:space-between;margin:32px 0 19px}.section-heading h2{font-size:19px;font-weight:500;letter-spacing:1px;margin:7px 0 0}.section-caption{font-size:11px;color:var(--muted)}.career-options{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.career-choice{position:relative;min-height:166px;text-align:left;padding:21px 22px;background:#faf9f3;border:1px solid var(--line);border-radius:9px;overflow:hidden}.career-choice:hover{background:#eeefe5;box-shadow:0 7px 18px #304a3910;transform:translateY(-3px)}.career-choice.selected{border:1.5px solid var(--green);background:#e9eee1}.career-choice.selected:after{content:'✓';position:absolute;right:15px;top:14px;color:var(--green);font-size:11px;border:1px solid #89a17d;border-radius:50%;height:18px;width:18px;text-align:center;line-height:16px}.career-top{display:flex;gap:13px;align-items:center;margin-bottom:12px}.career-svg{width:31px;height:31px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}.career-top h3{font-size:17px;font-weight:500;margin:0}.career-top small{font-size:9px;letter-spacing:.4px;color:#8d9686}.career-choice p{font-size:10px;line-height:1.9;color:#7a8577;margin:0 0 12px}.career-tags{display:flex;gap:7px;flex-wrap:wrap}.career-tags span{font-size:9px;padding:2px 7px;border-radius:3px;background:#e9ecdf;color:#74836d}.career-choice.selected .career-tags span{background:#dae4cf}.start-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:22px;gap:15px}.start-bottom>p{font-size:10px;color:var(--muted)}.start-buttons{display:flex;gap:12px}.button{display:flex;align-items:center;justify-content:space-between;gap:26px;padding:13px 21px;font-size:12px;border-radius:5px;min-width:190px;letter-spacing:.5px}.button>span{font-size:17px;font-weight:400}.primary{background:var(--green);color:#fffdf3;box-shadow:0 3px 0 #244a3b13}.primary:hover{background:var(--green-dark);box-shadow:0 5px 14px #26463220}.secondary{background:transparent;border:1px solid #cad1bf}.secondary:hover{background:#e7ecdd}.welcome-footer{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:#9ba191;border-top:1px solid var(--line);margin-top:27px;padding:14px 0 18px}.game-screen{display:grid;grid-template-columns:225px minmax(400px,1fr) 278px;max-width:1660px;margin:auto;gap:24px;padding:28px 34px 24px;align-items:start}.life-sidebar{display:flex;flex-direction:column;gap:16px}.wealth-card,.profession-card,.condition-card{border-bottom:1px solid var(--line);padding:2px 0 19px}.small-label{font-size:10px;color:#687a65;letter-spacing:.6px;display:flex;align-items:center;justify-content:space-between;gap:8px}.small-label>span{font-size:8px;color:#a2aa98;letter-spacing:.7px}.cash-value{font-family:Georgia,"Microsoft YaHei",serif;font-size:36px;letter-spacing:-1px;line-height:1.3;margin:15px 0 21px;font-variant-numeric:tabular-nums;white-space:nowrap}.goal-copy,.goal-bottom{display:flex;justify-content:space-between;font-size:9px;color:#829078}.goal-copy b{font-weight:500;color:#4c6c42}.progress-track{background:#e4e8da;height:5px;border-radius:6px;overflow:hidden;margin:8px 0}.progress-track>i{display:block;height:100%;border-radius:6px;background:#8da67c;width:0;transition:width .5s ease}.goal-track>i{background:#789665}.goal-bottom{font-size:8px;color:#9ca48f;gap:3px}.debt-row{font-size:10px;color:#b27755;margin-top:9px}.profession-heading{display:flex;gap:12px;align-items:center;margin:20px 0}.profession-heading h2{font-size:16px;line-height:1.3;font-weight:500;margin:0 0 5px}.profession-heading>div>span{color:#8a9780;font-size:10px}.profession-heading .career-svg{width:28px;color:#658561}.income-row{display:flex;justify-content:space-between;color:#89937e;font-size:10px;margin:8px 0}.income-row strong{color:#5e7257;font-weight:500;font-variant-numeric:tabular-nums}.skill-row{display:flex;justify-content:space-between;font-size:10px;color:#849479;margin-top:18px}.skill-row b{font-size:10px;font-weight:400;color:#647e5a}.skill-track>i{background:#bd9b60}.promotion-copy{font-size:9px;color:#a0a58f;line-height:1.9;margin:7px 0 0}.condition-card .small-label{margin-bottom:18px}.condition-row{display:grid;grid-template-columns:33px 1fr 29px;gap:11px;align-items:center;margin:13px 0;font-size:10px;color:#829079}.condition-row>b{font-size:10px;font-weight:400;text-align:right;color:#5c7451}.condition-row .progress-track{margin:0;height:4px}.sidebar-bottom{display:flex;flex-direction:column;gap:8px;margin-top:1px}.small-button{display:flex;align-items:center;justify-content:space-between;font-size:10px;background:transparent;text-align:left;padding:6px 0;color:#58704e}.small-button:hover{color:#b37956}.small-button.muted{color:#9ba38f}.city-column{min-width:0}.city-heading{display:flex;align-items:center;justify-content:space-between;margin:-2px 0 18px;min-height:64px}.city-heading h1{font-size:26px;font-family:var(--display);letter-spacing:2px;line-height:1;margin:12px 0 0}.city-heading h1>span{font-family:var(--font);font-weight:400;font-size:10px;letter-spacing:1px;margin-left:13px;color:#8b9781}.city-heading .eyebrow{font-size:7px;letter-spacing:1.6px}.calendar{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:10px;text-align:right}.calendar>span{font-size:9px;color:#89957e}.calendar>strong{font-family:Georgia,serif;font-size:32px;font-weight:400;line-height:1.1;grid-row:span 2;color:#607454}.calendar>strong>span{font-family:var(--font);font-size:9px;margin-left:3px}.calendar>small{font-size:8px;color:#a1a88f}.map-frame{border:1px solid #cfd9c0;border-radius:9px;background:#e5ebda;overflow:hidden;box-shadow:0 5px 18px #3b532509}.map-topline,.map-bottomline{display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#7a8d6b;padding:8px 12px;line-height:1.2}.map-topline{height:33px}.map-topline>span{display:flex;align-items:center;gap:6px}.map-topline button{font-size:19px;background:transparent;line-height:1;color:#789368;padding:0 2px}.world-stage{height:clamp(350px,calc(100vh - 297px),630px);min-height:350px;overflow:hidden;background:#cbdab5}.map-host canvas{display:block;width:100%;height:100%;outline:none;touch-action:none}.map-bottomline{height:43px;font-size:9px;gap:8px;border-top:1px solid #d6dec9;background:#eaf0df}.interact-button{font-size:9px;display:flex;align-items:center;gap:8px;background:#f7f7ed;border:1px solid #cbd7bc;border-radius:4px;padding:5px 8px;white-space:nowrap;color:#5c7850}.interact-button:hover{background:#fffdf3}.interact-button kbd{font-size:8px}kbd{font-family:var(--font);font-size:8px;display:inline-block;min-width:14px;text-align:center;padding:0 2px;border:1px solid #d8dfcc;border-bottom:2px solid #cdd5bf;border-radius:3px;background:#f8f8ef;color:#819373;line-height:15px}.location-nav{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}.location-nav button{border:1px solid #dce1d1;border-radius:4px;padding:5px 8px;color:#89977d;background:transparent;font-size:9px}.location-nav button:hover{background:#e8eddf}.location-nav button.active{background:#dfe8d5;color:#4f6e43;border-color:#c8d5b9}.city-footnote{display:flex;align-items:center;justify-content:space-between;font-size:8px;color:#a0aa93;gap:10px}.city-footnote>span:last-child{font-family:var(--display);font-size:11px}.footnote-separator{margin:0 7px}.journal-card{border-top:1px solid var(--line);margin-top:18px;padding-top:12px}.journal-heading{display:flex;justify-content:space-between;margin-bottom:10px}.journal-heading>span:last-child{font-size:8px;color:#a0aa94}.journal-line{display:flex;gap:11px;color:#8a9880;font-size:9px;line-height:1.8;margin:5px 0}.journal-line time{color:#a9b09e;white-space:nowrap;font-size:8px;line-height:2.1}.journal-line:first-child{color:#607957}.action-sidebar{display:flex;flex-direction:column;gap:19px}.month-plan{border:1px solid var(--line);border-radius:7px;padding:14px 16px 12px;background:#f8f8ef}.month-plan .small-label>span{font-size:10px;color:#6a805b}.action-slots{display:flex;gap:7px;margin:14px 0 9px}.action-slot{height:8px;border-radius:2px;background:#cedcbd;flex:1;transition:background .3s}.action-slot.used{background:#e4e7d9}.month-plan>p{font-size:9px;color:#9aa68b;margin:0}.location-panel{border:1px solid #d9dfce;background:#fcfbf5;border-radius:8px;padding:17px 16px 14px;min-height:330px}.location-label{display:flex;justify-content:space-between;color:#a1a890;letter-spacing:.4px;font-size:8px}.location-label>span:last-child{color:#8da37a}.location-title{display:flex;align-items:center;gap:9px;margin:13px 0 10px}.location-title h2{font-family:var(--display);font-size:24px;letter-spacing:1px;line-height:1.2;margin:0}.location-title svg{width:24px;height:24px;stroke:#819b6e;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.location-panel>p{font-size:10px;line-height:1.9;color:#8d9881;margin:0 0 15px}.npc-note{display:flex;gap:9px;align-items:flex-start;background:#eef1e5;border-radius:4px;padding:10px;margin-bottom:17px}.npc-avatar{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:29px;height:29px;border-radius:50%;color:#f8f7ec;background:#9ba789;font-family:var(--display);font-size:15px}.npc-note strong{font-size:9px;font-weight:500;color:#718064}.npc-note p{font-size:9px;line-height:1.8;color:#91a084;margin:3px 0 0}.available-actions{display:flex;flex-direction:column;gap:8px}.action-button{display:block;position:relative;padding:10px 11px 9px;background:#fafbf3;border:1px solid #e0e6d4;border-radius:5px;text-align:left;width:100%}.action-button:not(:disabled):hover{border-color:#98ae83;background:#f0f5e7;transform:translateX(2px)}.action-button:disabled{opacity:.48}.action-button .action-top{display:flex;align-items:center;justify-content:space-between;gap:5px;font-size:11px;color:#5b7550}.action-button .action-cost{display:flex;gap:3px;font-size:8px;white-space:nowrap;color:#93a382}.action-button p{font-size:8px;line-height:1.8;margin:5px 0 0;color:#9aa58e}.action-button .action-preview{color:#b29366;font-size:8px;margin-top:4px}.empty-actions{font-size:10px;color:#8d9a81;line-height:2}.month-end{margin-top:auto;padding-top:0}.month-preview{display:flex;flex-direction:column;margin:0 2px 12px;color:#7c8b70;gap:3px}.month-preview>span{font-family:var(--display);font-size:17px}.month-preview>small{font-size:8px;color:#a2aa93}.month-end .button{width:100%;font-size:11px;padding:13px 16px}.month-end>p{font-size:8px;color:#a5ac99;text-align:center;margin:8px 0 0}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,16px);max-width:min(90vw,600px);padding:12px 23px;border-radius:6px;background:#344f40;color:#fffdf0;box-shadow:0 7px 25px #203c3320;font-size:12px;line-height:1.8;z-index:100;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{width:min(92vw,520px);padding:0;border:1px solid #d1d9c3;border-radius:11px;background:var(--paper);color:var(--ink);box-shadow:0 30px 100px #223f3030;max-height:90vh}dialog::backdrop{background:#223c304d;backdrop-filter:blur(4px)}.dialog-inner{padding:30px}.dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}.dialog-eyebrow{font-size:9px;letter-spacing:2px;color:#8a9a7a}.dialog-close{font-size:22px;background:transparent;line-height:1;color:#8d9a80;padding:0 3px}.dialog-inner h2{font-family:var(--display);font-size:32px;letter-spacing:1px;font-weight:500;margin:0 0 15px}.dialog-inner>p{font-size:12px;color:#87947a;line-height:2;margin:0 0 18px}.dialog-inner>.button{width:100%;margin-top:20px}.report-amount{font-family:Georgia,serif;font-size:44px;color:#557748;margin:16px 0 20px;letter-spacing:-1px}.report-amount.negative{color:#b77859}.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-bottom:20px;border-bottom:1px solid var(--line)}.report-grid>div{font-size:10px;color:#98a18b}.report-grid strong{font-size:15px;font-weight:400;color:#5e7950;display:block;margin-top:4px}.report-details{list-style:none;padding:0;font-size:10px;color:#86947b;line-height:2.1}.report-details li:before{content:'·';margin-right:8px;color:#bb9b61}.event-box{padding-top:19px;border-top:1px solid var(--line);margin-top:18px}.event-box h3{font-family:var(--display);font-size:23px;margin:0 0 9px;font-weight:500}.event-box>p{font-size:11px;line-height:2;color:#849378;margin:0 0 15px}.event-option{display:block;width:100%;text-align:left;background:#edf1e4;border:1px solid #d5dfc9;border-radius:5px;padding:12px;margin:9px 0;color:#627b52;font-size:12px}.event-option small{display:block;font-size:10px;line-height:1.8;margin-top:4px;color:#96a185}.event-option:hover{background:#e1ead5}.help-list{font-size:11px;color:#829075;line-height:2.1;padding-left:18px}.help-list li{margin:10px 0}.win-mark{font-family:Georgia,serif;font-size:72px;color:#af9658;line-height:1.3}.save-notice{font-size:10px;color:#ac9a76}.game-screen:fullscreen{background:var(--paper);overflow:auto}.map-frame:fullscreen{display:flex;flex-direction:column;background:#d3dfbd}.map-frame:fullscreen .world-stage{flex:1;height:calc(100vh - 76px)}.map-frame:fullscreen .map-topline{min-height:33px}.map-frame:fullscreen .map-bottomline{min-height:43px}.career-choice,.welcome-copy,.preview-wrap{animation:arrive .55s both}.career-choice:nth-child(2){animation-delay:.08s}.career-choice:nth-child(3){animation-delay:.16s}@keyframes arrive{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}@media(min-width:1450px){.game-screen{grid-template-columns:235px minmax(500px,1fr) 292px;gap:30px;padding:30px 44px}.world-stage{height:clamp(430px,calc(100vh - 300px),690px)}.action-sidebar{gap:23px}.location-panel{padding:20px}.available-actions{gap:10px}.cash-value{font-size:40px}}@media(max-width:1150px){.game-screen{grid-template-columns:190px minmax(330px,1fr) 245px;gap:17px;padding:24px 22px}.topbar{padding:0 25px}.start-screen{padding:28px 40px 0}.welcome-hero{gap:25px}.welcome-copy h1{font-size:57px}.preview-map{height:310px}.career-choice{padding:17px}.cash-value{font-size:31px}.location-panel{padding:14px 12px}.location-title h2{font-size:22px}.city-footnote>span:last-child{display:none}.world-stage{height:clamp(350px,calc(100vh - 295px),540px)}.career-top h3{font-size:15px}}@media(max-width:940px){.topbar-center{display:none}.game-screen{grid-template-columns:185px minmax(320px,1fr);gap:22px;padding:24px}.action-sidebar{grid-column:1/-1;display:grid;grid-template-columns:185px 1fr;gap:22px}.month-plan{align-self:start}.location-panel{grid-column:2;grid-row:span 2}.month-end{grid-column:1;grid-row:2}.available-actions{display:grid;grid-template-columns:1fr 1fr}.world-stage{height:420px}.welcome-copy h1{font-size:49px}.welcome-hero{grid-template-columns:1fr 1.15fr;gap:19px}.preview-map{height:280px}.career-top{gap:9px}.career-top h3{font-size:14px}.career-top small{font-size:8px}.career-choice{padding:16px 12px}.welcome-copy>p{font-size:10px}.preview-caption>span:last-child{display:none}.start-screen{padding:22px 30px 0}.section-heading h2{font-size:17px}.career-choice p{font-size:9px}.start-bottom>p{font-size:9px}}@media(max-width:640px){.topbar{height:73px;padding:0 18px}.brand-globe{width:31px;height:31px}.brand>span{font-size:16px}.brand b{font-size:10px}.brand small{font-size:8px;letter-spacing:2px}.header-actions{gap:10px}.save-state{font-size:8px}.start-screen{padding:20px 20px 0}.welcome-hero{display:flex;flex-direction:column;gap:20px;align-items:stretch}.welcome-copy{padding:6px 0 0}.welcome-copy h1{font-size:48px;margin:18px 0 19px}.welcome-copy h1 br{display:none}.welcome-copy>p{font-size:11px;margin:20px 0 12px}.welcome-note{display:none}.eyebrow{font-size:7px;letter-spacing:1px}.preview-map{height:230px}.preview-wrap{transform:rotate(.7deg);padding:7px}.preview-caption{font-size:8px}.preview-stamp{font-size:7px;padding:6px 8px;right:-5px}.section-heading{margin-top:27px}.section-heading h2{font-size:16px}.section-caption{display:none}.career-options{grid-template-columns:1fr;gap:10px}.career-choice{min-height:unset;padding:15px 18px;display:grid;grid-template-columns:1fr 1.15fr;column-gap:16px;align-items:center}.career-top{margin:0;grid-row:span 2;gap:11px}.career-top h3{font-size:16px}.career-top small{font-size:9px}.career-choice p{font-size:9px;margin:0 0 7px;line-height:1.8;padding-right:5px}.career-tags{gap:4px}.career-tags span{font-size:8px;padding:1px 4px}.career-choice.selected:after{right:7px;top:7px;width:14px;height:14px;font-size:8px;line-height:12px}.start-bottom{flex-direction:column;align-items:stretch;margin-top:14px}.start-bottom>p{text-align:center;margin:5px 0}.start-buttons{flex-direction:column-reverse;gap:8px}.button{padding:13px 17px}.welcome-footer{font-size:7px;letter-spacing:0;gap:10px}.game-screen{display:flex;flex-direction:column;padding:18px 16px;gap:18px}.life-sidebar{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:16px}.wealth-card{padding-bottom:12px}.cash-value{font-size:29px;margin:10px 0 14px}.small-label{font-size:9px}.small-label>span{font-size:7px}.profession-card{padding-bottom:12px}.profession-heading{margin:11px 0;gap:8px}.profession-heading h2{font-size:14px}.profession-heading .career-svg{width:24px}.profession-heading>div>span{font-size:8px}.income-row{font-size:8px;margin:5px 0}.skill-row{font-size:8px;margin-top:9px}.skill-row b{font-size:8px}.promotion-copy{display:none}.condition-card{grid-column:1/-1;border:0;padding:0}.condition-card>.small-label{display:none}#condition-bars{display:flex;gap:15px;flex-wrap:wrap}.condition-row{flex:1;grid-template-columns:24px 1fr;gap:6px;margin:0;font-size:8px;min-width:65px}.condition-row>b{display:none}.condition-row .progress-track{height:3px}.sidebar-bottom{display:none}.city-column{width:100%}.city-heading{min-height:43px;margin-bottom:12px}.city-heading h1{font-size:23px;margin-top:8px}.city-heading .eyebrow{font-size:6px;letter-spacing:.8px}.calendar>strong{font-size:27px}.world-stage{height:330px;min-height:300px}.map-topline{height:28px;padding:5px 9px;font-size:8px}.map-bottomline{font-size:8px;padding:6px 9px;height:40px}.location-nav{gap:5px;margin:9px 0}.location-nav button{font-size:8px;padding:4px 6px}.city-footnote{font-size:7px}.city-footnote kbd{font-size:7px;min-width:12px;line-height:12px}.journal-card{margin-top:14px}.journal-line{font-size:9px}.journal-heading>span:last-child{font-size:7px}.action-sidebar{width:100%;display:flex;gap:14px}.month-plan{align-self:stretch;padding:12px 14px}.action-slots{margin:10px 0 7px}.location-panel{padding:17px;min-height:unset}.location-title h2{font-size:25px}.available-actions{grid-template-columns:1fr 1fr;gap:8px}.action-button{padding:10px}.action-button .action-top{font-size:10px}.action-button p{font-size:8px}.month-end .button{padding:15px}.month-preview{margin-bottom:10px;display:flex;flex-direction:row;align-items:center;justify-content:space-between}.month-preview>span{font-size:15px}.dialog-inner{padding:23px}.dialog-inner h2{font-size:28px}.report-amount{font-size:38px}.toast{font-size:11px;padding:11px 16px;bottom:15px;max-width:94vw;width:max-content}.interact-button{font-size:8px}.welcome-footer>span:last-child{text-align:right}.city-column .journal-card{display:block}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.archive-button{background:transparent;color:#6a805b;font-size:10px;padding:10px 8px;white-space:nowrap}.archive-button:hover{color:#b67e5a}.action-button p{font-size:9px;color:#7e8d73}.action-button .action-preview{font-size:9px;color:#a08351}.location-panel>p{font-size:11px;color:#7e8b73}.npc-note p{font-size:10px;color:#7c8c70}.promotion-copy{font-size:10px;color:#829173;line-height:1.8}.journal-line{font-size:10px;color:#7c8e71}.action-button:disabled{opacity:.55}.location-panel.is-distant #location-distance{color:#b18c5c}#end-month:disabled{opacity:.5}

/* Career details, local saves, and the city work panel. */
button,
summary {
  touch-action: manipulation;
}

summary:focus-visible {
  outline: 3px solid #d9a653;
  outline-offset: 3px;
}

.header-save-button,
.icon-button {
  min-width: 44px;
  min-height: 44px;
}

.header-save-button {
  padding: 8px 14px;
  border: 1px solid #cbd5c0;
  border-radius: 6px;
  background: #f9f9ef;
  color: #5f7952;
  font-size: 11px;
  white-space: nowrap;
}

.header-save-button:hover {
  background: #e7eddd;
  border-color: #9eaf90;
}

.save-alert {
  max-width: 1532px;
  margin: 12px auto 0;
  padding: 11px 17px;
  border: 1px solid #d7bf92;
  border-radius: 6px;
  background: #f6edd8;
  color: #80643f;
  font-size: 12px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

.life-sidebar > *,
.action-sidebar > *,
.profession-heading > div,
.income-row > *,
.gig-panel,
.location-panel {
  min-width: 0;
}

.income-row strong {
  text-align: right;
  overflow-wrap: anywhere;
}

.promotion-details {
  margin-top: 5px;
}

.promotion-details summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 44px;
  padding: 9px 0;
  color: #738264;
  cursor: pointer;
  font-size: 11px;
  line-height: 1.6;
  list-style: none;
}

.promotion-details summary::-webkit-details-marker {
  display: none;
}

.promotion-details summary::after {
  content: '+';
  flex: 0 0 auto;
  color: #9b9878;
  font-size: 17px;
  line-height: 1;
}

.promotion-details[open] summary::after {
  content: '−';
}

.promotion-details[open] .promotion-copy {
  display: block;
  margin: 0 0 9px;
  font-size: 11px;
  color: #77836b;
  line-height: 1.9;
}

#promotion-checklist {
  padding: 2px 0 8px;
}

.requirement-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  padding: 4px 0;
  color: #8b8972;
  font-size: 11px;
  line-height: 1.7;
}

.requirement-row > :first-child {
  min-width: 0;
  overflow-wrap: anywhere;
}

.requirement-row > :last-child:not(:first-child) {
  flex-shrink: 0;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.requirement-row > :only-child {
  flex: 1 1 100%;
  text-align: left;
}

.requirement-row.is-met {
  color: #66815a;
}

.work-proficiency {
  margin-top: 9px;
  padding-top: 10px;
  border-top: 1px dashed #dce1d1;
  color: #7d8a71;
  font-size: 11px;
}

.proficiency-row,
.proficiency-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.work-proficiency .progress-track {
  height: 4px;
  margin: 6px 0 10px;
}

.work-proficiency strong {
  font-size: 11px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

.gig-panel {
  padding: 14px 15px 15px;
  border: 1px solid #d4ddc7;
  border-radius: 8px;
  background: #f9f9ee;
}

.gig-panel > .small-label {
  gap: 5px;
  margin: -5px 0 3px;
  color: #758366;
}

.inline-button {
  flex-shrink: 0;
  min-height: 44px;
  padding: 7px 2px 7px 7px;
  background: transparent;
  color: #8e8d6d;
  font-size: 11px;
  letter-spacing: 0;
}

.inline-button:hover {
  color: #ae7b51;
}

.gig-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin: 0 0 12px;
}

.gig-tabs button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 0;
  min-height: 48px;
  padding: 7px 3px;
  border: 1px solid #dce2cf;
  border-radius: 5px;
  background: #f0f2e6;
  color: #7b8c6c;
  font-size: 11px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.gig-tabs button small {
  color: inherit;
  font-size: 10px;
}

.gig-tabs button:hover {
  border-color: #9eaf8b;
  background: #e7edda;
}

.gig-tabs button.selected {
  border-color: #749067;
  background: #e1ead6;
  color: #476b3f;
  box-shadow: inset 0 -2px 0 #829d70;
}

.gig-tabs button.locked {
  border-style: dashed;
  background: #f2eee2;
  color: #8b7b5d;
}

.gig-tabs button.preview:not(.selected),
.gig-tabs button.selected.locked {
  border-color: #b99b68;
  background: #f2e8d0;
  color: #91723d;
  box-shadow: inset 0 -2px 0 #c2a16a;
}

.gig-scene {
  overflow: hidden;
  border: 1px solid #dce0cb;
  border-radius: 5px;
  background: #e6ead9;
}

#gig-scene-image {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 86px;
  object-fit: cover;
  object-position: center;
}

.gig-panel h3 {
  margin: 12px 0 6px;
  color: #526e46;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}

.gig-panel > p,
.gig-status p,
.gig-status small {
  margin: 5px 0;
  color: #7a866c;
  font-size: 11px;
  line-height: 1.9;
  overflow-wrap: anywhere;
}

.gig-status {
  margin: 10px 0 12px;
  padding-top: 8px;
  border-top: 1px solid #e1e5d5;
}

.gig-status .requirement-row {
  padding: 3px 0;
}

.gig-settlement {
  margin-top: 8px;
  padding: 8px 10px;
  border-left: 2px solid #c9ae78;
  background: #f0eedf;
  color: #8a7957;
  font-size: 11px;
  line-height: 1.85;
  overflow-wrap: anywhere;
}

.gig-go-button,
.go-to-location {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #b8c9a6;
  border-radius: 5px;
  background: #e5edd9;
  color: #597746;
  font-size: 11px;
  line-height: 1.7;
}

.gig-go-button:hover,
.go-to-location:hover {
  border-color: #8ba573;
  background: #dce8cd;
}

.gig-go-button:disabled {
  border-color: #dedfcd;
  background: #eeeee2;
  color: #90947d;
}

.go-to-location {
  margin: 0 0 14px;
}

.location-panel > p,
.npc-note p,
.action-button p,
.action-button .action-preview,
.empty-actions,
.month-plan > p {
  font-size: 11px;
  line-height: 1.85;
}

.action-button p {
  color: #75836a;
}

.action-button .action-preview {
  color: #947b4d;
}

.action-button .action-cost {
  color: #839373;
  font-size: 10px;
}

.action-button:disabled {
  opacity: 1;
  background: #f2f2e9;
  border-color: #e1e3d4;
}

.action-button:disabled .action-top {
  color: #8b947e;
}

.action-button:disabled p,
.action-button:disabled .action-preview {
  color: #8a907e;
}

.button,
.event-option,
.archive-button,
.small-button,
.location-nav button,
.interact-button,
.dialog-close {
  min-height: 44px;
}

.dialog-close {
  min-width: 44px;
}

.map-bottomline {
  height: auto;
  min-height: 52px;
}

.map-topline {
  position: relative;
}

.map-topline button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  margin: -6px -9px -6px 0;
}

.month-end {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mobile-jump {
  display: none;
}

.ledger-button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 44px;
  padding: 9px 13px;
  border: 1px solid #d5deca;
  border-radius: 5px;
  background: #edf1e4;
  color: #6f835d;
  font-size: 11px;
}

.ledger-button:hover {
  background: #e2ead6;
}

.ledger-button:disabled {
  color: #a0a58f;
  background: #efefe6;
}

/* Month reports describe earned income separately from cash/debt transfers. */
.report-basis {
  padding: 10px 12px;
  border-left: 2px solid #b8c7a4;
  background: #edf0e4;
  color: #758467;
  font-size: 11px;
  line-height: 1.9;
}

.cash-flow-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0;
  padding: 14px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.cash-flow-grid > div {
  min-width: 0;
  color: #879278;
  font-size: 11px;
  line-height: 1.7;
}

.cash-flow-grid strong {
  display: block;
  margin-top: 4px;
  color: #627a51;
  font-size: 17px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.report-grid > div,
.report-details,
.event-option small,
.save-notice {
  font-size: 11px;
}

.report-grid strong,
.report-amount {
  overflow-wrap: anywhere;
}

.dialog-inner .button {
  min-width: 0;
}

.save-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0;
}

.save-actions > button {
  min-width: 0;
  min-height: 44px;
}

.save-note,
.archive-notice {
  color: #8b947f;
  font-size: 11px;
  line-height: 1.9;
  overflow-wrap: anywhere;
}

dialog a {
  color: #688153;
  text-decoration-color: #b9c6a7;
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
}

.source-links {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin: 16px 0;
}

.source-links a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-size: 11px;
  line-height: 1.7;
}

@media (min-width: 641px) and (max-width: 940px) {
  .action-sidebar {
    display: flex;
    flex-direction: column;
    grid-column: 1 / -1;
    gap: 18px;
    align-items: stretch;
  }

  .action-sidebar > section {
    grid-column: auto;
    grid-row: auto;
  }

  .month-plan {
    align-self: stretch;
  }

  .available-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gig-panel {
    padding: 15px 18px 18px;
  }

  .gig-panel > .small-label {
    justify-content: flex-start;
    gap: 18px;
  }

  #gig-scene-image {
    height: 110px;
  }
}

@media (max-width: 640px) {
  html {
    scroll-padding-top: 12px;
    scroll-padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px));
  }

  body:has(#game-screen:not([hidden])) {
    padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
  }

  .topbar {
    gap: 8px;
    padding: 0 15px;
  }

  .brand {
    min-height: 44px;
    flex-shrink: 0;
    gap: 8px;
  }

  .brand > span {
    letter-spacing: 1.3px;
  }

  .brand b {
    letter-spacing: 1.2px;
  }

  .brand small {
    letter-spacing: 1.6px;
  }

  .header-actions {
    min-width: 0;
    gap: 6px;
  }

  .header-save-button {
    min-width: 52px;
    padding: 8px 10px;
  }

  .save-state {
    display: block;
    flex: 0 0 7px;
    width: 7px;
    height: 7px;
    overflow: hidden;
    border-radius: 50%;
    background: #9cad86;
    color: transparent;
    font-size: 0;
  }

  .save-alert {
    margin: 10px 14px 0;
    padding: 10px 12px;
    font-size: 11px;
  }

  .life-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cash-value {
    font-size: 26px;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .profession-heading h2 {
    font-size: 13px;
    overflow-wrap: anywhere;
  }

  .income-row {
    gap: 6px;
    font-size: 10px;
  }

  .income-row > span {
    flex-shrink: 0;
  }

  .skill-row,
  .skill-row b {
    font-size: 10px;
  }

  .promotion-details[open] .promotion-copy {
    display: block;
    font-size: 11px;
  }

  .requirement-row {
    gap: 5px;
    font-size: 11px;
  }

  #promotion-checklist .requirement-row {
    flex-wrap: wrap;
  }

  .work-proficiency .requirement-row {
    flex-wrap: wrap;
    gap: 2px 6px;
  }

  .map-bottomline {
    min-height: 54px;
    padding: 5px 8px;
    gap: 6px;
  }

  #nearby-label {
    min-width: 0;
    font-size: 9px;
    line-height: 1.7;
  }

  .interact-button {
    flex-shrink: 0;
    font-size: 10px;
    padding: 8px 10px;
  }

  .location-nav {
    gap: 6px;
  }

  .location-nav button {
    flex: 1 0 auto;
    min-height: 44px;
    padding: 8px 10px;
    font-size: 10px;
  }

  .location-panel,
  .gig-panel {
    padding: 15px;
  }

  .gig-panel h3 {
    font-size: 17px;
  }

  #gig-scene-image {
    height: clamp(82px, 27vw, 110px);
  }

  .available-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }

  .action-button {
    min-width: 0;
    padding: 11px 10px;
  }

  .action-button .action-top {
    align-items: flex-start;
    font-size: 11px;
  }

  .action-button p,
  .action-button .action-preview {
    font-size: 11px;
    overflow-wrap: anywhere;
  }

  .city-column,
  .location-panel,
  .gig-panel {
    scroll-margin-top: 12px;
    scroll-margin-bottom: 90px;
  }

  /* Every month stays one tap away, even while browsing the top of the map. */
  .month-end {
    position: fixed;
    inset: auto 0 0;
    z-index: 40;
    display: grid;
    grid-template-columns: .7fr .7fr 1fr 1.6fr;
    align-items: stretch;
    gap: 6px;
    margin: 0;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid #d5ddc8;
    background: #f5f3ebf5;
    box-shadow: 0 -7px 24px #354d3010;
    backdrop-filter: blur(12px);
  }

  .month-end .month-preview,
  .month-end > p {
    display: none;
  }

  .mobile-jump,
  .month-end .ledger-button,
  .month-end .button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    width: 100%;
    min-height: 46px;
    margin: 0;
    padding: 10px 7px;
    border-radius: 5px;
    gap: 5px;
    font-size: 11px;
    line-height: 1.5;
    white-space: nowrap;
  }

  .mobile-jump {
    border: 1px solid #d5deca;
    background: #edf1e4;
    color: #6a8058;
  }

  .month-end .button > span {
    font-size: 16px;
  }

  .month-end .ledger-button {
    padding-inline: 4px;
  }

  .toast {
    bottom: calc(96px + env(safe-area-inset-bottom, 0px));
    max-width: calc(100vw - 28px);
    padding: 11px 15px;
    font-size: 11px;
    line-height: 1.8;
    overflow-wrap: anywhere;
  }

  dialog {
    width: calc(100vw - 24px);
    max-width: 520px;
    max-height: calc(100dvh - 28px);
  }

  .dialog-inner {
    padding: 21px;
  }

  .dialog-top {
    gap: 8px;
    margin: -7px -8px 9px 0;
  }

  .report-amount {
    font-size: clamp(26px, 7.5vw, 38px);
  }

  .cash-flow-grid {
    gap: 11px;
    padding: 12px 0;
  }

  .cash-flow-grid strong {
    font-size: 15px;
  }

  .save-actions {
    grid-template-columns: 1fr;
  }
}

/* Keep month settlement reachable as the work panel grows. */
.action-content {
  display: flex;
  flex-direction: column;
  gap: 19px;
  min-width: 0;
}

@media (min-width: 941px) {
  .action-sidebar {
    position: sticky;
    top: 20px;
    align-self: start;
    height: calc(100vh - 140px);
    height: calc(100dvh - 140px);
    max-height: calc(100dvh - 140px);
    min-height: 0;
    gap: 12px;
    overflow: hidden;
  }

  .action-content {
    flex: 1 1 auto;
    min-height: 0;
    gap: 16px;
    padding: 0 5px 3px 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-width: thin;
    scrollbar-color: #c2ceb3 transparent;
  }

  .action-content::-webkit-scrollbar {
    width: 7px;
  }

  .action-content::-webkit-scrollbar-thumb {
    border: 2px solid var(--paper);
    border-radius: 7px;
    background: #c2ceb3;
  }

  .action-sidebar > .month-end {
    position: static;
    flex: 0 0 auto;
    margin: 0;
    padding: 9px 0 0;
    border-top: 1px solid var(--line);
    background: var(--paper);
  }

  .month-end .month-preview {
    margin: 0 2px;
    gap: 1px;
  }

  .month-preview > span {
    font-size: 15px;
    line-height: 1.5;
  }

  .month-end > p {
    margin: 0;
    font-size: 9px;
    line-height: 1.5;
  }
}

@media (max-width: 940px) {
  html {
    scroll-padding-top: 12px;
    scroll-padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px));
  }

  body:has(#game-screen:not([hidden])) {
    padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
  }

  .action-sidebar {
    position: static;
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .action-content {
    flex: none;
    gap: 18px;
    overflow: visible;
  }

  .month-end {
    position: fixed;
    inset: auto 0 0;
    z-index: 40;
    display: grid;
    grid-template-columns: .7fr .7fr 1fr 1.6fr;
    align-items: stretch;
    gap: 6px;
    margin: 0;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid #d5ddc8;
    background: #f5f3ebf5;
    box-shadow: 0 -7px 24px #354d3010;
    backdrop-filter: blur(12px);
  }

  .month-end .month-preview,
  .month-end > p {
    display: none;
  }

  .mobile-jump,
  .month-end .ledger-button,
  .month-end .button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    min-height: 46px;
    margin: 0;
    padding: 10px 7px;
    border-radius: 5px;
    gap: 5px;
    font-size: 11px;
    line-height: 1.5;
    white-space: nowrap;
  }

  .mobile-jump {
    border: 1px solid #d5deca;
    background: #edf1e4;
    color: #6a8058;
  }

  .month-end .button > span {
    font-size: 16px;
  }

  .month-end .ledger-button {
    padding-inline: 4px;
  }

  .toast {
    bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }
}
