:root { font-family: Inter, "Microsoft YaHei", sans-serif; color:#182321; background:#eff2ed; font-synthesis:none; } * { box-sizing:border-box; } body { margin:0; } button,input,textarea { font:inherit; } button { border:0; border-radius:4px; background:#17633f; color:#fff; cursor:pointer; padding:10px 14px; font-weight:700; } button:hover { background:#0e4c2e; } button:disabled { opacity:.6; cursor:wait; }
.shell { max-width:1180px; margin:0 auto; padding:0 28px 72px; }.topbar { min-height:72px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #cad3cb; }.brand { color:#17633f; font-size:24px; font-weight:800; text-decoration:none; }.brand span { color:#5d6964; font-size:11px; margin-left:8px; }.brand .brand-name { color:#17633f; font-size:inherit; margin-left:0; }.account-summary,#account-summary { display:flex; align-items:center; gap:12px; font-size:14px; }.language-picker { display:flex; align-items:center; gap:6px; color:#476056; font-size:13px; }.language-picker select { border:1px solid #aebcb1; border-radius:3px; padding:5px 7px; color:#264f37; background:#fff; }.quiet-button { background:#e1e8e2; color:#264f37; padding:7px 10px; }.notice { margin:20px 0; padding:12px 14px; border-left:4px solid #b8453f; background:#f8ddda; color:#7d2c27; }.notice.success { border-left-color:#287a4f; background:#d9eee0; color:#185333; }.auth-grid,.admin-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:64px; }.tool-panel { border:1px solid #c5d0c6; background:#fbfcfa; padding:22px; }.tool-panel h1,.tool-panel h2,.tool-panel h3 { margin:0 0 16px; letter-spacing:0; }.tool-panel label { display:grid; gap:7px; margin:13px 0; color:#40514a; font-size:14px; font-weight:700; }.tool-panel input,.tool-panel textarea { width:100%; border:1px solid #aebcb1; border-radius:3px; padding:10px; color:#17231f; background:#fff; }.tool-panel textarea { min-height:90px; resize:vertical; }.muted { color:#63706a; font-size:13px; line-height:1.6; }.eyebrow { margin:0 0 8px; color:#3c7758; font-size:12px; font-weight:800; text-transform:uppercase; }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; padding:48px 0 22px; border-bottom:1px solid #cad3cb; }.section-heading h1 { margin:0; font-size:38px; letter-spacing:0; }.section-heading h2 { margin:0; font-size:24px; letter-spacing:0; }.lead { margin:10px 0 0; color:#57645f; }.map-link { color:#17633f; font-weight:700; }.mode-switch { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:18px 0; }.mode-switch button { background:#e1e8e2; color:#264f37; }.mode-switch button.selected { background:#17633f; color:#fff; }.mode-switch span { color:#63706a; font-size:13px; margin-left:8px; }.game-layout { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(300px,.8fr); gap:20px; margin-top:2px; }.image-wrap { min-height:340px; display:grid; place-items:center; overflow:hidden; border:1px solid #c5d0c6; background:#e0e7e0; color:#617067; }.image-wrap img { display:block; width:100%; max-height:620px; object-fit:contain; }.answer-panel { align-self:start; }.leaderboard-panel { align-self:start; }.leaderboard-list { margin:0; padding-left:22px; }.leaderboard-list li { display:flex; justify-content:space-between; gap:10px; padding:6px 0; border-bottom:1px solid #e0e5e0; }.contribution-panel,.review-panel { margin-top:20px; }.coordinate-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.table-panel { overflow:hidden; }.table-scroll { overflow:auto; } table { width:100%; border-collapse:collapse; font-size:13px; } th,td { padding:10px; text-align:left; white-space:nowrap; border-bottom:1px solid #dce3dd; } th { color:#476056; font-size:12px; } #answer-status { min-height:22px; margin:12px 0 0; }.review-actions { display:flex; gap:6px; }.review-actions button { padding:6px 9px; }.reject-button { background:#9b3f37; }.reject-button:hover { background:#7f2e28; }
.auth-view { width:min(460px,100%); margin:64px auto 0; }.auth-tabs { display:flex; gap:8px; margin-bottom:14px; }.auth-tabs button { background:#e1e8e2; color:#264f37; }.auth-tabs button.selected { background:#17633f; color:#fff; }
.map-frame { display:block; width:100%; height:280px; margin:14px 0; border:1px solid #c5d0c6; }
.leaderboard-group-title { margin-top:14px; color:#17633f; font-weight:700; }
.pending-item { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px solid #dce3dd; }
.game-layout { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }.image-wrap,.map-wrap { min-height:420px; overflow:hidden; border:1px solid #c5d0c6; background:#e0e7e0; }.map-wrap .map-frame { width:100%; height:100%; min-height:420px; margin:0; border:0; }.answer-panel,.leaderboard-panel { grid-column:1 / -1; }
.image-wrap img { cursor:zoom-in; }.image-preview { width:min(1100px,calc(100vw - 32px)); max-width:none; max-height:calc(100vh - 32px); padding:0; border:0; background:transparent; overflow:visible; }.image-preview::backdrop { background:rgba(0,0,0,.82); }.image-preview img { display:block; max-width:100%; max-height:calc(100vh - 32px); object-fit:contain; }.image-preview button { position:absolute; top:10px; right:10px; width:36px; height:36px; padding:0; border:1px solid rgba(255,255,255,.5); background:rgba(0,0,0,.6); color:#fff; font-size:24px; line-height:1; }
@media (max-width:760px) { .shell { padding:0 16px 48px; }.auth-grid,.admin-grid,.game-layout { grid-template-columns:1fr; }.section-heading h1 { font-size:30px; }.section-heading { align-items:start; flex-direction:column; }.image-wrap { min-height:250px; } }