#civic-board{width:min(960px,calc(100% - 24px));max-width:960px;padding:24px;max-height:90dvh;overflow:auto;background:#f9f4e5}
.civic-heading{display:flex;align-items:start;justify-content:space-between;gap:15px}.civic-heading h2{margin:0 0 6px}.civic-heading p{margin:0;font-size:13px}.civic-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(230px,1fr);gap:22px;margin-top:20px;align-items:start}
.civic-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(5,minmax(68px,1fr));aspect-ratio:1;border:2px solid #365244;background:#e0e7cf;gap:2px;border-radius:10px;overflow:hidden}
.civic-space{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:5px 3px;background:#fffaf0;min-width:0;text-align:center;font-size:10px;line-height:1.15;border-top:6px solid #8bb3a2}.civic-space>span:first-child{font-size:20px}.civic-space.chance{border-color:#d4b052}.civic-space.jail,.civic-space.court{border-color:#a46552}.civic-space.community{border-color:#8a9e50}.civic-space.occupied{background:#f8db8b;box-shadow:inset 0 0 0 3px #715d2e}.mayor-token{position:absolute;font-size:31px;font-style:normal;right:2px;bottom:0;color:#294c42;text-shadow:1px 1px #fff;animation:mayor-arrive .3s ease-out}
.civic-center{grid-area:2/2/5/5;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;text-align:center;padding:12px}.civic-center>strong{font:600 clamp(19px,3vw,31px) Fraunces,Georgia,serif}.civic-center>span,.civic-center small{font-size:11px;line-height:1.3}.civic-dice{display:flex;gap:12px;font-size:52px;line-height:1;color:#304f43}.civic-center>b{font-size:12px}.civic-card{background:#fffaf1;border:1px solid #c4b58e;border-radius:12px;padding:18px;box-shadow:3px 4px 0 #d9d0b7}.civic-card h3{font:600 23px Fraunces,Georgia,serif;margin:0 0 12px}.civic-card p{font-size:14px;line-height:1.55}.civic-card h3:focus{outline:none}
#civic-choices,#civic-actions{display:grid;gap:8px}#civic-choices button,#civic-actions button{padding:12px;border:1px solid #a79c7b;border-radius:8px;background:#edf0df;text-align:left;font-weight:600}#civic-choices small,#civic-actions small{display:block;margin-top:5px;line-height:1.4;font-size:11px;font-weight:400}#civic-actions button[data-civic=roll]{background:#305443;color:#fff9e8}#civic-actions button:disabled,#civic-choices button:disabled{opacity:.55}.civic-sources{font-size:12px;line-height:1.6;margin-top:20px;border-top:1px solid #d4c9b1;padding-top:14px}.civic-sources summary{cursor:pointer;font-weight:600}.civic-sources p{font-size:12px}.civic-sources a{text-decoration:underline}#civic-feedback{font-size:12px;line-height:1.5;margin-bottom:0}
@keyframes mayor-arrive{from{transform:translateY(-10px) scale(.75);opacity:.3}to{transform:none;opacity:1}}
@media(max-width:700px){#civic-board{padding:15px}.civic-layout{grid-template-columns:1fr;gap:14px}.civic-grid{grid-template-rows:repeat(5,minmax(56px,1fr))}.civic-space{font-size:9px}.civic-center{gap:7px}.civic-dice{font-size:43px}.civic-card{padding:15px}.civic-heading p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.mayor-token{animation:none}}

.civic-space .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
