body.hosting{margin:0;overflow:hidden}body.hosting>header{display:none}.hosting #app{max-width:none;margin:0;padding:0;position:fixed;inset:0}.monitor{position:absolute;top:50%;left:50%;width:1280px;height:680px;transform:translate(-50%,-50%) scale(var(--monitor-scale,1));display:grid;grid-template-rows:80px minmax(0,1fr) 66px;gap:12px;padding:14px 20px;box-sizing:border-box}.monitor-head,.monitor-foot{display:flex;align-items:center;justify-content:space-between;gap:12px}.monitor-head h1{font-size:38px;margin:0}.monitor .quiet{margin:0}.monitor-grid{display:grid;grid-template-columns:320px minmax(0,1fr) 248px;gap:12px;min-height:0}.monitor-grid>section{min-width:0;border-radius:14px;background:#102f3c;border:1px solid #345462;padding:16px}.monitor h2{font-size:26px;margin:0 0 13px}.monitor .q{font-size:38px;min-height:105px;line-height:1.2}.monitor .work{font-size:23px}.monitor .ans{min-height:61px;font-size:24px}.monitor .rank{padding:6px 0;gap:6px;font-size:15px;height:39px}.monitor .rank>span:nth-child(2){min-width:0;overflow-wrap:anywhere;line-height:1}.monitor .rank strong{white-space:nowrap}.monitor .dot{flex-shrink:0}.monitor .ocean{display:flex;align-items:center;justify-content:center;min-height:0;flex:1;padding:3px}.monitor .ocean svg{height:100%;width:100%;max-height:none}.monitor-map{display:flex;flex-direction:column;min-height:0}.monitor-map .stats{flex:none}.monitor .legend{margin-top:9px;color:#b9d0ce}.monitor .intro{font-size:22px;padding-left:25px}.intro li{margin-bottom:17px}.room-code{font:700 50px Georgia;color:#ffd491}.turn-name{font-size:32px;overflow-wrap:anywhere}.queue{display:grid;gap:5px;grid-template-columns:repeat(2,minmax(0,1fr));overflow-wrap:anywhere}.monitor-foot{border-top:1px solid #345462}.monitor-foot span:first-child{flex:1}.monitor-foot button{white-space:nowrap}#match-info{background:#102f3c;color:#fff7df;border:1px solid #65828a;border-radius:12px;max-width:680px;max-height:80vh}#match-info::backdrop{background:#02151ed4}#match-info form{float:right}.mobile-targets{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}.mobile-targets button{padding:8px;font-size:.9rem}@media(min-width:761px) and (max-height:800px){body:not(.hosting) main{padding-top:12px}body:not(.hosting) .card{padding:14px;margin-bottom:8px}body:not(.hosting) label{margin-top:4px}}
.tile.neutral text{fill:#f3f7f7}.tile.owned text{font-weight:900}