:root {
  color-scheme: light;
  --ink: #142331; --night: #0e1720; --night-2: #15232e; --steel: #e9eef1;
  --line: #b9c8d1; --muted: #637786; --amber: #e9a936; --amber-2: #ffcc66;
  --blue: #7fa9c2; --paper: #f5f7f8; --white: #fff; --danger: #b34f4b;
  --outer: #617c5a; --inner: #77736a; --cell: 25px; --zoom: 1;
  font-family: "Segoe UI", Arial, sans-serif; background: #dfe6ea; color: var(--ink);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { min-width: 320px; min-height: 100%; margin: 0; }
body { overflow: hidden; background: #dfe6ea; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 3px solid var(--amber-2); outline-offset: 2px; }
.skip-link { position: fixed; left: 12px; top: -60px; z-index: 200; padding: 10px 14px; color: var(--night); background: var(--amber-2); font-weight: 800; }
.skip-link:focus { top: 10px; }
.topbar { height: 68px; display: grid; grid-template-columns: minmax(260px, 1fr) auto minmax(220px, 1fr); align-items: center; gap: 18px; padding: 0 20px; color: #edf3f6; background: linear-gradient(180deg, #172733, var(--night)); border-bottom: 3px solid var(--amber); box-shadow: 0 6px 18px rgb(14 23 32 / 25%); position: relative; z-index: 30; }
.brand { display: flex; align-items: center; gap: 11px; min-width: 0; }
.brand-mark { width: 40px; height: 43px; display: grid; place-items: center; color: #39270e; background: linear-gradient(145deg, #ffd477, #d58c25); clip-path: polygon(8% 0,92% 0,92% 72%,50% 100%,8% 72%); font-size: 1.45rem; filter: drop-shadow(0 2px 2px #0007); }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 1.02rem; letter-spacing: .01em; }
.brand small { margin-top: 2px; color: #9fb0bc; font-size: .72rem; }
.week-controls, .account-controls { display: flex; align-items: center; gap: 9px; }
.account-controls { justify-self: end; }
.compact-field { display: flex; align-items: center; gap: 8px; color: #a9b7c0; font-size: .76rem; font-weight: 700; }
.compact-field select { min-height: 36px; padding: 6px 28px 6px 9px; color: #eef4f7; background: var(--night-2); border: 1px solid #425767; border-radius: 3px; }
.status-badge { padding: 5px 9px; color: #ffd278; background: #43351e; border: 1px solid #725729; border-radius: 2px; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.status-badge.published { color: #b8ddca; background: #19382d; border-color: #396651; }
.save-state { color: #9fb0bc; font-size: .74rem; white-space: nowrap; }
.save-state.dirty { color: #ffd278; }.save-state.saved { color: #9ed1b7; }
.button, .icon-button, .tool-button, .dialog-close { border: 0; border-radius: 3px; cursor: pointer; transition: background .12s ease, border-color .12s ease, transform .12s ease; }
.button:active, .icon-button:active, .tool-button:active { transform: translateY(1px); }
.button { min-height: 36px; padding: 7px 12px; font-size: .78rem; font-weight: 750; }
.button.primary { color: #fff; background: #315f78; border: 1px solid #477d98; }
.button.secondary { color: #f5f7f8; background: #294457; border: 1px solid #496579; }
.button.ghost { color: inherit; background: transparent; border: 1px solid currentColor; opacity: .86; }
.button.gold { color: #36250d; background: linear-gradient(#ffd16c, var(--amber)); border: 1px solid #d28a22; }
.button.danger-button { color: #fff; background: var(--danger); }
.button:hover { filter: brightness(1.07); }.button:disabled { opacity: .4; cursor: not-allowed; filter: none; }
.icon-button { width: 32px; height: 32px; display: grid; place-items: center; color: #edf3f6; background: #294457; border: 1px solid #496579; }
.workspace { height: calc(100vh - 68px); display: grid; grid-template-columns: 292px minmax(620px, 1fr); min-height: 0; }
.alliance-panel { min-height: 0; display: grid; grid-template-rows: auto auto 1fr auto; padding: 16px 13px 12px; background: var(--paper); border-right: 1px solid #9eafb9; box-shadow: 5px 0 18px rgb(40 57 68 / 10%); z-index: 5; }
.panel-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.panel-heading h1, .dialog-heading h2 { margin: 2px 0 0; font-size: 1.16rem; line-height: 1.2; }
.eyebrow { margin: 0; color: #9c681d; font-size: .63rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.alliance-caption { display: flex; justify-content: space-between; gap: 10px; padding: 0 2px 8px; color: var(--muted); font-size: .68rem; }
.alliance-caption strong { color: var(--ink); }
.alliance-list { min-height: 0; overflow-y: auto; display: grid; align-content: start; gap: 5px; padding-right: 4px; scrollbar-width: thin; }
.alliance-item { position: relative; width: 100%; min-height: 54px; display: grid; grid-template-columns: 30px 10px 1fr 42px; gap: 8px; align-items: center; padding: 6px 7px; text-align: left; color: var(--ink); background: #fff; border: 1px solid #cfdae0; border-radius: 3px; cursor: pointer; }
.alliance-item:hover { border-color: #8da4b1; background: #f8fafb; }
.alliance-item.active { border-color: var(--alliance-color); box-shadow: inset 3px 0 var(--alliance-color); }
.alliance-rank { color: #536773; text-align: center; font-size: .85rem; font-weight: 850; }
.alliance-flag { width: 10px; height: 32px; background: var(--alliance-color); clip-path: polygon(0 0,100% 0,100% 75%,50% 100%,0 75%); }
.alliance-copy { min-width: 0; }
.alliance-copy strong, .alliance-copy small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.alliance-copy strong { font-size: .78rem; }.alliance-copy small { margin-top: 3px; color: var(--muted); font-size: .65rem; }
.alliance-stats { text-align: right; }.alliance-stats strong, .alliance-stats small { display: block; }.alliance-stats strong { font-size: .73rem; }.alliance-stats small { color: var(--muted); font-size: .61rem; margin-top: 3px; }
.alliance-edit { position: absolute; z-index: 2; right: 2px; top: 1px; width: 22px; height: 22px; padding: 0; color: var(--muted); background: #fff; border: 0; cursor: pointer; }
.map-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; padding-top: 10px; margin-top: 8px; border-top: 1px solid #cbd6dc; }
.map-summary div { padding: 7px; background: #e8eef1; border-radius: 2px; }.map-summary span, .map-summary strong { display: block; }.map-summary span { color: var(--muted); font-size: .61rem; }.map-summary strong { margin-top: 2px; font-size: .93rem; }
.map-stage { min-width: 0; min-height: 0; display: grid; grid-template-rows: auto auto 1fr auto; background: #cbd4d9; }
.commandbar { min-height: 53px; display: flex; align-items: center; gap: 12px; padding: 8px 12px; background: #eef2f4; border-bottom: 1px solid #adbdc6; }
.tool-group { display: flex; padding: 3px; background: #dce4e8; border: 1px solid #bdcbd2; border-radius: 3px; }
.tool-button { min-height: 32px; padding: 5px 9px; color: #526775; background: transparent; font-size: .72rem; font-weight: 750; }
.tool-button span { margin-right: 3px; }.tool-button.active { color: #fff; background: #315f78; }
.selected-alliance { min-width: 0; display: flex; align-items: center; gap: 7px; color: #506571; font-size: .73rem; font-weight: 700; }
.selected-alliance i, .popup-alliance i { flex: 0 0 auto; width: 10px; height: 22px; background: var(--alliance-color, #8797a0); clip-path: polygon(0 0,100% 0,100% 76%,50% 100%,0 76%); }
.selected-alliance span { max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.command-actions { position: relative; display: flex; gap: 7px; margin-left: auto; }
.action-menu { position: absolute; right: 0; top: calc(100% + 7px); z-index: 40; width: 200px; padding: 5px; background: #fff; border: 1px solid #aebdc6; box-shadow: 0 12px 30px rgb(31 48 59 / 22%); }
.action-menu button { width: 100%; padding: 9px 10px; text-align: left; background: transparent; border: 0; cursor: pointer; font-size: .75rem; }.action-menu button:hover { background: #e9eff2; }
.map-subbar { min-height: 35px; display: flex; align-items: center; gap: 12px; padding: 5px 12px; color: #647985; background: #e2e8eb; border-bottom: 1px solid #b4c2ca; }
.map-subbar p { margin: 0; flex: 1; font-size: .68rem; }
.zoom-controls { display: flex; align-items: center; gap: 7px; font-size: .68rem; }.zoom-controls .icon-button { width: 27px; height: 27px; color: var(--ink); background: #f6f8f9; border-color: #aebdc6; }
.map-scroll { min-height: 0; overflow: auto; padding: 28px; background: linear-gradient(135deg,#c7d1d6,#adbcc4); }
.map-board { width: calc(45 * var(--cell)); height: calc(45 * var(--cell)); position: relative; margin: auto; transform: scale(var(--zoom)); transform-origin: top left; box-shadow: 0 18px 42px rgb(37 49 56 / 32%), 0 0 0 5px #785d37, 0 0 0 7px #283640; }
.map-grid { display: grid; grid-template-columns: repeat(45,var(--cell)); grid-template-rows: repeat(45,var(--cell)); touch-action: none; user-select: none; }
.map-cell { position: relative; min-width: 0; padding: 0; overflow: hidden; color: #fff; background: var(--inner); border: 1px solid rgb(255 255 255 / 13%); cursor: crosshair; }
.map-cell.outer { background: var(--outer); }.map-cell.inner { background: #77736a; }.map-cell:nth-child(odd).inner { background: #736f67; }.map-cell:nth-child(odd).outer { background: #5d7757; }
.map-cell:hover { z-index: 3; box-shadow: inset 0 0 0 2px var(--amber-2); filter: brightness(1.12); }
.map-cell.occupied { background: color-mix(in srgb, var(--alliance-color) 78%, #28343a); }
.map-cell.blocked { background: #75534a; border-color: #8b665c; cursor: not-allowed; }.map-cell.blocked:hover { box-shadow: none; filter: none; }
.map-cell.selection-preview { z-index: 4; box-shadow: inset 0 0 0 2px #ffe079; filter: brightness(1.18); }
.cell-tag { position: absolute; inset: 2px 1px auto; font-size: 7px; font-weight: 900; line-height: 1; text-shadow: 0 1px 2px #000; white-space: nowrap; overflow: hidden; }
.cell-player { position: absolute; inset: auto 1px 2px; font-size: 6px; font-weight: 750; line-height: 1; text-shadow: 0 1px 2px #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.castle-zone { position: absolute; left: calc(19 * var(--cell)); top: calc(19 * var(--cell)); width: calc(7 * var(--cell)); height: calc(7 * var(--cell)); pointer-events: none; display: grid; grid-template: 1fr 1.4fr 1fr / 1fr 2fr 1fr; place-items: center; border: 2px solid #cf8b52; box-shadow: inset 0 0 30px #3d1f1988; }
.castle-name { grid-area: 2/1/3/4; color: #ffe1a4; text-align: center; text-transform: uppercase; font-size: .64rem; font-weight: 900; text-shadow: 0 2px 3px #2b1510; }.tower { color: #edc897; font-size: 1.05rem; text-shadow: 0 2px 3px #2b1510; }.tower.nw{grid-area:1/1}.tower.ne{grid-area:1/3}.tower.sw{grid-area:3/1}.tower.se{grid-area:3/3}
.map-legend { min-height: 37px; display: flex; align-items: center; gap: 17px; padding: 7px 13px; color: #526773; background: #eef2f4; border-top: 1px solid #aebdc6; font-size: .67rem; }.map-legend span { display: inline-flex; align-items: center; gap: 6px; }.legend-tile { width: 12px; height: 12px; border: 1px solid #657984; }.legend-tile.outer{background:var(--outer)}.legend-tile.inner{background:var(--inner)}.legend-tile.blocked{background:#75534a}
.dialog { width: min(650px,calc(100vw - 28px)); max-height: calc(100vh - 30px); padding: 0; overflow: auto; overscroll-behavior: contain; color: var(--ink); background: var(--paper); border: 1px solid #93a7b3; border-radius: 4px; box-shadow: 0 24px 80px #0e172066; }.dialog::backdrop { background: #0e1720aa; backdrop-filter: blur(2px); }.small-dialog{width:min(470px,calc(100vw - 28px))}.wide-dialog{width:min(760px,calc(100vw - 28px))}
.dialog form { display: grid; gap: 16px; padding: 20px; }.dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; padding-bottom: 12px; border-bottom: 1px solid #cfdae0; }.dialog-close { width: 30px; height: 30px; color: #5c707c; background: #e5ecef; font-size: 1.2rem; }
.dialog-intro { margin: -4px 0 0; color: var(--muted); font-size: .79rem; line-height: 1.5; }
.auto-steps { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.auto-step { min-height: 54px; display: grid; grid-template-columns: 28px 1fr; grid-template-rows: 1fr 1fr; column-gap: 8px; padding: 8px 10px; text-align: left; color: #5c707c; background: #e3eaed; border: 1px solid #c2d0d6; border-radius: 3px; cursor: pointer; }
.auto-step > span { grid-row: 1 / 3; width: 28px; height: 28px; align-self: center; display: grid; place-items: center; color: #fff; background: #8095a1; border-radius: 50%; font-weight: 850; }
.auto-step strong { align-self: end; font-size: .78rem; }.auto-step small { color: var(--muted); font-size: .65rem; }
.auto-step.active { color: #fff; background: #294457; border-color: #294457; }.auto-step.active > span { color: #39270e; background: var(--amber-2); }.auto-step.active small { color: #bfd0da; }
.field { display: grid; gap: 6px; color: #536773; font-size: .75rem; font-weight: 700; }.field input,.field select,.field textarea { width: 100%; min-height: 39px; padding: 8px 10px; color: var(--ink); background: #fff; border: 1px solid #aebfc8; border-radius: 3px; }.field textarea { resize: vertical; line-height: 1.45; }.color-field input { padding: 3px; }
.form-row { display: grid; grid-template-columns: 1fr 110px 72px; gap: 10px; align-items: end; }.form-note { margin: 0; color: var(--muted); font-size: .73rem; line-height: 1.45; }.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 3px; }.dialog-spacer { flex: 1; }
.popup-alliance { display: flex; align-items: center; gap: 10px; padding: 10px; background: #e7edf0; border: 1px solid #c5d1d7; font-size: .82rem; font-weight: 800; }
.auto-table-head,.auto-row { display: grid; grid-template-columns: 1fr 100px 110px; gap: 10px; align-items: center; }.auto-table-head { padding: 0 9px; color: var(--muted); font-size: .65rem; font-weight: 800; text-transform: uppercase; }.auto-list { max-height: 47vh; overflow-y: auto; display: grid; gap: 4px; }.auto-row { padding: 7px 9px; background: #e8eef1; border: 1px solid #d1dce1; }.auto-name { min-width: 0; display: flex; align-items: center; gap: 8px; font-size: .76rem; font-weight: 750; }.auto-name i { width: 8px; height: 24px; flex: 0 0 auto; background: var(--alliance-color); }.auto-name span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }.auto-row input { width: 100%; min-height: 32px; padding: 5px 7px; border: 1px solid #aebfc8; border-radius: 2px; }.capacity-line { display: flex; justify-content: space-between; padding: 10px; background: #172733; color: #ced9df; font-size: .78rem; }.capacity-line strong { color: var(--amber-2); }
.segmented { display: grid; grid-template-columns: 1fr 1fr; padding: 3px; background: #dfe7ea; }.segment { padding: 8px; color: #536773; background: transparent; border: 0; cursor: pointer; font-weight: 750; }.segment.active { color: #fff; background: #315f78; }.invite-result { display:grid;grid-template-columns:1fr auto;gap:7px}.invite-result input{min-width:0;padding:8px;border:1px solid #aebfc8}.check-field{display:flex;align-items:center;gap:8px;font-size:.78rem}.check-field input{width:17px;height:17px;accent-color:#315f78}
.toast-region { position: fixed; right: 16px; bottom: 16px; z-index: 100; width: min(360px,calc(100vw - 32px)); display: grid; gap: 7px; }.toast { padding: 11px 13px; color: #f5f7f8; background: #203542; border-left: 4px solid var(--amber); box-shadow: 0 9px 25px #0e172055; font-size: .78rem; }.toast.error{background:#672f31;border-color:#ef8178}
body:not(.can-edit) .edit-only,body:not(.is-admin) .admin-only{display:none!important}body.can-edit .view-only{display:none!important}
@media(max-width:900px){body{overflow:auto}.topbar{height:auto;min-height:65px;grid-template-columns:1fr auto;padding:8px 11px}.brand small,.save-state,#new-week-button{display:none}.week-controls{grid-area:2/1/3/3}.workspace{height:auto;display:block}.alliance-panel{height:290px}.alliance-list{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.map-stage{height:calc(100vh - 110px);min-height:560px}.commandbar{flex-wrap:wrap}.command-actions{margin-left:0}.selected-alliance{margin-left:auto}.map-scroll{padding:18px}.map-legend{flex-wrap:wrap}}
@media(max-width:580px){.brand strong{font-size:.88rem}.account-controls{justify-self:end}.week-controls .status-badge{display:none}.commandbar{align-items:stretch}.tool-group{width:100%;overflow-x:auto}.tool-button{flex:1;white-space:nowrap}.selected-alliance{margin-left:0;flex:1}.command-actions{width:100%}.command-actions .button{flex:1}.map-subbar p{display:none}.form-row{grid-template-columns:1fr 90px}.color-field{grid-column:1/3}.auto-table-head,.auto-row{grid-template-columns:1fr 75px 85px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}