@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{--bg:#18231f;--line:#ffffff16;--gold:#d9b872;--text:#ebe9df;--muted:#99a79a}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:13px 'DM Sans',sans-serif;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;border:1px solid #ffffff20;background:#ffffff05;border-radius:4px;transition:.15s}button:hover{border-color:var(--gold);background:#d9b87218}button:disabled{opacity:.4;cursor:not-allowed}header{height:82px;display:flex;align-items:center;padding:0 27px;gap:34px;border-bottom:1px solid #d9b87230;background:#15201b}.brand{display:flex;gap:12px;align-items:center;font:600 17px Cinzel,Georgia,serif;white-space:nowrap;letter-spacing:1px}.brand i{font-size:12px;color:var(--gold)}.brand small{display:block;font:9px 'DM Sans',sans-serif;color:var(--muted);margin-top:7px}.crest{font-size:35px;color:var(--gold)}#resources{display:flex;flex:1;justify-content:center;gap:35px}.resource{display:flex;gap:11px;align-items:center}.resource .icon{font-size:25px;color:var(--gold)}.resource b{font-size:18px;font-weight:500;display:block;font-variant-numeric:tabular-nums}.resource small{font-size:9px;letter-spacing:1.3px;color:var(--muted)}nav{display:flex;gap:8px}nav button{height:34px;min-width:34px;padding:0 10px}main{height:calc(100dvh - 294px);position:relative;overflow:hidden;background:#64734a}#world{width:100%;height:100%;display:block;touch-action:none}.topline{position:absolute;top:23px;left:26px;right:25px;display:flex;justify-content:space-between;pointer-events:none}.chapter{font-size:9px;letter-spacing:2px;color:#e0c78e;background:#17231edb;border:1px solid #d9b87235;padding:13px 17px;border-radius:4px}.chapter span{font:16px Cinzel,Georgia,serif;color:var(--text);letter-spacing:0;margin-left:15px}.live{background:#17231ee0;padding:10px 14px;border-radius:4px;display:flex;align-items:center;gap:10px;color:#c0cbbd;font-size:11px}.live b{width:6px;height:6px;border-radius:50%;background:#a2bc85}.mission{position:absolute;left:26px;top:88px;padding:21px 23px;width:246px;background:linear-gradient(130deg,#18271df2,#1d2b22d9);border:1px solid #d2c19735;border-radius:4px;box-shadow:0 8px 30px #17201622}.mission small{font-size:9px;letter-spacing:2px;color:var(--gold)}.mission h2{font:20px/1.45 Cinzel,Georgia,serif;margin:13px 0 20px}.objective{font-size:11px;color:#c0c9b9;margin:12px 0;display:flex;gap:10px}.objective span{color:#d9b872}.objective.done{color:#849e75;text-decoration:line-through}.mission>p{font-size:10px;border-top:1px solid var(--line);padding-top:15px;margin-bottom:0;color:#d9b872}.mapcontrols{position:absolute;right:25px;bottom:22px;display:flex;background:#18231fed;align-items:center;border:1px solid #d9b87240;border-radius:4px;overflow:hidden}.mapcontrols button{height:35px;width:35px;border:0;border-radius:0;font-size:19px}.mapcontrols span{font-size:10px;padding:0 8px}.maplabel{position:absolute;left:27px;bottom:22px;font:11px Cinzel,Georgia,serif;letter-spacing:2px;color:#f5efdc;text-shadow:0 1px 5px #000}.maplabel span{display:block;font:8px 'DM Sans',sans-serif;margin-top:6px}footer{height:182px;display:flex;padding:15px 23px;gap:23px;border-top:2px solid #a38a5366;background:linear-gradient(#1d2a23,#17221d)}.sectionlabel{font-size:9px;letter-spacing:1.7px;color:var(--muted);display:flex;justify-content:space-between;margin-bottom:10px}.minimap{width:220px;flex-shrink:0}#mini{width:220px;height:116px;border:1px solid #b9a66b66;cursor:crosshair;background:#5b6849}#selection{width:225px;flex-shrink:0;border-left:1px solid var(--line);border-right:1px solid var(--line);padding:0 20px}#selection h3{font:17px Cinzel,Georgia,serif;margin:10px 0 6px}#selection p{font-size:11px;line-height:1.5;color:var(--muted);margin:6px 0}#selection button{font-size:10px;padding:8px;margin-top:5px;width:100%;color:var(--gold)}.build{flex:1;min-width:0}#buildings{display:flex;gap:8px;height:121px}.buildcard{flex:1;min-width:70px;text-align:left;padding:8px 11px;position:relative;border-color:#9ea88929;background:#233329}.buildcard .art{display:block;text-align:center;height:49px;font-size:34px;filter:sepia(.4);color:#d4bd80}.buildcard b{display:block;font-size:11px;font-weight:500;margin:4px 0 7px}.buildcard small{font-size:9px;color:#b3b89c;white-space:nowrap}.buildcard.active{background:#d9b87222;border-color:#d9b872}.buildcard sup{position:absolute;top:8px;right:8px;font-size:8px;color:#8e9d88}.bottom{height:30px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 24px;font-size:9px;color:#8d9b8d;gap:10px}kbd{font:8px sans-serif;border:1px solid #ffffff22;padding:2px 4px;border-radius:2px;margin:0 5px 0 10px;color:#bec6b8}#toast{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);background:#17231ff0;border:1px solid #d9b87266;padding:12px 20px;border-radius:5px;color:#ead5a6;opacity:0;transition:opacity .2s;pointer-events:none;font-size:12px}#toast.show{opacity:1}#placement{position:absolute;bottom:78px;left:50%;transform:translateX(-50%);background:#17231ff0;padding:14px 20px;color:var(--gold);border:1px solid #d9b87266;border-radius:4px}#placement span{display:block;font-size:10px;color:var(--muted);margin-top:5px}dialog{background:#1b2a23;color:var(--text);border:1px solid #cbb27c66;border-radius:8px;max-width:680px;width:calc(100% - 32px);padding:40px;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#0a170fb0;backdrop-filter:blur(5px)}dialog>small{font-size:10px;letter-spacing:3px;color:var(--gold)}dialog h1{font:35px/1.25 Cinzel,Georgia,serif;color:#f2e8d1}dialog p{color:#adbba9;font-size:13px;line-height:1.7}.close{position:absolute;right:15px;top:12px;font-size:22px;border:0}.guide{display:grid;grid-template-columns:1fr 1fr;gap:12px 25px;margin:24px 0}.guide b{font-size:12px;color:#d9b872}.guide p{font-size:11px}.dialogactions{display:flex;gap:10px}.dialogactions button{padding:12px 16px}.gold{background:#d9b872;color:#19251d;border-color:#d9b872;font-weight:700}.fine{font-size:10px!important;margin-bottom:0}#hint{letter-spacing:0;font-size:10px}.hp{height:3px;background:#ffffff18;margin:10px 0}.hp div{height:100%;background:#9eaf7d}@media(max-width:1100px){header{padding:0 16px;gap:18px}#resources{gap:16px}.brand{font-size:13px}.resource b{font-size:15px}.resource .icon{font-size:19px}footer{gap:12px;padding:15px}.minimap{width:170px}#mini{width:170px}#selection{width:175px;padding:0 12px}.buildcard{padding:8px 6px}.buildcard small{font-size:8px}#hint{display:none}}@media(max-width:760px){header{height:100px;flex-wrap:wrap;gap:5px;padding:8px 12px}.brand{flex:1}.brand small{display:none}.crest{font-size:24px}nav button{height:28px}#resources{order:3;width:100%;gap:20px}.resource small{font-size:7px}.resource .icon{font-size:15px}.resource b{font-size:14px}main{height:calc(100dvh - 300px)}.mission{left:12px;top:65px;width:180px;padding:13px}.mission h2{font-size:15px;margin:8px 0 12px}.mission small{font-size:8px}.objective{font-size:9px;margin:8px 0}.topline{left:12px;right:12px;top:12px}.chapter{padding:10px}.chapter span{font-size:12px;margin-left:6px}.live{font-size:9px;padding:8px}.minimap{display:none}footer{height:180px;padding:10px;gap:8px}#selection{width:130px;padding:0 8px}#selection h3{font-size:13px}#selection p{font-size:9px}.build{overflow-x:auto}#buildings{min-width:480px}.bottom{height:20px;font-size:8px;padding:0 10px}.bottom>span:nth-child(2){display:none}.bottom kbd{display:none}.maplabel{display:none}.mapcontrols{right:12px;bottom:12px}dialog{padding:24px}dialog h1{font-size:26px}.guide{gap:10px}.dialogactions{flex-wrap:wrap}}

/* Six build options and five resources. */
#buildings{overflow-x:auto}.buildcard{flex-shrink:0}#resources{gap:14px}.resource{min-width:62px}

.world-choice{margin:16px 0;padding:14px;background:#ffffff06;border:1px solid #aab58b33;border-radius:7px}.world-choice label{display:block;font-size:11px;letter-spacing:1px;color:#dcc383;margin-bottom:8px}.world-choice select{width:100%;padding:10px;background:#21362d;color:#f0e8d0;border:1px solid #d7bc7166;border-radius:5px}.world-choice p{font-size:11px;margin:8px 0 0}#modal{max-height:90vh;overflow:auto}#buildings{display:flex;overflow-x:auto}.buildcard{min-width:90px;flex:1 0 90px}

#selection{overflow-y:auto;min-height:0;scrollbar-width:thin}

.resource[data-resource="gold"] .icon{color:#efc43c}.resource[data-resource="copper"] .icon{color:#c66b36}.resource[data-resource="coal"] .icon{color:#252a2e;text-shadow:0 0 2px #bbb}.resource{min-width:0}#resources{gap:14px}header .brand{min-width:200px}

#network label{display:block;margin-top:1rem;color:var(--gold)}
#network textarea{display:block;width:100%;margin:.35rem 0 .65rem;padding:.65rem;background:#14211b;color:#e8dfc9;border:1px solid #59604a;border-radius:4px;resize:vertical}
#network .dialogactions{flex-wrap:wrap}
