@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--gold:#d6b472;--muted:#9fa9a6;--line:#ffffff20}*{box-sizing:border-box}body{margin:0;background:#132c33;color:#f0eee5;font-family:'DM Sans',sans-serif;font-size:14px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}#world,.vignette{position:fixed;inset:0}.vignette{pointer-events:none;background:linear-gradient(90deg,#081619e8,transparent 58%),linear-gradient(0deg,#07171cc9,transparent 35%)}canvas{display:block}#ironfjord-stage header{height:94px;position:relative;margin:0 45px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{color:var(--gold);font-size:38px;display:flex;gap:12px;text-decoration:none;align-items:center}.brand span{font-size:17px;letter-spacing:3px;font-weight:700}.brand small{display:block;font-size:8px;color:#aab8b7;letter-spacing:2px;margin-top:5px}nav{display:flex;height:100%;gap:32px}nav button{background:none;border:0;border-bottom:2px solid transparent;color:#b1bdbb;padding:0 8px}nav button.active{color:var(--gold);border-color:var(--gold)}.year{font-size:10px;letter-spacing:1px;color:#a9b5b0}.year b{display:block;text-align:right;margin-top:5px;color:#eee;font-size:15px}.left{position:absolute;left:55px;top:145px;width:330px}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--gold)}h1{font:600 56px 'Cinzel',Georgia,serif;letter-spacing:4px;margin:16px 0}h1 span{display:block;font-size:22px;letter-spacing:2px;font-weight:400;margin-top:4px}.intro{line-height:1.9;color:#aab8b4;font-size:13px}#identity{border-top:1px solid var(--line);margin-top:30px;padding-top:21px}#identity h3{font:400 22px 'Cinzel',serif;margin:0 0 7px}#identity p{color:var(--gold);font-size:11px;letter-spacing:1px}#actions{display:grid;gap:9px;margin-top:22px}.action{background:#172e30d9;border:1px solid #ffffff25;text-align:left;padding:13px 16px;display:flex;justify-content:space-between;align-items:center}.action:hover{border-color:var(--gold);background:#264341}.action small{color:var(--gold);font-size:10px}.action:disabled{opacity:.45;cursor:not-allowed}#resources{position:absolute;right:45px;top:119px;display:flex;gap:26px;background:#0c2025aa;padding:16px 24px;border:1px solid var(--line);backdrop-filter:blur(12px)}.resource small{display:block;font-size:9px;letter-spacing:1px;color:#b0bbb4;margin-bottom:5px}.resource b{font:500 22px 'Cinzel',serif;color:#ecdec2}#panel{position:absolute;right:45px;bottom:85px;width:300px;background:#10252be8;border:1px solid var(--line);padding:23px;backdrop-filter:blur(15px)}#panel h2{font:400 23px 'Cinzel',serif;margin:9px 0 15px}#panel p{color:#b2beb8;line-height:1.7;font-size:12px}.primary{width:100%;padding:13px;background:var(--gold);color:#18252a;border:0;font-weight:700;margin-top:12px}.primary:hover{background:#edcc8e}.target{width:100%;text-align:left;border:1px solid var(--line);background:#193238;padding:12px;margin-top:8px}.target.selected{border-color:var(--gold)}.target small{display:block;color:#a7b2ad;margin-top:5px}.stat{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line);font-size:12px}.stat span{color:#a6b5b0}footer{position:absolute;bottom:0;left:45px;right:45px;height:60px;display:flex;align-items:center;gap:24px;border-top:1px solid var(--line);font-size:10px;letter-spacing:1px;color:#9eafad}footer>span:first-child{margin-right:auto;color:#d6cbaa}footer button{background:none;border:0;font-size:10px;color:#a8b5ad}i{display:inline-block;width:5px;height:5px;background:var(--gold);border-radius:50%;margin-right:8px}#toast{position:absolute;bottom:83px;left:50%;transform:translateX(-50%);max-width:420px;background:#d8bb80;color:#17292e;padding:15px 24px;opacity:0;transition:opacity .3s;pointer-events:none}.overlay{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:#07181ce8;backdrop-filter:blur(9px)}.chooser{max-width:1000px;text-align:center;padding:30px}.chooser h2{font:400 45px 'Cinzel',serif;margin:20px}.chooser>p{color:#abb8b1}.countries{display:flex;gap:18px;margin:35px 0}.countries button{width:275px;padding:24px 20px;background:linear-gradient(150deg,#284044,#11272c);border:1px solid #d4b37444;transition:.2s}.countries button:hover{transform:translateY(-6px);border-color:var(--gold);background:#2f4748}.countries b{font-size:40px;color:var(--gold)}.countries h3{font:25px 'Cinzel',serif;margin:13px}.countries span{font-size:8px;letter-spacing:1.5px;color:var(--gold)}.countries p{font-size:12px;color:#aebbb4;line-height:1.7}.countries em{font-style:normal;font-size:10px;color:#e6cc99}.chooser>small{color:#8b9d97;font-size:10px}.hidden{display:none!important}@media(max-width:900px){#ironfjord-stage header{margin:0 20px}.year{display:none}nav{gap:10px}.left{left:24px;top:115px;width:250px}h1{font-size:38px}.intro{display:none}#resources{right:20px;gap:13px;padding:12px;top:110px}.resource b{font-size:16px}#panel{right:20px;width:245px;bottom:75px}.countries{gap:8px}.countries button{width:30%;flex:1;padding:14px 8px}.chooser h2{font-size:30px}footer{left:20px;right:20px}footer>span:nth-child(2){display:none}}@media(max-width:600px){#ironfjord-stage header{height:75px}.brand span{font-size:12px}nav{gap:0}nav button{font-size:11px}.left{top:160px;width:190px}h1{font-size:29px}h1 span{font-size:15px}.eyebrow{font-size:8px}#identity{margin-top:12px;padding-top:12px}#identity h3{font-size:16px}#actions{gap:5px}.action{padding:9px;font-size:11px;display:block}.action small{display:block;margin-top:4px}#resources{left:20px;right:20px;top:90px;justify-content:space-between}#panel{width:155px;padding:12px;right:15px;bottom:80px}#panel h2{font-size:17px}.chooser{padding:15px}.countries{flex-direction:column;margin:20px 0}.countries button{width:100%;text-align:left;padding:12px 20px}.countries b{float:left;margin-right:20px}.countries h3{margin:0;font-size:20px}.countries p{margin:5px 0}.chooser h2{font-size:25px}.chooser>p{font-size:12px}}
#menu-toggle{background:#12292bcc;border:1px solid #c9b27866;color:var(--gold);font-size:23px;width:42px;height:42px;flex-shrink:0;margin-right:18px;border-radius:3px}#menu-toggle:hover{background:#324b48}.choice-warning{color:#ebcd92!important;border:1px solid #c8a46766;background:#b18c3612;padding:12px 20px;font-size:13px}#game-menu{color:#f0eee5;background:#10262b;border:1px solid #bda16d88;border-radius:5px;width:min(430px,calc(100vw - 30px));max-height:90dvh;overflow:auto;padding:30px;box-shadow:0 24px 90px #0009}#game-menu::backdrop{background:#06171bcc;backdrop-filter:blur(7px)}#game-menu h2{font:400 25px 'Cinzel',serif;margin:16px 0}#game-menu small{display:block;margin-top:20px;color:#a9b8b1;font-size:11px;text-align:center}.sound-settings{margin:22px 0;border-block:1px solid var(--line);padding:20px 0}.sound-settings label{display:flex;align-items:center;justify-content:space-between;font-size:13px;gap:12px}.sound-settings output{color:var(--gold)}.sound-settings input[type=range]{width:100%;accent-color:var(--gold);margin:13px 0 18px}.music-switch{margin:0 0 20px}.music-switch input{width:19px;height:19px;accent-color:var(--gold)}.sound-settings p,.restart-note,#restart-warning p{font-size:12px;line-height:1.6;color:#b7c1b9}.danger{background:#6e322c;color:#ffe8da;border:1px solid #b66f59;width:100%;padding:12px;cursor:pointer}.danger:hover{background:#91473b}#restart-warning{margin-top:20px;padding:16px;border:1px solid #c08257;background:#301f20}#restart-warning h3{margin:0;color:#ecc691;font:19px 'Cinzel',serif}#restart-confirm{margin-top:10px}button:focus-visible,input:focus-visible{outline:2px solid #f1d093;outline-offset:4px}@media(max-width:600px){#menu-toggle{width:32px;height:34px;margin-right:8px;font-size:20px}#ironfjord-stage header{margin:0 12px}.brand{gap:5px;font-size:26px}.brand small{font-size:6px;letter-spacing:1px}nav button{padding:0 5px;font-size:10px}#game-menu{padding:23px}}
.worker-job{padding:13px 0;border-bottom:1px solid var(--line)}.worker-job b{font-size:13px}.worker-job small{display:block;color:#adbab0;font-size:10px;line-height:1.6;margin-top:3px}.worker-buttons{display:flex;align-items:center;gap:13px;margin-top:10px}.worker-buttons button{width:34px;height:29px;border:1px solid #c3a66c77;background:#2d4543;color:#e4c88d;font-size:20px}.worker-buttons button:disabled{opacity:.3;cursor:not-allowed}.worker-buttons strong{font:18px 'Cinzel',serif;min-width:20px;text-align:center}#panel{max-height:calc(100dvh - 280px);overflow:auto;scrollbar-width:thin;scrollbar-color:#9c895b #172d30}@media(max-width:600px){#panel{max-height:calc(100dvh - 245px)}.worker-job{padding:9px 0}.worker-buttons{gap:6px}.worker-buttons button{width:28px}}
#station-labels{position:fixed;inset:0;pointer-events:none;overflow:hidden}.world-label{position:absolute;transform:translate(-50%,-100%);pointer-events:auto;background:#10272be8;border:1px solid #d1b37377;color:#e7cca0;border-radius:3px;font-size:10px;white-space:nowrap;padding:6px 9px}#travel-hint{position:absolute;top:190px;left:50%;transform:translateX(-50%);color:#f0dcaf;font-size:12px;background:#12272bd9;padding:9px 15px;border:1px solid #d1b37344;border-radius:3px}#interact-prompt{position:absolute;bottom:90px;left:50%;transform:translateX(-50%);padding:13px 25px;background:#dcc18c;color:#182c30;border:1px solid #f1d5a1;font-weight:700;z-index:3}#tutorial{position:absolute;left:50%;bottom:155px;transform:translateX(-50%);width:320px;padding:18px;background:#0d252bea;border:1px solid #c7a66c88;pointer-events:none}#tutorial h3{font:18px 'Cinzel',serif;margin:8px 0}#tutorial p{font-size:12px;line-height:1.6;color:#c2cbc0;margin:6px 0}#tutorial button{pointer-events:auto;border:0;background:none;color:#d0b67e;font-size:10px;padding:5px 0}#character-menu{margin-left:35px;max-height:85dvh;overflow:auto;top:85px;width:340px;color:#e9e8df;background:#132c30;border:1px solid #c8a66c;padding:25px;border-radius:4px;box-shadow:0 20px 100px #0008}#character-menu::backdrop{background:#08181a50}#character-menu h2{font:26px 'Cinzel',serif;margin:14px 0}#character-menu p,#character-menu small{font-size:11px;line-height:1.6;color:#b2c0b8}#character-menu small{display:block;margin-top:12px}#character-menu label{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;margin:13px 0}#character-menu input,#character-menu select{background:#223d3f;border:1px solid #65756b;color:#e9e9d9;padding:8px;width:160px;min-width:0;border-radius:2px;font:12px 'DM Sans',sans-serif}#walk-controls{position:absolute;bottom:80px;left:25px;display:none;text-align:center;z-index:4;touch-action:none}#walk-controls button{width:38px;height:38px;margin:3px;background:#152e32dd;border:1px solid #b49a68;color:#e5c991;font-size:19px;touch-action:none}#walk-controls>button:last-child{background:#ad935d;color:#14292b}@media(max-width:1100px){.left{width:230px;top:130px}h1{font-size:36px}.intro{display:none}#identity{margin-top:15px}#tutorial{width:265px;bottom:145px;left:49%}#travel-hint{top:190px;font-size:10px}}@media(pointer:coarse){#walk-controls{display:block}}@media(max-width:700px){.left{top:160px;width:145px;left:15px}.left .eyebrow,.left h1,.left #identity{display:none}#actions{margin-top:8px}.action{padding:8px;font-size:10px}.action small{font-size:8px}#panel{width:165px;padding:10px;bottom:75px;max-height:45dvh}#tutorial{left:50%;top:150px;bottom:auto;width:calc(100vw - 35px);padding:12px;z-index:4}#tutorial h3{font-size:15px}#tutorial p{font-size:10px}#travel-hint{top:auto;bottom:60px;font-size:10px;max-width:80vw;white-space:nowrap}#interact-prompt{bottom:80px;font-size:12px;max-width:180px;padding:10px}#character-menu{margin-left:10px;top:30px;width:min(320px,calc(100vw - 20px));padding:20px;max-height:90dvh}#walk-controls{bottom:80px;left:10px}.world-label{font-size:8px;padding:4px}.left:has(~#tutorial:not(.hidden)){top:300px}#toast{bottom:280px;width:85vw;font-size:12px}footer>span:first-child{font-size:8px}}
/* Character creation is a separate portrait screen, with no village or HUD. */
body.customizing{overflow:hidden;background:#101c22}body.customizing .vignette,body.customizing .left,body.customizing #resources,body.customizing #panel,body.customizing footer,body.customizing #station-labels,body.customizing #travel-hint,body.customizing #interact-prompt,body.customizing #tutorial,body.customizing #walk-controls,body.customizing #toast,body.customizing #start{display:none!important}body.customizing #ironfjord-stage header{position:fixed;inset:0 auto auto 0;width:72px;height:72px;margin:0;padding:0;border:0;z-index:30;pointer-events:none}body.customizing #ironfjord-stage header>*{display:none}body.customizing #ironfjord-stage header #menu-toggle{display:block;position:fixed;left:18px;top:18px;width:42px;height:42px;margin:0;pointer-events:auto;background:#172a31;border-color:#8e805f}body.customizing #character-menu[open]{position:fixed;inset:0 auto 0 0;top:0;margin:0;padding:88px 28px 24px;width:min(400px,44vw);height:100dvh;max-height:100dvh;overflow-y:auto;border:0;border-right:1px solid #b59b6740;border-radius:0;background:linear-gradient(150deg,#1c3036f5,#102127fc);box-shadow:18px 0 50px #0003;z-index:20;scrollbar-width:thin;scrollbar-color:#8c7d5b transparent}body.customizing #character-menu h2{font-size:29px;line-height:1.2;margin:12px 0 8px}.creator-intro{margin:0 0 22px!important}.creator-section{border-top:1px solid #e5cc9c22;padding-top:18px;margin-top:22px}.creator-section>.eyebrow{font-size:9px;letter-spacing:2px}.look-presets{display:flex;gap:7px;margin-top:13px}.look-presets button,.portrait-controls button{background:#263d42;border:1px solid #b39a6955;color:#e5cfaa;padding:9px 10px;font-size:11px}.look-presets button{flex:1}.look-presets button:hover,.portrait-controls button:hover{border-color:#ddbd7f;background:#365057}#character-menu .name-field{display:block;font-size:12px}#character-menu .name-field input{display:block;width:100%;margin-top:9px;padding:12px;font-size:15px}.color-field{margin:17px 0;font-size:12px}.color-field>span{display:block;margin-bottom:9px}.color-swatches{display:flex;flex-wrap:wrap;gap:10px}.color-swatches button{width:32px;height:32px;border-radius:50%;background:var(--swatch);border:2px solid #ffffff30;box-shadow:inset 0 0 0 2px #0003;position:relative}.color-swatches button[aria-pressed=true]{outline:2px solid #e9cc8a;outline-offset:3px;border-color:#f8e7c9}.color-swatches button[aria-pressed=true]::after{content:'✓';color:white;text-shadow:0 1px 3px black;font-size:14px}.portrait-controls{display:flex;justify-content:center;gap:10px;margin-top:23px}.portrait-instructions{text-align:center;font-size:10px!important}.creator-confirm{position:sticky;bottom:-24px;background:linear-gradient(0deg,#102127 85%,#10212700);padding:18px 0 24px;margin-top:8px}.creator-confirm .target{text-align:center;font-size:12px}.creator-confirm .primary{margin-top:0}@media(max-width:900px){body.customizing #character-menu[open]{padding:78px 20px 20px}body.customizing #character-menu h2{font-size:24px}#character-menu label{display:block;margin:15px 0}#character-menu select{display:block;width:100%;margin-top:8px}.look-presets{flex-wrap:wrap}.look-presets button{padding:8px 5px;font-size:10px}}@media(max-width:600px){body.customizing #character-menu[open]{width:50vw;padding:76px 12px 18px}body.customizing #character-menu h2{font-size:20px}.color-swatches{gap:9px}.color-swatches button{width:26px;height:26px}.look-presets{display:grid;grid-template-columns:1fr}.creator-section{padding-top:14px;margin-top:17px}.creator-section>.eyebrow{font-size:8px;letter-spacing:1px}.portrait-controls{gap:4px;flex-wrap:wrap}.portrait-controls button{font-size:10px;padding:7px}.creator-confirm{bottom:-18px;padding-bottom:18px}.creator-confirm .primary{font-size:11px;padding:12px 6px}body.customizing #menu-toggle{left:12px!important;top:15px!important}.creator-intro{font-size:10px!important}}
body.customizing #game-menu #edit-character,body.customizing #game-menu #replay-tutorial{display:none}
/* Quiet gameplay HUD. The village remains the main screen. */
html,body{width:100%;height:100%;overflow:hidden}#ironfjord-stage header{position:fixed;top:16px;left:16px;width:42px;height:42px;margin:0;border:0;padding:0;z-index:8}#ironfjord-stage header #menu-toggle{margin:0;width:42px;height:42px;font-size:23px;background:#11292bd9}.playing .vignette{display:none}#resources{position:fixed;inset:16px 16px auto auto;display:flex;gap:0;padding:7px 4px;max-width:calc(100vw - 88px);border:1px solid #cbb67b30;border-radius:5px;background:#11282bd9;backdrop-filter:blur(8px);z-index:7}.resource{min-width:58px;padding:0 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-left:1px solid #ffffff12}.resource:first-child{border-left:0}.resource small{font-size:8px;letter-spacing:.6px;margin-bottom:2px;color:#b7c1b5}.resource b{font:500 16px 'DM Sans',sans-serif;line-height:1.2;color:#f0dfbd}#panel{position:fixed;inset:80px 16px auto auto;width:300px;max-height:calc(100dvh - 100px);padding:22px;border-radius:5px;background:#10272bef;z-index:6;overflow-y:auto;box-shadow:0 10px 35px #0003}#panel h2{font-size:22px;padding-right:15px}#panel .eyebrow{font-size:9px;letter-spacing:2px}#panel p{font-size:12px;line-height:1.6}#panel .target{padding:10px}#panel .primary{font-size:12px;padding:12px}.panel-close{position:absolute;right:8px;top:8px;border:0;background:none;color:#cbbd99;font-size:25px;width:30px;height:30px}.panel-close:hover{color:#fff}#tutorial{position:fixed;inset:80px auto auto 16px;transform:none;width:260px;max-width:calc(100vw - 32px);padding:12px 14px;border:0;border-left:2px solid #ceb378;border-radius:0 4px 4px 0;background:#10272bcc;box-shadow:none;z-index:5;pointer-events:auto}#tutorial .eyebrow{font-size:8px;letter-spacing:1.5px;color:#b6ab8b}#tutorial h3{font:500 14px 'DM Sans',sans-serif;margin:5px 0;color:#eee6d2}#tutorial p{font-size:11px;line-height:1.5;margin:9px 0 3px;color:#bdc7bd}#tutorial #travel-hint{position:static;inset:auto;transform:none;max-width:none;white-space:normal;background:none;border:0;padding:0;font-size:10px;line-height:1.4;color:#c6b381;margin-top:3px}#travel-hint:empty{display:none}.objective-controls{display:flex;justify-content:space-between;gap:16px;margin-top:5px}#tutorial button{font-size:9px;padding:3px 0;color:#a9b3aa}#tutorial button:hover{color:#e3c68c}.station-open #tutorial,.menu-open #tutorial,.menu-open #interact-prompt,.menu-open #station-labels{display:none!important}#interact-prompt{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);max-width:calc(100vw - 32px);padding:10px 18px;border:1px solid #d9bd7a66;border-radius:5px;background:#132b2ee6;color:#ead9ad;font-size:12px;box-shadow:0 5px 20px #0003;z-index:5}.world-label{font-size:10px;padding:5px 8px;border:0;border-radius:3px;background:#162c2dcc;color:#d6c49a}#toast{position:fixed;inset:auto auto 78px 50%;font-size:12px;max-width:calc(100vw - 32px);width:auto;border-radius:4px;padding:10px 16px;z-index:9}#walk-controls{bottom:20px;left:16px}#walk-controls button{width:33px;height:33px;font-size:15px}.menu-help{border-top:1px solid var(--line);padding-top:15px;margin:18px 0;color:#c1c8bb;font-size:12px}.menu-help summary{cursor:pointer;color:#d3bc87}.menu-help p{font-size:11px;line-height:1.8;color:#aebcb0}.menu-open #walk-controls{display:none!important}@media(max-width:700px){#ironfjord-stage header{top:12px;left:12px}#resources{top:12px;right:12px;max-width:calc(100vw - 76px);padding:7px 2px}.resource{min-width:0;padding:0 7px}.resource small{font-size:7px;letter-spacing:0}.resource b{font-size:14px}#tutorial{top:72px;left:12px;width:215px;padding:10px 12px;max-width:calc(100vw - 24px)}#panel{top:72px;right:12px;width:min(300px,calc(100vw - 24px));max-height:calc(100dvh - 90px);padding:20px}#panel h2{font-size:20px}#interact-prompt{bottom:18px;font-size:11px}#toast{bottom:72px;width:max-content}#walk-controls{bottom:15px;left:10px}}
.practice-dialog{width:min(440px,calc(100vw - 32px));max-height:85dvh;overflow:auto;padding:32px;background:#122b30;color:#e9e4d6;border:1px solid #c6aa7166;border-radius:6px;box-shadow:0 20px 80px #0008}.practice-dialog::backdrop{background:#091a20ed}.practice-dialog h2{font:27px 'Cinzel',serif;line-height:1.3;margin:14px 0}.practice-dialog p{font-size:13px;line-height:1.7;color:#b8c5bb}.practice-dialog small{display:block;margin-top:18px;font-size:11px;color:#9fac9f}.practice-dialog .target{text-align:center}body.tutorial-gate #resources,body.tutorial-gate #panel,body.tutorial-gate #station-labels,body.tutorial-gate #interact-prompt,body.tutorial-gate #tutorial,body.tutorial-gate #walk-controls{display:none!important}body:not(.training) #training-exit{display:none}body.training #replay-tutorial,body.training #edit-character{display:none}body.training #tutorial{border-left-color:#93bdad}#combat-status{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);padding:9px 16px;background:#11282bdb;color:#e1cc9e;font-size:12px;border-radius:4px;z-index:5}#combat-loadout{position:fixed;right:16px;bottom:22px;background:#10282cd9;padding:10px;border-radius:4px;z-index:5;font-size:11px}#combat-loadout>span{margin-right:8px;color:#b6c4b7}#combat-loadout button{border:1px solid #ac946452;background:#263d3d;color:#dec491;padding:7px 10px;font-size:11px}.touch-attacks{display:none;margin-top:10px}.menu-open #combat-status,.menu-open #combat-loadout{display:none!important}@media(pointer:coarse){.touch-attacks{display:flex;flex-wrap:wrap;gap:4px}}@media(max-width:700px){#combat-status{bottom:135px;font-size:10px}#combat-loadout{bottom:18px;right:12px;max-width:52vw}.practice-dialog{padding:24px}.practice-dialog h2{font-size:23px}}
#camera-reticle{position:fixed;left:50%;top:50%;width:5px;height:5px;transform:translate(-50%,-50%);border-radius:50%;background:#f1e3c6;box-shadow:0 0 0 1px #172d30aa;pointer-events:none;z-index:4}body.customizing #camera-reticle,body.menu-open #camera-reticle,body.tutorial-gate #camera-reticle{display:none!important}body.camera-locked canvas{cursor:none}
#controls-menu h3{font:16px 'Cinzel',serif;color:#dcc493;margin:22px 0 12px}#controls-menu{width:min(520px,calc(100vw - 28px))}.controls-list{display:grid;grid-template-columns:1fr 1.35fr;gap:10px 16px;margin:0;font-size:12px;line-height:1.5}.controls-list dt{color:#a9bdb3}.controls-list dd{margin:0;color:#e4e3d3}kbd{display:inline-block;background:#304345;border:1px solid #ad9c7155;border-radius:3px;padding:1px 5px;font:11px 'DM Sans',sans-serif;color:#e7d4ad}
.hall-tabs{display:flex;gap:6px;margin:14px 0}.hall-tabs button{flex:1;font-size:11px!important}#panel input{width:100%;padding:10px;margin:8px 0;background:#1c3638;border:1px solid #c5ab6d70;color:#eee4ce;border-radius:3px}#panel small{display:block;color:#b0bfb7;font-size:11px;line-height:1.6;margin:5px 0}#character-name-error{color:#f4bc99;font-size:12px}#character-name-error:empty{display:none}#panel button:disabled{opacity:.5;cursor:default}#resources{overflow-x:auto}.resource{flex-shrink:0}@media(max-width:700px){#resources .resource{min-width:38px;padding:0 5px}#resources .resource small{font-size:7px}#resources .resource b{font-size:13px}}

#player-vitals{position:fixed;left:18px;bottom:20px;width:230px;padding:13px 15px;background:#10272bea;border:1px solid #cfb17155;border-radius:5px;z-index:7;pointer-events:none}.vital-heading{display:flex;justify-content:space-between;align-items:center;font-size:11px;margin-bottom:5px;gap:7px}.vital-heading b{letter-spacing:1px;color:#e8d7ae}.vital-heading strong{font-size:12px;color:#f6ead2}.vital-track{height:9px;border-radius:3px;background:#071416;overflow:hidden;margin-bottom:8px}.vital-track span{display:block;height:100%;background:#b95343;transition:width .15s}.vital-track.shield{height:6px}.vital-track.shield span{background:#80aab8}#player-vitals small{font-size:10px;color:#d2c397}.enemy-vital{position:fixed;transform:translate(-50%,-100%);width:114px;pointer-events:none;text-align:center;background:#112428d9;padding:5px;border-radius:3px}.enemy-vital b{display:block;font-size:9px;color:#f0dfc3;margin-bottom:4px}.enemy-vital small{font-size:9px;color:#e7c787}.enemy-vital .vital-track{height:5px;margin:0}#enemy-vitals{pointer-events:none;position:fixed;inset:0;z-index:5}body.customizing #player-vitals,body.customizing #enemy-vitals,body.tutorial-gate #player-vitals,body.tutorial-gate #enemy-vitals{display:none!important}@media(max-width:700px){#player-vitals{top:82px;bottom:auto;left:12px;width:175px;padding:10px}.training #tutorial{top:210px}#player-vitals small{font-size:9px}}

#raid-destination{display:block;width:100%;margin:10px 0 16px;padding:12px;background:#173032;color:#f4ead4;border:1px solid #a38850;font:inherit;border-radius:4px}#raid-destination option,#raid-destination optgroup{background:#173032;color:#f4ead4}

#free-training-status{position:fixed;top:20px;left:50%;transform:translateX(-50%);padding:9px 16px;background:#173032df;color:#e6d4a5;font-size:13px;pointer-events:none;z-index:8}

body.free-training #resources,body.free-training #replay-tutorial,body.free-training #edit-character{display:none!important}

#settlement-name{position:fixed;left:22px;top:80px;max-width:170px;color:#e7d29e;font-size:13px;text-shadow:0 2px 4px #000;pointer-events:none;z-index:4}.city-naming{margin-bottom:15px}.city-naming input{display:block;width:100%;box-sizing:border-box;margin-top:8px;padding:9px;background:#173032;color:#e9dfc9;border:1px solid #8c794c}

#player-vitals.hurt-flash{box-shadow:0 0 22px #b84c4688;border-color:#d87964}#player-vitals.parry-flash{box-shadow:0 0 22px #d9bc7588;border-color:#e9cf84}.vital-track.stamina span{background:#8ba76c}

#family-names{position:fixed;inset:0;pointer-events:none;z-index:4}.family-name{position:absolute;transform:translate(-50%,-100%);padding:4px 7px;border-radius:3px;background:#122b30bd;color:#ebdbb6;text-align:center;font-size:11px;white-space:nowrap}.family-name small{display:block;color:#c0cbbb;font-size:9px;margin-top:2px}.menu-open #family-names,.customizing #family-names{display:none}

#raid-preview-menu{width:min(1100px,96vw);height:90dvh;max-height:94dvh;padding:20px;background:#132c31;color:#e9dfca;border:1px solid #b89b63;border-radius:8px;box-sizing:border-box}#raid-preview-menu::backdrop{background:#08191eee}.raid-gallery-bar,.raid-gallery-controls{display:flex;align-items:center;justify-content:space-between;gap:14px}.raid-gallery-bar h2{font-size:25px;margin:5px 0}.raid-gallery-bar button,.raid-gallery-controls button{background:#304748;border:1px solid #b89b6366;color:#ead8b2;padding:9px 14px;cursor:pointer}#raid-preview-copy{font-size:13px;color:#bbc9c3;margin:8px 0 12px;line-height:1.5}#raid-preview-canvas{height:calc(100% - 195px);min-height:180px;border-radius:5px;overflow:hidden}#raid-preview-canvas canvas{display:block;width:100%;height:100%}.raid-gallery-controls{margin-top:12px}.raid-gallery-controls select{flex:1;min-width:0;width:auto;margin:0}#raid-preview-menu small{display:block;font-size:11px;color:#b5c0b6;margin-top:10px}@media(max-width:650px){#raid-preview-menu{padding:12px}.raid-gallery-bar h2{font-size:21px}#raid-preview-canvas{height:calc(100% - 225px)}.raid-gallery-controls{gap:6px}.raid-gallery-controls button{padding:9px 7px;font-size:11px}}

.army-section-buttons{display:grid;grid-template-columns:1fr 1fr;gap:5px}.army-section-buttons .target{font-size:11px;margin:0;padding:8px}.army-section-buttons .target:first-child{grid-column:1/-1}#army-order-map{width:100%;aspect-ratio:1;margin:12px 0;cursor:crosshair;border:1px solid #c2ab7566;overflow:hidden;border-radius:4px}#army-order-map svg{display:block;width:100%;height:100%;pointer-events:none}.army-order-buttons{display:flex;gap:5px}.army-order-buttons .target{flex:1;font-size:11px}
/* Expanded battlefield command controls. */
#siege-target{display:block;width:100%;margin:8px 0 12px;padding:10px;background:#173032;color:#f4ead4;border:1px solid #a38850;font:inherit;border-radius:4px}#siege-target option{background:#173032;color:#f4ead4}.siege-loadout{margin:12px 0;padding:10px;border:1px solid #a3885066;border-radius:4px}.siege-loadout summary{cursor:pointer;color:#e4c888}.siege-loadout small{display:block;font-size:11px}.siege-loadout .worker-buttons{display:flex;align-items:center;gap:8px}.siege-loadout .worker-buttons button{padding:5px 10px}#siege-selected-status{color:#e4c888}.army-order-buttons{flex-wrap:wrap}.army-order-buttons .target{min-width:100px}
body.voyage-active #panel,body.voyage-active #resources,body.voyage-active #player-vitals,body.voyage-active #enemy-vitals,body.voyage-active #combat-status,body.voyage-active #toast,body.voyage-active #station-labels,body.voyage-active #family-names,body.voyage-active footer,body.voyage-active .vignette{visibility:hidden!important}#voyage-cutscene{position:fixed;inset:0;z-index:25;pointer-events:none;background:linear-gradient(#08151b 0 6%,transparent 6% 76%,#07141bea 94%)}#voyage-cutscene.hidden{display:none}.voyage-caption{position:absolute;left:5%;bottom:8%;max-width:68%}.voyage-caption h2{font:500 clamp(22px,3vw,42px) 'Cinzel',Georgia,serif;margin:10px 0}.voyage-caption p{color:#dbd4be;font-size:14px}.voyage-skip{position:absolute;right:4%;bottom:8%;text-align:right}.voyage-skip button{pointer-events:auto;padding:12px 22px;border:1px solid #ddc38a;background:#112b33d9;color:#ead9b7;border-radius:3px}.voyage-skip small{display:block;color:#c9c8bb;margin-top:12px;font-size:11px}.voyage-track{position:absolute;left:5%;right:4%;bottom:5%;height:2px;background:#ffffff29}#voyage-progress{height:100%;background:#d6b472;transition:width .1s linear}#voyage-shade{position:absolute;inset:0;background:#061016;opacity:1;pointer-events:none}.menu-open #voyage-cutscene{visibility:hidden}@media(max-width:650px){.voyage-caption{bottom:18%;max-width:88%}.voyage-skip{bottom:7%}.voyage-caption h2{font-size:23px}}

#victory-screen{position:fixed;inset:0;z-index:55;display:grid;place-items:center;background:linear-gradient(130deg,#091b26e8,#152f36bb);backdrop-filter:blur(4px);padding:24px;overflow:auto}#victory-screen.hidden{display:none}.victory-card{width:min(600px,100%);padding:36px;border:1px solid #c6a66d77;background:#10282def;box-shadow:0 24px 100px #0008;text-align:center}.victory-card h1{font:64px Georgia,serif;color:#e6c88a;margin:14px 0}.victory-card h2{font:25px Georgia,serif;margin:8px 0 18px}.victory-card button{width:100%;margin-top:12px}.victory-card small{display:block;color:#9dadad;margin-top:22px;font-size:11px}#victory-results{display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:left;margin:22px 0}#victory-results div{padding:12px;background:#ffffff08;border:1px solid #ffffff15}#victory-results b{display:block;color:#e6c88a;font-size:22px}.victory-note{color:#b4c2bd;line-height:1.6}.victory-open #panel,.victory-open #resources,.victory-open #combat-hud{visibility:hidden}.menu-open #victory-screen{visibility:hidden}@media(max-height:700px){.victory-card{padding:18px}.victory-card h1{font-size:44px;margin:8px}#victory-results{margin:12px 0}}

#village-guide{width:min(570px,92vw);max-height:86vh;overflow:auto}#village-guide-locations{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0}#village-guide-locations button{margin:0;text-align:left}#village-guide-locations small{display:block;margin-top:6px;color:#b7c3bd;line-height:1.45}#village-guide>small{display:block;color:#aebdb7;line-height:1.5;margin-bottom:14px}#destination-hint{position:fixed;top:74px;left:50%;transform:translateX(-50%);display:flex;gap:12px;align-items:center;background:#10292ded;border:1px solid #b89c6277;padding:8px 12px;z-index:12;font-size:13px;pointer-events:auto}#destination-hint.hidden{display:none}#destination-arrow{display:inline-block;color:#e7c684;font-size:22px}#destination-hint button{border:0;background:none;color:#c8cfc8;padding:3px 7px;font-size:18px}@media(max-width:650px){#village-guide-locations{grid-template-columns:1fr}#destination-hint{top:92px;white-space:nowrap}}

.ruler-risk{border:1px solid #bf826688;background:#8d49351c;padding:12px;line-height:1.6;color:#ddc6b4;margin:14px 0;font-size:12px}.ruler-risk b{display:block;color:#efc3a4}.saga-overlay{position:fixed;inset:0;z-index:56;display:grid;place-items:center;background:linear-gradient(140deg,#081a22ef,#203a36da);backdrop-filter:blur(4px);padding:24px;overflow:auto}.saga-overlay.hidden{display:none}.saga-card{width:min(620px,100%);max-height:88vh;overflow:auto;border:1px solid #d6b47277;background:#10292eef;padding:32px}.saga-card h1{font:40px Georgia,serif;color:#e1c180;margin:16px 0}.saga-card p{line-height:1.7;color:#bdc9c0}.saga-card button{width:100%;margin-top:10px}.saga-card button small{display:block;color:#b9c7be;margin-top:6px}#legacy-confirm{border-top:1px solid #c07f6d66;margin-top:18px}#coronation-screen{position:fixed;inset:0;z-index:45;pointer-events:none;box-shadow:inset 0 60px #07131a,inset 0 -60px #07131a;background:linear-gradient(0deg,#07131acc,transparent 45%)}#coronation-screen.hidden{display:none}.coronation-caption{position:absolute;left:5%;bottom:12%;max-width:70%}.coronation-caption h1{font:48px Georgia,serif;color:#efd197;margin:12px 0}.coronation-caption h2{font:26px Georgia,serif;margin:8px 0}.coronation-caption p{color:#d4d9cc}#coronation-screen>button{position:absolute;right:5%;bottom:13%;pointer-events:auto}#coronation-screen>small{position:absolute;right:5%;bottom:8%;color:#c4cdc1}#conquest-lands{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:22px 0}#conquest-lands span{padding:10px;border:1px solid #d6b47233;color:#e5d1a3;font-size:13px}.legacy-open #resources,.legacy-open #panel,.legacy-open #player-vitals,.coronation-open #resources,.coronation-open #panel,.coronation-open #player-vitals,.conquest-open #resources,.conquest-open #panel,.conquest-open #player-vitals{visibility:hidden}.menu-open #legacy-screen,.menu-open #coronation-screen,.menu-open #conquest-screen{visibility:hidden}@media(max-width:650px){.saga-card{padding:20px}.saga-card h1{font-size:31px}#conquest-lands{grid-template-columns:1fr}.coronation-caption{bottom:24%;max-width:90%}.coronation-caption h1{font-size:34px}#coronation-screen>button{bottom:12%}}

#coronation-screen>button{width:auto;max-width:45vw;padding:12px 20px;text-align:center}.coronation-caption{bottom:14%;max-width:60%}.coronation-open #toast{visibility:hidden}@media(max-width:650px){.coronation-caption{bottom:25%;max-width:90%}#coronation-screen>button{max-width:80vw}}

.sea-risk-copy{border-left:2px solid #af9860;padding-left:10px;font-size:12px;line-height:1.6}.sea-report-open #resources,.sea-report-open #panel,.sea-report-open #player-vitals{visibility:hidden}.menu-open #sea-report-screen{visibility:hidden}

.coronation-open #settlement-name,.coronation-open #family-names,.coronation-open #destination-hint,.coronation-open #interact-prompt,.coronation-open #tutorial,.coronation-open #combat-loadout,.coronation-open #combat-status{visibility:hidden}

body.voyage-active #interact-prompt,body.voyage-active #settlement-name,body.voyage-active #tutorial,body.voyage-active #walk-controls,body.voyage-active #camera-reticle,body.coronation-open #interact-prompt,body.coronation-open #settlement-name{visibility:hidden!important}
#graphics-quality{width:100%;padding:10px;background:#153039;color:#e6d8b8;border:1px solid #a8905d}#save-status.save-failed{color:#efb39a;border:1px solid #bf8266;padding:10px}

/* The stage establishes a containing block for the game's fixed HUD. */
html,body{height:100%;overflow:hidden}body{display:flex;flex-direction:column;height:100dvh;min-height:0}
#ironfjord-stage{position:relative;flex:1 1 0;width:100%;min-height:0;min-width:0;transform:translateZ(0);contain:layout paint;overflow:hidden}
.ck-game-stage:has(>#ironfjord-stage){display:flex;flex-direction:column;overflow:hidden}
#ironfjord-audio{box-sizing:border-box;display:flex;position:relative;z-index:80;flex:0 0 auto;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;min-height:42px;width:100%;padding:7px 12px;background:#132c30;border-bottom:1px solid #8e8058;color:#ebdfc3;font:12px Arial,sans-serif}
#ironfjord-audio label{display:inline-flex;align-items:center;gap:7px;font:12px Arial,sans-serif;margin:0}#ironfjord-audio input{width:100px;accent-color:#d6b472;margin:0}#ironfjord-audio output{min-width:33px;font:11px Arial;font-variant-numeric:tabular-nums}#ironfjord-audio a{color:#dfc28a;font:700 11px Arial;text-decoration:none;padding:6px 8px;border:1px solid #887a57;border-radius:4px}
@media(max-width:600px){#ironfjord-audio{gap:8px;padding:6px}#ironfjord-audio input{width:70px}#ironfjord-audio a{font-size:10px;padding:6px}}
@media(max-width:370px){#ironfjord-audio input{width:55px}#ironfjord-audio label{gap:4px}}