@font-face{font-family:'Berkshire Swash';src:url('/targa/fonts/BerkshireSwash-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Nunito;src:url('/targa/fonts/Nunito.ttf') format('truetype');font-weight:200 1000;font-display:swap}
:root{color-scheme:light;--ink:#30462a;--paper:#fff1cd;--edge:#bb9048;--gold:#ffcc55;--blue:#2775b9;--shadow:#977443;--muted:#64704d;font-family:Nunito,'Trebuchet MS',Verdana,sans-serif;color:var(--ink)}
*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#b2cd83 url('/targa/meadow.png') center/cover;min-height:100dvh}button,input,select{font:inherit;color:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1.5px solid var(--edge);border-radius:12px;background:#ffedbd;padding:11px 17px;font-weight:800;box-shadow:0 3px 0 #ac8748;transition:transform .12s,background .12s}button:hover{background:#ffdc81}button:active{transform:translateY(2px);box-shadow:0 1px 0 #ac8748}button:disabled{opacity:.5;cursor:not-allowed;transform:none}button:focus-visible,a:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible,canvas:focus-visible{outline:3px solid #246d9f;outline-offset:4px}a{color:var(--ink)}[hidden]{display:none!important}.parchment{background:linear-gradient(110deg,#fff5da,#f8e3af);border:2px solid var(--edge);border-radius:20px;box-shadow:0 5px 0 #86673870,inset 0 0 0 4px #fff6dc88,0 9px 25px #2c4e3020}
#board{position:fixed;inset:0;width:100%;height:100%;touch-action:none}.topbar{position:relative;z-index:2;display:flex;align-items:center;gap:30px;margin:12px 16px;padding:12px 22px;min-height:86px}.brand{font:bold 24px/.95 Georgia,serif;letter-spacing:.3px;display:flex;align-items:center;gap:12px;text-decoration:none}.crest{display:inline-grid;place-items:center;background:#356a4b;color:#ffd360;border:3px solid #d8ad55;border-radius:6px 6px 19px 19px;width:44px;height:54px;font:38px Georgia}.stat{border-left:1px solid #cead6b;padding-left:25px;white-space:nowrap}.stat small{display:block;font-size:13px;font-weight:bold}.stat strong{font:bold 29px Georgia}.gold strong{color:#8c6000}.top-actions{display:flex;align-items:center;gap:12px;margin-left:auto}time{font-weight:bold;font-variant-numeric:tabular-nums;padding:0 6px}
.welcome{position:absolute;z-index:3;top:50%;left:50%;transform:translate(-50%,-44%);width:min(510px,calc(100% - 32px));max-height:calc(100dvh - 122px);overflow:auto;text-align:center;padding:22px 40px 24px}.welcome-art{height:132px;margin-top:-5px}.welcome-art canvas{height:165px;width:242px;max-width:100%;margin-top:-20px}h1{font:bold 36px/1.04 Georgia,serif;margin:6px 0 12px;letter-spacing:-.8px}h2{font:bold 25px Georgia,serif;margin:0 0 16px}p{line-height:1.5;margin:10px 0 18px}.welcome>p{font-size:15px;max-width:350px;margin:0 auto 20px}.form-row{display:flex;gap:12px}.form-row label:first-child{flex:2}.form-row label:last-child{flex:1}label{display:block;text-align:left;font-weight:bold;font-size:13px;margin-bottom:14px;min-width:0}input,select{display:block;width:100%;margin-top:6px;background:#fff9e8;border:1px solid #c4a264;border-radius:8px;padding:10px;min-height:42px;font-size:14px}.primary,button.active{background:linear-gradient(#ffdf79,#f5b83d);border-color:#b1842e;color:#483b16}.full{width:100%;font-size:19px}.welcome-links{display:flex;justify-content:center;gap:10px;margin:16px 0}.welcome-links button{box-shadow:none;font-size:13px;padding:8px 12px;background:transparent}.back-link{font-size:12px}.online-note{display:block;font-size:10px;color:#6e7258;margin-top:13px}
.kingdom-panel{position:absolute;top:118px;left:16px;width:190px;padding:17px;max-height:calc(100dvh - 325px);overflow:auto}.kingdom-panel h2{font-size:21px}ol#kingdoms{list-style:none;padding:0;margin:0}#kingdoms li{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid #c1a56e60;font-size:12px;font-weight:bold}#kingdoms li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}#kingdoms i{width:12px;height:15px;border-radius:3px 3px 7px 7px;border:1px solid #30462a;font-style:normal}#kingdoms li.you{color:#1f629e}#objective{font-size:11px;margin-bottom:0;color:#6c6442}.map-tools{position:absolute;right:16px;top:120px;display:flex;gap:7px}.map-tools button{padding:9px 13px;min-width:40px;font-size:13px}
.command-bar{position:absolute;z-index:2;bottom:26px;left:50%;transform:translateX(-50%);width:min(920px,calc(100% - 32px));padding:14px 22px;text-align:center}.command-bar>p{font-size:15px;font-weight:bold;margin:0 0 12px}.commands{display:flex;gap:16px;justify-content:center;align-items:stretch}.percentages,.upgrades{display:flex;gap:8px}.percentages button{font-size:19px;min-width:64px}.upgrades{border-left:1px solid #bc985d;padding-left:16px;flex:1}.upgrades button{flex:1;min-width:98px;font-size:15px;padding:9px 12px}.upgrades small{display:block;font-size:10px;margin-top:4px;font-weight:normal;white-space:nowrap}.command-bar details{font-size:11px;margin-top:12px}.command-bar summary{cursor:pointer;color:#70613f}.accessible-orders{display:flex;gap:10px;align-items:center;margin-top:10px}.accessible-orders label{flex:1;margin:0}.accessible-orders button{align-self:end}.command-bar details p{font-size:12px;margin-bottom:0}.connection{position:fixed;bottom:5px;left:16px;font-size:11px;background:#edf4d9e8;border-radius:20px;padding:4px 10px;z-index:5;pointer-events:none}.connection.bad{background:#ffe2b8;color:#853e19}.toast{position:fixed;left:50%;bottom:190px;transform:translateX(-50%);padding:12px 20px;z-index:10;max-width:90%;text-align:center;font-size:14px;pointer-events:none}
dialog{color:var(--ink);width:min(560px,calc(100% - 30px));padding:28px;max-height:85dvh;overflow:auto}dialog::backdrop{background:#183b365c;backdrop-filter:blur(4px)}.dialog-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.fine{font-size:12px;color:#706447;margin-bottom:0}.instructions{padding-left:23px;font-size:14px;line-height:1.55}.instructions li{margin:0 0 14px}.room-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0;border-top:1px solid #c9ab75}.room-row p{margin:0;font-weight:bold}.room-row small{display:block;font-weight:normal;font-size:12px;margin-top:4px}.result-crown{font-size:64px;text-align:center;color:#ad750c}#result-dialog{text-align:center}#result-dialog button{margin:5px}#invite-link{overflow-wrap:anywhere;font-size:12px}
@media(max-width:850px){.topbar{gap:14px;margin:8px;padding:10px 14px}.brand{font-size:18px}.crest{width:34px;height:44px;font-size:30px}.stat{padding-left:14px}.stat strong{font-size:23px}.top-actions{gap:7px}.top-actions button{padding:9px;font-size:12px}.top-actions time{display:none}.kingdom-panel{width:150px;left:8px;top:110px;padding:13px}.map-tools{top:110px;right:8px}.command-bar{width:calc(100% - 16px);padding:12px;bottom:28px}.commands{gap:8px}.percentages button{min-width:48px;padding:8px;font-size:16px}.upgrades{padding-left:8px;gap:5px}.upgrades button{min-width:70px;padding:7px;font-size:13px}.upgrades small{font-size:9px}}
@media(max-width:600px){.topbar{min-height:74px;gap:9px;padding:8px 10px}.brand{font-size:14px;gap:6px}.crest{width:27px;height:36px;font-size:25px}.stat{padding-left:9px}.stat small{font-size:9px}.stat strong{font-size:21px}.stat>span{display:none}.top-actions{gap:6px}.top-actions button{font-size:10px;padding:8px 6px}.welcome{padding:16px 24px;max-height:calc(100dvh - 106px);transform:translate(-50%,-44%)}.welcome-art{height:113px}.welcome-art canvas{height:145px;width:213px}h1{font-size:31px}.welcome>p{font-size:13px;margin-bottom:15px}.kingdom-panel{top:94px;width:130px;padding:10px;max-height:200px}.kingdom-panel h2{font-size:17px;margin-bottom:5px}#kingdoms li{padding:6px 0;font-size:10px}#kingdoms li:nth-child(n+5),#objective{display:none}.map-tools{top:94px;max-width:140px;flex-wrap:wrap;justify-content:flex-end}.map-tools button{padding:8px;font-size:11px;min-width:34px}.command-bar{padding:10px}.command-bar>p{font-size:12px;margin-bottom:9px}.commands{flex-wrap:wrap;gap:8px}.percentages{flex:1}.percentages button{flex:1;padding:8px}.upgrades{order:3;width:100%;border:0;padding:0}.upgrades button{padding:8px;min-height:43px}.command-bar details{margin-top:8px}.command-bar details[open]{max-height:45dvh;overflow:auto}.toast{bottom:245px}.connection{font-size:10px;left:8px}.accessible-orders{flex-wrap:wrap}.accessible-orders label{min-width:120px}.form-row{gap:8px}label{font-size:12px}.form-row select{font-size:12px;padding:9px 5px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

@media(min-width:601px) and (max-height:800px){.welcome{padding:14px 30px;max-height:calc(100dvh - 120px);top:calc(50% + 43px);transform:translate(-50%,-50%)}.welcome-art{height:86px}.welcome-art canvas{height:110px;width:162px;margin-top:-13px}.welcome h1{font-size:31px}.welcome>p{margin-bottom:14px}.welcome label{margin-bottom:10px}.welcome-links{margin:12px 0}.welcome .online-note{margin-top:9px}}

.build-icon{float:left;width:26px;height:34px;margin:0 7px 0 -2px}.build-label{display:inline-block;padding-top:3px}@media(max-width:600px){.build-icon{width:22px;height:29px;margin-right:4px}.upgrades button{min-height:48px}}

@media(min-width:1100px){.topbar{min-height:100px;gap:36px}.brand{font-size:30px}.crest{width:48px;height:60px;font-size:41px}.stat strong{font-size:34px}.stat small{font-size:15px}.top-actions button{font-size:16px;padding:13px 20px}.kingdom-panel{top:130px;width:210px}.kingdom-panel h2{font-size:26px}#kingdoms li{font-size:14px;padding:11px 0}.map-tools{top:130px}.command-bar{width:min(1120px,calc(100% - 32px));padding:17px 24px}.command-bar>p{font-size:18px}.percentages button{min-width:80px;font-size:24px}.upgrades button{font-size:18px}.build-icon{width:32px;height:42px}.command-bar details{font-size:12px}.upgrades small{font-size:11px}}

.upgrades small{clear:both;white-space:normal;line-height:1.25}@media(max-width:600px){.upgrades small{min-height:22px;padding-top:3px}.upgrades button{font-size:12px}}

/* Laptop-first polish. Keep at least the middle half of a 768px display open. */
body{overscroll-behavior:none}body.in-battle{background:#b5cf87}
button{min-height:40px}button:disabled{opacity:1;box-shadow:none;background:#eee3c8;color:#675f49}
.brand,h1,h2,h3,.stat strong,.full,.build-label{font-family:'Berkshire Swash',Georgia,serif;font-weight:400;letter-spacing:0}
.topbar{margin:10px 12px;padding:8px 18px;min-height:72px;gap:25px;border-radius:17px}
.brand{font-size:32px;line-height:.95;gap:10px}.brand small{display:block;font:400 17px/1.15 'Berkshire Swash',Georgia,serif}
.crest{width:39px;height:48px;font-size:34px}.stat{padding-left:22px}.stat strong{font-size:30px}.stat small{font-size:12px}.top-actions button{padding:8px 14px;font-size:13px}.top-actions{gap:8px}
.kingdom-panel{top:100px;left:12px;width:190px;padding:12px 14px;max-height:calc(100dvh - 320px)}
.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.panel-heading h2{font-size:23px;margin:0}.panel-heading button{min-height:30px;width:30px;padding:0;box-shadow:none;border-color:#ceaf73;background:transparent;font-size:20px}
#kingdoms li{font-size:12px;padding:7px 0}#objective{font-size:11px;margin:10px 0 0}
.journal{border-top:1px solid #c5a66e;margin-top:13px;padding-top:12px}.journal h3{font-size:17px;margin:0 0 7px}.journal ol{list-style:none;margin:0;padding:0}.journal li{font-size:11px;line-height:1.4;color:#6b6246;margin:7px 0}.journal button{display:block;text-align:left;width:100%;font-size:11px;line-height:1.35;border:0;box-shadow:none;background:none;padding:4px 0;min-height:32px;font-weight:700}.journal button:hover{color:#226aa2;text-decoration:underline}.journal .loss{color:#9b402a}
.map-tools{top:100px;right:12px;gap:5px;align-items:center}.map-tools button{padding:8px 11px;font-size:12px}.map-tools output{min-width:44px;text-align:center;font-size:12px;font-weight:800;color:#3f5c35;background:#f5edcce6;border:1px solid #b9ac6e;padding:7px 4px;border-radius:7px}
.command-bar{width:min(980px,calc(100% - 24px));padding:10px 16px;bottom:30px;border-radius:17px}
.selection-row{display:flex;align-items:center;justify-content:center;gap:10px;min-height:25px}.selection-row p{font-size:15px;font-weight:800;line-height:1.4;margin:0}.selection-row button{font-size:20px;min-height:26px;height:26px;width:27px;padding:0;box-shadow:none;background:transparent;border-color:#cbaf75}
.command-bar .target-hint{font-size:12px;font-weight:600;margin:3px 0 10px;min-height:18px;color:#666344;line-height:1.45}.target-hint[data-kind='attack']{color:#8c4430}.target-hint[data-kind='friendly']{color:#226995}
.commands{gap:12px}.percentages button{font-size:18px;min-width:64px;padding:8px 12px}.percentages button::after{content:attr(data-count);display:block;font:700 10px/1.3 Nunito,sans-serif;white-space:nowrap}.percentages button.active{box-shadow:0 3px 0 #9c742e,inset 0 0 0 2px #fff0aa}
.upgrades{padding-left:12px;gap:7px}.upgrades button{font-size:17px;padding:7px 10px;min-width:105px}.upgrades small{font-size:11px;line-height:1.2}.build-icon{width:26px;height:34px;margin-right:5px}.upgrades button.pending{border-style:dashed;background:#e2ecd0}
.command-bar details{font-size:11px;margin-top:8px}.command-bar details[open]{max-height:min(48dvh,310px);overflow:auto}.command-bar summary{display:inline-block;padding:3px 12px;color:#665838}.command-bar summary:hover{color:#245f7f}.command-bar details summary:focus-visible{outline-offset:0}
.toast{bottom:calc(var(--command-height, 164px) + 43px);max-width:min(560px,85%);font-size:13px;border-radius:13px;padding:10px 16px;box-shadow:0 3px 0 #86673870}.toast[data-tone='error']{background:#fff0dd;border-color:#b36348;color:#923e29}.toast[data-tone='success']{border-color:#55814b;color:#315f37}
.kingdom-panel{scrollbar-width:thin;scrollbar-color:#be9b5c transparent}
.connection{font-weight:700;font-size:10px;padding:3px 9px;bottom:5px}.connection::before{content:'';display:inline-block;width:6px;height:6px;background:#60864a;border-radius:50%;margin-right:6px}.connection.bad::before{background:#b5672e}
.welcome{width:min(500px,calc(100% - 24px));top:calc(50% + 37px);transform:translate(-50%,-50%);max-height:calc(100dvh - 110px)}.welcome h1{font-size:35px;line-height:1.08}.welcome .full{font-size:24px}.welcome>p{font-size:14px}.welcome label{font-size:13px}.welcome .online-note{font-size:11px}h2{font-size:27px}.preferences{gap:16px}.preferences label{flex:1!important}.preferences select{font-size:13px}
@media(min-width:601px) and (max-height:800px){.welcome{padding:12px 28px}.welcome-art{height:76px}.welcome-art canvas{height:96px;width:141px;margin-top:-10px}.welcome h1{font-size:30px}.welcome>p{font-size:13px;margin-bottom:11px}.welcome label{margin-bottom:9px}.welcome input,.welcome select{min-height:38px;padding:8px}.welcome-links{margin:10px 0}.welcome .full{padding:8px}.kingdom-panel{max-height:calc(100dvh - 300px)}}
@media(min-width:601px) and (max-height:650px){.topbar{min-height:62px}.brand{font-size:27px}.brand small{font-size:14px}.crest{height:41px;width:34px;font-size:30px}.kingdom-panel,.map-tools{top:86px}.kingdom-panel{max-height:calc(100dvh - 270px)}.journal{display:none}.welcome{display:grid;grid-template-columns:160px 1fr;width:650px;column-gap:22px;text-align:left}.welcome-art{grid-column:1;grid-row:1/4;align-self:center;height:170px}.welcome-art canvas{width:200px;height:145px;max-width:none;margin-left:-25px}.welcome h1,.welcome>p,.welcome form{grid-column:2}.welcome h1{font-size:29px}.welcome>p{margin-left:0}.welcome-links,.back-link,.online-note{grid-column:1/-1;text-align:center}.welcome-links{margin:6px 0}.welcome .online-note{margin-top:5px}}
@media(max-width:1000px) and (min-width:601px){.command-bar{padding:10px}.commands{gap:7px}.percentages{gap:5px}.percentages button{min-width:50px;padding:8px}.upgrades{padding-left:8px;gap:5px}.upgrades button{min-width:80px;font-size:15px;padding:7px}.upgrades small{font-size:10px}.kingdom-panel{width:166px}.topbar{gap:18px}}
@media(max-width:600px){.topbar{margin:7px;min-height:68px;padding:7px 9px;gap:9px}.brand{font-size:24px;gap:6px}.brand small{font-size:12px}.crest{width:27px;height:35px;font-size:25px}.stat{padding-left:9px}.stat strong{font-size:24px}.stat small{font-size:9px}.top-actions button{font-size:10px;padding:6px;min-height:36px}.top-actions{gap:5px}.top-actions time{display:none}.kingdom-panel{top:88px;left:7px;width:137px;max-height:190px;padding:9px}.panel-heading h2{font-size:19px}.panel-heading button{min-height:25px;width:25px}.journal{display:none}#kingdoms li{padding:5px 0;font-size:10px}.map-tools{top:88px;right:7px;max-width:158px;gap:4px}.map-tools button{font-size:11px;padding:7px;min-width:35px;min-height:36px}.map-tools output{font-size:10px;min-width:38px}.command-bar{width:calc(100% - 14px);padding:9px;bottom:27px}.selection-row p{font-size:12px}.command-bar .target-hint{font-size:11px;margin-bottom:7px}.commands{gap:7px}.percentages button{font-size:16px;min-width:50px}.upgrades{padding:0;gap:6px}.upgrades button{min-width:75px;font-size:15px;padding:6px}.upgrades small{font-size:10px;min-height:26px}.build-icon{width:22px;height:29px}.command-bar details{margin-top:6px}.toast{font-size:12px}.welcome{max-height:calc(100dvh - 96px);top:calc(50% + 34px);padding:15px 22px}.welcome h1{font-size:31px}.welcome .online-note{font-size:10px}.preferences{flex-direction:column;gap:0}}
@media(min-width:601px) and (max-height:650px){.kingdom-panel{max-height:calc(100dvh - 300px)}.journal{display:block;margin-top:9px;padding-top:8px}.command-bar{padding:8px 12px}.command-bar .target-hint{margin-bottom:6px}.command-bar details{margin-top:4px}.percentages button{padding:6px 10px}.upgrades button{padding:5px 9px}}
.help-toggle{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:34px;padding:5px 12px;margin-top:8px;border:0;border-top:1px solid #c5a56780;border-radius:0 0 7px 7px;box-shadow:none;background:transparent;font-size:12px;color:#645a39}.help-toggle:hover,.help-toggle[aria-expanded='true']{background:#e8d49b55}.help-toggle small{font-size:10px;font-weight:600;color:#7a6e4a}#help-chevron{font-size:20px;line-height:1}.quick-help{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;text-align:left;padding:13px 8px 4px;border-top:1px solid #c5a56780;max-height:28dvh;overflow:auto;scrollbar-width:thin}.quick-help strong{font:400 18px 'Berkshire Swash',Georgia,serif}.quick-help p{font-size:12px;line-height:1.6;margin:7px 0}.quick-help kbd{font:800 11px Nunito,sans-serif;background:#fff8e4;border:1px solid #c8af78;border-radius:4px;padding:1px 4px}.hover-help{position:fixed;z-index:100;pointer-events:none;width:min(280px,calc(100vw - 16px));padding:12px 15px;border-radius:12px;box-shadow:0 4px 0 #86673860,0 5px 20px #30442a20}.hover-help strong{display:block;font:400 19px 'Berkshire Swash',Georgia,serif;margin-bottom:5px}.hover-help span{display:block;font-size:12px;line-height:1.5;white-space:pre-line}.stat[data-help]{cursor:help}
@media(max-width:600px){.quick-help{grid-template-columns:1fr;gap:9px;max-height:25dvh;padding:10px 6px}.quick-help p{margin:4px 0}.help-toggle{margin-top:6px;gap:8px}.hover-help{font-size:12px;width:250px}}