#main-menu{color:#000;grid-template:".name"1fr".menu"minmax(auto,61.8%)/1fr minmax(auto,76.4%);gap:4rcap 0;display:grid;& h1{grid-area:name;align-self:end;font-size:400%;font-weight:900;line-height:1.125cap}& menu{max-width:max-content;transform-style:preserve-3d;perspective:26rcap;pointer-events:none;grid-area:menu;align-self:start;gap:2rcap;display:grid;& li{pointer-events:all;--index:0;transform:rotateY(.09turn) rotateZ(calc((var(--index) - 2.5) * .034turn)) rotateX(calc((var(--index) - 2.5) * .034turn));transform-origin:0;&:first-child{--index:1}&:nth-child(2){--index:2}&:nth-child(3){--index:3}&:nth-child(4){--index:4}}& a,& button{--underline-thickness:.09em;text-decoration:underline;text-decoration-thickness:var(--underline-thickness);text-underline-offset:var(--underline-thickness);cursor:pointer;font-size:300%;font-weight:800;line-height:1cap;display:block}}}.area-and-party summary::marker{content:none!important;list-style-type:none!important;display:none!important}#overlay{--outer-padding-x:calc(.75vmin + .75vmax);--outer-padding-y:calc(var(--outer-padding-x) * 1);user-select:none;padding:var(--outer-padding-y) var(--outer-padding-x);visibility:hidden;grid-template:"details details details details"1fr"menu. .redo""camera.undo action"/auto 1fr auto auto;align-items:end;gap:1.25rcap;display:grid;&,& *{touch-action:none}&>*{visibility:visible;isolation:isolate}& button{cursor:pointer}& #details{--contrast:.125;user-select:text;border:1px solid;border-radius:2px;grid-area:details/details/details/-1;place-self:start;padding:1.5rcap 2rcap}& .menu{--border-radius:.75rcap;border-radius:var(--border-radius);justify-self:center;@supports (corner-shape:superellipse(2)){border-radius:calc(var(--border-radius) * 2);corner-shape:superellipse(2)}border:1px solid;grid-area:menu;width:max-content;text-decoration:none;& .icon{grid-column:2;width:3.5rcap;height:2.5rcap;position:relative;& span{transform:translate(-50%, -50%) var(--transform);grid-area:1/1/1/1;font-size:175%;font-weight:100;line-height:1;position:absolute;top:50%;left:50%;&:first-child{--transform:translate(27.5%, -35%) rotate(90deg)}&:nth-child(2){--transform:translate(-27.5%, 0%) rotate(-90deg)}&:nth-child(3){--transform:translate(27.5%, 35%) rotate(90deg)}}}}& .camera-orb{cursor:grab;border:1px solid;border-radius:50%;grid-area:camera;width:9rcap;height:9rcap;position:relative;&:after,&:before{border-radius:inherit;position:absolute;transform:scaleY(.57735)rotate(210deg)}&:after{content:"†";border:1px solid;align-content:end;font-weight:750;display:grid;inset:0}&:before{content:"";border:1px solid;inset:2cap}}& .undo,& .redo{--border-radius:.75rcap;border-radius:var(--border-radius);text-align:center;@supports (corner-shape:superellipse(2)){border-radius:calc(var(--border-radius) * 2);corner-shape:superellipse(2)}border:1px solid;min-width:max-content;padding:.75rcap;font-weight:550;transition-property:backdrop-filter,transform}& .undo{grid-area:undo;align-self:center;&:disabled{transform:translate(2rcap)scale(0)}}& .redo{grid-area:redo;justify-self:center;&:disabled{transform:translateY(2rcap)scale(0)}}& .turn-action{grid-area:action;place-content:center;width:9rcap;height:9rcap;padding:1rcap;display:grid;position:relative;&:after{--gap:30%;pointer-events:none;content:"";clip-path:polygon(var(--gap) 0%, 50% 50%, calc(100% - var(--gap)) 0%, 100% 0%, 100% 100%, 0% 100%, 0% 0%);border:1px solid;border-radius:50%;display:block;position:absolute;inset:0}&>strong{text-align:center;font-variant-numeric:lining-nums;font-size:175%;font-weight:700;line-height:1cap;position:absolute;top:-.5rcap;left:0;right:0}&.end strong{display:grid;& span{transform-origin:50% 70%;grid-area:1/1/1/1;display:block;rotate:.11turn}& span+span{rotate:-.11turn}}&.view-map strong{transform:translate(-4%)scaleX(-1)rotate(133deg)}&>span{text-align:center;grid-area:1/2;font-size:150%;font-weight:300;line-height:1.25cap}&.end,&.view-map,&.view-board{&>strong{font-weight:300}}}}