:root { color-scheme: light; --bg:#fff7e8; --card:#fffdf8; --line:#e7b36a; --text:#2f2418; --muted:#7d6040; --brand:#f28c28; --brand2:#ffb347; --dark:#4a2d13; --soft:#fff4dc; --shadow:0 14px 30px rgba(74,45,19,.09); }
* { box-sizing: border-box; }
[hidden] { display:none !important; }
body { margin:0; font-family: Arial, "Microsoft YaHei", sans-serif; background: linear-gradient(135deg, rgba(255,179,71,.22) 25%, transparent 25%) 0 0/32px 32px, linear-gradient(225deg, rgba(255,179,71,.18) 25%, transparent 25%) 0 0/32px 32px, var(--bg); color:var(--text); }
a { color:var(--dark); text-decoration:none; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:18px 6vw; border-bottom:4px solid var(--dark); background:rgba(255,253,248,.94); backdrop-filter: blur(12px); position:sticky; top:0; z-index:10; box-shadow:0 8px 0 rgba(74,45,19,.08); }
.brand { font-weight:900; color:var(--brand); text-shadow:2px 2px 0 #ffe0a8; display:flex; align-items:center; min-height:38px; }
.brand img { max-height:42px; max-width:260px; display:block; }
nav { display:flex; gap:18px; }
.top-actions { margin-left:auto; }
.login-link { display:inline-block; padding:10px 18px; border:3px solid var(--dark); background:linear-gradient(180deg, var(--brand2), var(--brand)); color:#fff; font-weight:900; box-shadow:4px 4px 0 rgba(74,45,19,.22); }
.header-right-logo { max-height:42px; max-width:180px; object-fit:contain; }
.container { width:min(1120px, 92vw); margin:40px auto; }
.page-admin { width:min(1280px, 94vw); margin:26px auto 40px; }
.hero { padding:54px 0 36px; position:relative; min-height:210px; }
.hero-logo { position:absolute; right:2vw; top:24px; width:132px; height:132px; object-fit:contain; border:5px solid var(--dark); box-shadow:12px 12px 0 rgba(74,45,19,.18); background:#fffdf8; }
.hero-logo-block { display:block; background:linear-gradient(#75b843 0 28%, #8b5a2b 28%); image-rendering:pixelated; }
.eyebrow { color:var(--brand); letter-spacing:.12em; text-transform:uppercase; font-weight:900; }
h1 { font-size:clamp(32px, 5vw, 60px); margin:8px 0 12px; max-width:820px; line-height:1.05; color:var(--dark); text-shadow:3px 3px 0 #ffd28a; }
h2 { margin-top:0; }
.hero p { max-width:720px; color:var(--muted); font-size:18px; line-height:1.8; }
.card { background:rgba(255,253,248,.96); border:4px solid var(--dark); border-radius:0; padding:24px; margin-bottom:24px; box-shadow:10px 10px 0 rgba(242,140,40,.24); }
.small { max-width:460px; margin:40px auto; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
label { display:block; color:var(--muted); margin:14px 0; }
input, select, textarea { width:100%; margin-top:7px; padding:12px 14px; border-radius:0; border:3px solid var(--dark); background:#fff; color:var(--text); outline:none; }
input:focus, select:focus, textarea:focus { box-shadow:0 0 0 4px #ffd28a; }
textarea { resize:vertical; font-family:inherit; }
button, .button { border:3px solid var(--dark); border-radius:0; padding:12px 16px; color:white; background:linear-gradient(180deg, var(--brand2), var(--brand)); cursor:pointer; display:inline-block; font-weight:800; box-shadow:4px 4px 0 rgba(74,45,19,.22); }
button:hover, .button:hover { transform:translateY(-1px); }
.actions, .split, .inline-form { display:flex; gap:12px; align-items:center; justify-content:space-between; }
.inline-form { justify-content:flex-start; }
.result { color:var(--brand); min-height:22px; }
.notice { color:var(--muted); line-height:1.8; }
.status-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin-top:18px; }
.status-grid span { padding:14px; border:3px solid var(--dark); border-radius:0; background:#fff4d8; }
table { width:100%; border-collapse:collapse; margin-top:16px; }
th, td { text-align:left; border-bottom:1px solid var(--line); padding:12px; }
.admin-shell { padding:26px 28px; border-width:3px; box-shadow:var(--shadow); background:linear-gradient(180deg, rgba(255,253,248,.98), rgba(255,247,232,.96)); }
.admin-shell .split { align-items:flex-start; }
.admin-shell h1 { margin:0; font-size:42px; }
.admin-shell .eyebrow { margin:0 0 10px; }
.admin-tabs { display:grid; grid-template-columns:repeat(auto-fit, minmax(118px, 1fr)); gap:10px; margin-top:22px; }
.admin-tabs button { padding:11px 12px; box-shadow:none; border-width:2px; }
.admin-tabs button.active { background:linear-gradient(180deg, #4f8f2f, #2f6f1d); }
.admin-section[hidden] { display:none; }
.admin-section { animation:adminFade .16s ease-out; }
.admin-section.card { padding:26px; border-width:2px; border-color:#ead8bd; border-radius:12px; box-shadow:var(--shadow); overflow:auto; }
.admin-section h2 { display:flex; align-items:center; gap:10px; margin-bottom:18px; padding-bottom:12px; border-bottom:1px solid #f0dfc3; }
.admin-section h2::before { content:""; width:8px; height:24px; background:linear-gradient(180deg, var(--brand2), var(--brand)); border:2px solid var(--dark); }
.dashboard-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; margin-bottom:28px; }
.metric-card { background:#fffdf8; border:1px solid #f0dfc3; box-shadow:var(--shadow); padding:24px; border-radius:14px; min-height:132px; }
.metric-card h3 { margin:0 0 26px; color:#1f1b16; }
.metric-card strong { display:block; text-align:center; color:#4c8ee8; font-size:42px; line-height:1; }
.metric-card strong.orange { color:#f39a12; }
.metric-card strong.red { color:#e94848; }
.metric-card span { display:block; text-align:center; color:#777; margin-top:8px; }
.metric-card.compact { min-height:auto; padding:18px; }
.metric-card.compact h3 { margin:0; }
.small-metrics { grid-template-columns:repeat(4, 1fr); }
.chart-card { border:1px solid #f0dfc3; box-shadow:var(--shadow); border-radius:14px; }
.trend-chart { height:220px; display:flex; align-items:flex-end; gap:24px; padding:24px 18px 8px; border-top:1px solid #eee; }
.trend-item { flex:1; text-align:center; color:#777; }
.trend-bar { display:block; width:100%; max-width:70px; margin:0 auto 8px; background:linear-gradient(180deg, rgba(76,142,232,.9), rgba(76,142,232,.18)); border:2px solid #4c8ee8; border-bottom:0; border-radius:8px 8px 0 0; }
.trend-item b { display:block; color:#333; }
.trend-item em { display:block; font-style:normal; margin-top:6px; transform:rotate(-35deg); font-size:12px; }
.settings-form { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.settings-form label:nth-last-child(2) { grid-column:1 / -1; }
.admin-search { margin:12px 0 22px; padding:16px; border:1px solid #f0dfc3; border-radius:12px; background:#fff8e8; }
.admin-search input { max-width:380px; }
.admin-details { margin:18px 0; border:1px solid #f0dfc3; border-radius:12px; padding:16px; background:#fff8e8; }
.admin-details summary { cursor:pointer; font-weight:800; }
.player-edit-form { display:grid; gap:8px; min-width:240px; }
.player-edit-form label { margin:4px 0; }
.player-edit-form input[type="checkbox"], .player-actions input[type="checkbox"] { width:auto; margin:0 6px 0 0; }
.player-actions { min-width:120px; }
.player-actions label { display:block; margin:8px 0; }
.current-status-cell { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.status-pill { display:inline-flex; align-items:center; justify-content:center; min-width:58px; padding:6px 10px; background:#fff4d8; border:2px solid var(--dark); line-height:1; font-weight:800; }
.status-pill.ok { background:#dcffd1; }
.status-pill.warn { background:#ffe4a3; }
.status-pill.danger { background:#ffd0c9; }
.compact-actions { display:flex; gap:8px; flex-wrap:wrap; }
.admin-section table { border-collapse:separate; border-spacing:0; background:#fffdf8; border:1px solid #f0dfc3; border-radius:12px; overflow:hidden; }
.admin-section th { color:#6a461f; background:#fff1d2; font-size:14px; white-space:nowrap; }
.admin-section td { vertical-align:middle; background:#fffdf8; }
.admin-section tbody tr:nth-child(even) td { background:#fff9ed; }
.admin-section tbody tr:hover td { background:#fff1d2; }
.admin-section .compact-actions button, .admin-section td button { padding:9px 11px; border-width:2px; box-shadow:none; }
.modal { position:fixed; inset:0; z-index:1000; background:rgba(0,0,0,.45); display:flex; align-items:center; justify-content:center; padding:24px; }
.modal[hidden] { display:none; }
.modal-panel { width:min(760px, 96vw); max-height:90vh; overflow:auto; background:#fffdf8; border:4px solid var(--dark); box-shadow:12px 12px 0 rgba(0,0,0,.25); padding:24px; position:relative; }
.modal-close { position:absolute; right:12px; top:12px; padding:5px 10px; }
.detail-grid, .punish-status { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:12px 0 22px; }
.detail-grid span { padding:10px; background:#fff8e8; border:2px solid var(--line); }
.manage-player-head { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin:6px 0 14px; }
.manage-player-head strong { font-size:26px; color:var(--dark); }
.manage-player-head span { color:var(--muted); font-weight:700; }
.punish-state { min-height:136px; padding:16px; border:3px solid var(--dark); background:#fff8e8; box-shadow:5px 5px 0 rgba(74,45,19,.12); }
.punish-state.danger { background:linear-gradient(180deg, #ffd4cf, #fff8e8); }
.punish-state.warn { background:linear-gradient(180deg, #ffe7a8, #fff8e8); }
.punish-state.empty { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:var(--muted); }
.punish-title { display:inline-block; margin-bottom:10px; padding:6px 10px; border:2px solid var(--dark); background:#fffdf8; font-size:18px; font-weight:900; color:var(--dark); }
.punish-state dl { display:grid; grid-template-columns:72px 1fr; gap:6px 10px; margin:0; line-height:1.45; }
.punish-state dt { color:var(--muted); font-weight:800; }
.punish-state dd { margin:0; word-break:break-word; }
.punish-actions { display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin:14px 0 20px; }
.punish-card { text-align:left; min-height:76px; background:#fff8e8; color:var(--dark); }
.punish-card span { display:block; margin-top:6px; font-size:12px; color:#7d6040; }
.punish-card.warn { background:#ffe4a3; }
.punish-card.danger { background:#ffd0c9; }
.punish-card.selected { outline:4px solid #4c8ee8; }
.punish-card:disabled { opacity:.45; cursor:not-allowed; }
.muted-text { color:var(--muted); }
.punishment-history { margin:12px 0 18px; border:3px solid var(--dark); padding:12px; background:#fff8e8; }
.punishment-history summary { cursor:pointer; font-weight:900; }
.history-list { display:grid; gap:10px; margin-top:12px; }
.history-item { display:grid; grid-template-columns:90px 1fr 1fr; gap:8px; padding:10px; border:2px solid var(--line); background:#fffdf8; }
.history-item span:last-child { grid-column:1 / -1; }
.pagination { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:18px; }
.notice-box { margin:12px 0; padding:12px 14px; border:3px solid var(--dark); background:#fff4d8; box-shadow:4px 4px 0 rgba(74,45,19,.14); }
@keyframes adminFade { from { opacity:.65; transform:translateY(4px); } to { opacity:1; transform:none; } }
.account-hero { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.account-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:18px; margin-bottom:24px; }
.account-card { background:#fffdf8; border:4px solid var(--dark); box-shadow:6px 6px 0 rgba(242,140,40,.18); padding:18px; color:var(--muted); }
.account-card strong { display:block; margin-top:8px; font-size:24px; color:var(--dark); }
.appeal-form { display:grid; gap:14px; }
.block-row { display:flex; gap:12px; margin-top:18px; }
.mc-block { width:54px; height:54px; display:inline-block; border:4px solid var(--dark); box-shadow:5px 5px 0 rgba(74,45,19,.18); }
.mc-block.grass { background:linear-gradient(#77b255 0 30%, #9b6b3d 30%); }
.mc-block.dirt { background:linear-gradient(45deg, #8b5a2b 25%, #a06a3a 25% 50%, #7b4d28 50% 75%, #b57945 75%); background-size:18px 18px; }
.mc-block.ore { background:linear-gradient(45deg, #d9d9d9 25%, #f28c28 25% 45%, #bdbdbd 45% 75%, #ffd28a 75%); background-size:20px 20px; }
@media (max-width: 760px) {
  .container { width:94vw; margin:18px auto; }
  .topbar { padding:12px 4vw; gap:10px; align-items:center; }
  .brand { font-size:15px; line-height:1.25; min-height:auto; }
  .brand img { max-width:190px; max-height:36px; }
  .login-link { padding:8px 12px; }
  .grid2, .status-grid, .dashboard-grid, .small-metrics, .settings-form, .detail-grid, .punish-status, .punish-actions, .account-grid { grid-template-columns:1fr; }
  .actions, .split, .inline-form { align-items:stretch; flex-direction:column; }
  .hero { padding:24px 0 16px; min-height:auto; }
  .hero-logo { opacity:.16; right:0; top:10px; width:96px; height:96px; }
  h1 { font-size:34px; }
  .card { padding:16px; box-shadow:6px 6px 0 rgba(242,140,40,.24); overflow-x:auto; }
  table { min-width:720px; }
  .admin-shell { padding:18px; }
  .admin-shell h1 { font-size:34px; }
  .admin-tabs { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .admin-section.card { padding:18px; }
  .admin-search input { max-width:none; }
  .modal { padding:10px; align-items:flex-start; }
  .modal-panel { width:100%; max-height:94vh; padding:18px; }
  .trend-chart { gap:8px; padding:16px 6px 8px; }
  .account-hero { align-items:stretch; flex-direction:column; }
}