:root { --ink:#17212b; --muted:#66717d; --line:#dfe4e8; --canvas:#f4f6f7; --blue:#165dff; --blue-dark:#0d46c4; --orange:#ed7b2f; --green:#1b8a5a; --shadow:0 18px 45px rgba(26,39,52,.10); }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#fbfcfd; font:15px/1.5 Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif; -webkit-font-smoothing:antialiased; }
button { font:inherit; cursor:pointer; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.app-shell { max-width:1100px; margin:auto; padding:28px 24px 48px; }
.topbar,.hero-row,.stats,.game-layout,.panel-heading,.drawer-head { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.topbar { border-bottom:1px solid var(--line); padding-bottom:18px; }
.topbar-actions { display:flex; align-items:center; gap:14px; flex-wrap:wrap; justify-content:flex-end; }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; letter-spacing:.02em; }
.brand-mark { background:var(--ink); color:#fff; padding:6px 9px; border-radius:4px; font-size:13px; }
.icon-button { color:var(--muted); background:none; border:0; padding:7px 0; }
.icon-button.muted-control { color:#9aa3ad; }
.icon-button:hover { color:var(--blue); }
.hero-row { padding:44px 0 28px; align-items:end; }
.eyebrow { margin:0 0 8px; color:var(--blue); font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
h1,h2,p { margin-top:0; } h1 { font-size:42px; line-height:1.05; margin-bottom:12px; letter-spacing:0; } h2 { margin-bottom:0; font-size:20px; } .muted { color:var(--muted); }
.hero-actions { display:flex; gap:10px; flex-shrink:0; }
.button { border:1px solid transparent; border-radius:5px; padding:10px 18px; font-weight:700; transition:.2s; } .button.primary { color:#fff; background:var(--blue); } .button.primary:hover { background:var(--blue-dark); } .button.secondary { background:#fff; border-color:var(--line); } .button:disabled { cursor:not-allowed; opacity:.45; } .full { width:100%; }
.stats { background:#fff; border:1px solid var(--line); border-radius:7px; box-shadow:var(--shadow); padding:18px 22px; margin-bottom:16px; } .stats div { flex:1; border-right:1px solid var(--line); padding-right:16px; } .stats div:last-child { border:0; } .stats span { display:block; color:var(--muted); font-size:12px; margin-bottom:3px; } .stats strong { font-size:24px; }
.record-banner { position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:18px; margin:-10px 0 16px; padding:18px 22px; color:#fff; background:linear-gradient(135deg,#17212b 0%,#24476f 48%,#165dff 100%); border-radius:7px; box-shadow:var(--shadow); }
.record-banner::before { content:""; position:absolute; inset:auto -70px -95px auto; width:210px; height:210px; border-radius:50%; background:rgba(255,255,255,.13); pointer-events:none; }
.record-copy { position:relative; display:flex; align-items:baseline; gap:14px; flex:none; }
.record-copy span { color:rgba(255,255,255,.78); font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.record-copy strong { font-size:42px; line-height:1; letter-spacing:-.03em; text-shadow:0 8px 20px rgba(0,0,0,.22); }
.record-banner p { position:relative; margin:0; color:rgba(255,255,255,.86); text-align:right; }
.record-banner.record-burst { animation:record-burst .78s ease both; }
@keyframes record-burst { 0%{transform:scale(1);box-shadow:var(--shadow)} 32%{transform:scale(1.018);box-shadow:0 0 0 7px rgba(22,93,255,.13),0 24px 52px rgba(22,93,255,.23)} 100%{transform:scale(1);box-shadow:var(--shadow)} }
.status { min-height:27px; margin:8px 0 16px; color:var(--muted); } .status[data-type="success"] { color:var(--green); } .status[data-type="warning"] { color:var(--orange); } .status[data-type="error"] { color:#d64545; }
.game-layout { align-items:start; } .board-wrap { flex:1; max-width:620px; min-width:0; } .board { width:100%; aspect-ratio:1/1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(4,minmax(0,1fr)); gap:10px; background:var(--ink); padding:10px; border-radius:7px; box-shadow:var(--shadow); touch-action:none; overscroll-behavior:contain; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; contain:layout paint style; overflow:hidden; }
.cell { position:relative; width:100%; height:100%; min-width:0; min-height:0; overflow:hidden; border:0; border-radius:4px; background:#e6eaed; color:var(--ink); display:flex; justify-content:center; align-items:center; font-size:48px; line-height:1; font-weight:800; touch-action:none; transform:translateZ(0); will-change:transform; backface-visibility:hidden; -webkit-backface-visibility:hidden; -webkit-appearance:none; appearance:none; transition:transform .1s ease-out, background .1s ease-out, box-shadow .1s ease-out; } .cell[data-digits="4"]{font-size:42px}.cell[data-digits="5"]{font-size:36px}.cell[data-digits="6"]{font-size:31px}.cell[data-value="2"]{background:#e7edf5}.cell[data-value="4"]{background:#d7e4f5}.cell[data-value="8"]{background:#b9d4f6;color:#083b7c}.cell[data-value="16"]{background:#92baf1;color:#fff}.cell[data-value="32"]{background:#6d9ce8;color:#fff}.cell[data-value="64"]{background:#447bdd;color:#fff}.cell[data-value="128"],.cell[data-value="256"],.cell[data-value="512"],.cell[data-value="1024"],.cell[data-value="2048"]{background:var(--orange);color:#fff}.cell.obstacle{background:#4c5863;color:#fff;box-shadow:inset 0 -8px 0 rgba(0,0,0,.12)}.cell.obstacle[data-hp="2"]{background:#6b6571}.cell.obstacle[data-hp="1"]{background:#8b5960}.cell.item{background:radial-gradient(circle at 50% 36%,#ffffff 0%,#f0fff9 54%,#dffbf2 100%);border:2px dashed #17b978;color:#087f5b;box-shadow:0 0 0 1px rgba(23,185,120,.18),0 0 18px rgba(23,185,120,.45),inset 0 0 18px rgba(255,255,255,.82);animation:item-glow 1.55s ease-in-out infinite}.cell.item.wild{border-color:#7c6cff;color:#5142c9;box-shadow:0 0 0 1px rgba(124,108,255,.18),0 0 18px rgba(124,108,255,.42),inset 0 0 18px rgba(255,255,255,.82)}.cell.item.undo{border-color:#13a8c7;color:#08788e;box-shadow:0 0 0 1px rgba(19,168,199,.18),0 0 18px rgba(19,168,199,.42),inset 0 0 18px rgba(255,255,255,.82)}.cell-icon{font-size:28px}.cell small{font-size:10px;position:absolute;bottom:5px;font-weight:700;line-height:1.1;white-space:nowrap;max-width:92%;overflow:hidden;text-overflow:ellipsis}.break-mark{font-size:32px;color:#ed7b2f;text-shadow:0 0 18px rgba(237,123,47,.35)}.effect-hit{animation:obstacle-hit .34s ease both}.effect-break{animation:obstacle-break .58s ease both;background:#fff6e9}.effect-pickup{animation:item-pickup .45s ease both}.effect-merge{animation:tile-merge .28s ease both}@keyframes obstacle-hit{0%,100%{transform:translate3d(0,0,0)}20%{transform:translate3d(-5px,0,0) rotate(-2deg)}45%{transform:translate3d(5px,0,0) rotate(2deg)}70%{transform:translate3d(-3px,0,0) rotate(-1deg)}}@keyframes obstacle-break{0%{transform:translateZ(0) scale(1);box-shadow:inset 0 0 0 0 rgba(237,123,47,.2)}55%{transform:translateZ(0) scale(1.09) rotate(4deg);box-shadow:inset 0 0 0 5px rgba(237,123,47,.22)}100%{transform:translateZ(0) scale(1);box-shadow:none}}@keyframes item-glow{0%,100%{opacity:.96;transform:translateZ(0) scale(1)}50%{opacity:1;transform:translateZ(0) scale(1.018)}}@keyframes item-pickup{0%{box-shadow:0 0 0 0 rgba(27,138,90,.32)}45%{transform:translateZ(0) scale(1.08);box-shadow:0 0 0 8px rgba(27,138,90,.18)}100%{transform:translateZ(0) scale(1);box-shadow:none}}@keyframes tile-merge{0%{transform:translateZ(0) scale(.92)}55%{transform:translateZ(0) scale(1.1)}100%{transform:translateZ(0) scale(1)}}
.tool-panel { width:300px; background:#fff; border:1px solid var(--line); border-radius:7px; padding:20px; box-shadow:var(--shadow); } .panel-heading { align-items:end; padding-bottom:12px; border-bottom:1px solid var(--line); } .panel-heading span { color:var(--muted); font-size:11px; text-align:right; } .tool { width:100%; display:flex; gap:12px; align-items:center; text-align:left; border:0; border-bottom:1px solid var(--line); background:#fff; padding:16px 2px; color:var(--ink); } .tool:hover,.tool.active { color:var(--blue); } .tool:disabled { opacity:.4; cursor:not-allowed; } .tool-icon { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:#eef3ff; color:var(--blue); font-size:16px; } .tool b,.tool small { display:block; } .tool small { color:var(--muted); font-size:12px; margin-top:2px; } .tool-count { display:inline-grid; min-width:20px; height:20px; place-items:center; margin-left:4px; border-radius:10px; background:var(--canvas); color:var(--muted); font-size:11px; font-style:normal; } .rules { margin-top:20px; color:var(--muted); font-size:12px; } .rules b { color:var(--ink); } .rules p { margin:7px 0 0; }
.mobile-controls { display:none; text-align:center; margin-top:15px; } .mobile-controls button { width:46px; height:42px; margin:2px; border:1px solid var(--line); background:#fff; border-radius:5px; color:var(--ink); font-size:21px; }
.modal,.drawer { position:fixed; inset:0; visibility:hidden; opacity:0; transition:.2s; z-index:5; } .modal { display:grid; place-items:center; padding:20px; background:rgba(23,33,43,.58); } .modal.open,.drawer.open { visibility:visible; opacity:1; } .modal-card { position:relative; width:min(420px,100%); background:#fff; border-radius:7px; padding:32px; box-shadow:var(--shadow); } .revive-card { width:min(560px,100%); } .modal-close { position:absolute; right:16px; top:13px; border:0; background:none; font-size:28px; color:var(--muted); } .reward-code { display:block; background:var(--canvas); border:1px solid var(--line); padding:16px; margin:20px 0; overflow-wrap:anywhere; font-size:16px; } .record-reward-box { margin:18px 0 20px; padding:16px; border:1px solid #f0c36a; border-radius:7px; background:linear-gradient(135deg,#fff9e9,#fff); box-shadow:0 12px 28px rgba(237,123,47,.09); } .record-reward-box strong { display:block; font-size:17px; } .record-reward-box .reward-code { margin:12px 0; background:#fff; border-color:#f2d08e; } .extra-code { color:#8a4d09; background:#fff8ea; border-radius:4px; padding:6px 8px; } .hint { color:var(--muted); font-size:12px; margin:14px 0 0; } .hint[data-type="success"] { color:var(--green); } .hint[data-type="warning"] { color:var(--orange); } .hint[data-type="error"] { color:#bd3434; } .revive-ad-slot { min-height:220px; display:grid; place-items:center; margin:18px 0 8px; padding:12px; background:var(--canvas); border:1px dashed #c8d7ff; border-radius:7px; overflow:hidden; } .revive-ad-slot p { margin:0; color:var(--muted); } .modal-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:20px; } .modal-actions .button { min-width:116px; } .drawer { left:auto; width:min(420px,100%); background:#fff; border-left:1px solid var(--line); box-shadow:-16px 0 40px rgba(26,39,52,.12); padding:24px; transform:translateX(100%); transition:.25s; } .drawer.open { transform:translateX(0); } .drawer-head { border-bottom:1px solid var(--line); padding-bottom:14px; } #history-list { list-style:none; padding:0; margin:0; } #history-list li { padding:15px 0; border-bottom:1px solid var(--line); } #history-list strong,#history-list code,#history-list time { display:block; } #history-list code { margin:4px 0; overflow-wrap:anywhere; } #history-list time,.empty { color:var(--muted); font-size:12px; }
@media (max-width:760px) { .app-shell { padding:18px 14px 35px; } .topbar { align-items:flex-start; } .topbar-actions { gap:10px; } .hero-row { padding-top:30px; display:block; } .hero-row h1,.category-select-head h1 { font-size:32px; } .hero-actions { margin-top:20px; } .hero-actions .button { flex:1; } .record-banner { display:block; margin-top:-2px; padding:16px; } .record-copy { justify-content:space-between; } .record-copy strong { font-size:34px; } .record-banner p { margin-top:8px; text-align:left; font-size:13px; } .stats { gap:12px; padding:14px; flex-wrap:wrap; } .stats div { min-width:calc(50% - 12px); border-right:0; } .stats strong { font-size:20px; } .game-layout { display:block; } .board-wrap { max-width:none; } .board { gap:7px; padding:7px; box-shadow:0 10px 24px rgba(26,39,52,.13); } .cell { font-size:34px; transition-duration:.08s; } .cell.item { animation-duration:1.9s; } .cell[data-digits="4"]{font-size:28px}.cell[data-digits="5"]{font-size:24px}.cell[data-digits="6"]{font-size:21px}.cell small{font-size:9px;bottom:4px}.tool-panel { width:100%; margin-top:18px; } .mobile-controls { display:block; } }
@media (prefers-reduced-motion:reduce) { .cell,.record-banner,.drawer,.modal,.public-category-item,.copy-toast { transition:none!important; animation:none!important; } }

.admin-body { background:var(--canvas); } .admin-nav { height:66px; padding:0 28px; background:#fff; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; } .admin-nav-actions { display:flex; align-items:center; gap:14px; } .text-link { color:var(--blue); text-decoration:none; font-size:13px; } .nav-divider { height:18px; width:1px; background:var(--line); } .nav-user { color:var(--muted); font-size:13px; } .admin-main { max-width:1220px; margin:auto; padding:32px 24px 60px; } .login-shell { width:min(410px,calc(100% - 32px)); margin:10vh auto; background:#fff; border:1px solid var(--line); border-radius:7px; padding:28px; box-shadow:var(--shadow); } .login-form { margin-top:28px; display:grid; gap:18px; } label { display:grid; gap:7px; color:var(--muted); font-size:12px; font-weight:700; } input,select,textarea { width:100%; border:1px solid #cfd6dc; border-radius:5px; background:#fff; color:var(--ink); padding:10px 11px; font:14px/1.4 inherit; } input:focus,select:focus,textarea:focus { outline:2px solid rgba(22,93,255,.18); border-color:var(--blue); } textarea { resize:vertical; font-family:ui-monospace,Consolas,monospace; } .form-error,.flash.error { color:#bd3434; } .flash { padding:11px 14px; border:1px solid var(--line); background:#fff; border-radius:5px; } .flash.success { color:var(--green); border-color:#a7d7c1; } .admin-intro,.editor-head { display:flex; justify-content:space-between; align-items:end; gap:22px; margin-bottom:28px; } .admin-intro h1,.editor-head h1 { font-size:34px; margin-bottom:8px; } .admin-intro .muted,.editor-head .muted { margin:0; } .section-note { color:var(--muted); font-size:12px; } .admin-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:36px; } .admin-stats div { background:#fff; border:1px solid var(--line); border-radius:7px; padding:20px; } .admin-stats span,.admin-stats strong,.admin-stats small { display:block; } .admin-stats span { color:var(--muted); font-size:12px; } .admin-stats strong { font-size:30px; margin-top:5px; } .admin-stats small { color:var(--muted); font-size:11px; margin-top:4px; } .admin-section { margin-top:34px; } .admin-section h1 { font-size:34px; } .section-title { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:18px; } .category-list { display:grid; gap:10px; } .category-item { background:#fff; border:1px solid var(--line); border-radius:7px; padding:18px 20px; display:flex; align-items:center; justify-content:space-between; gap:20px; } .category-main { display:flex; align-items:center; gap:15px; min-width:0; } .category-icon { width:52px; height:52px; display:grid; place-items:center; flex:none; border-radius:7px; color:#fff; background:var(--ink); font-size:12px; font-weight:800; } .category-name-row { display:flex; align-items:center; gap:10px; } .category-name-row h3 { margin:0; font-size:17px; } .category-slug { margin:4px 0 10px; color:var(--muted); font:12px ui-monospace,Consolas,monospace; } .status-pill { padding:3px 7px; border-radius:10px; font-size:10px; font-weight:700; } .status-pill.on { color:var(--green); background:#e4f5ed; } .status-pill.off { color:var(--muted); background:#edf0f2; } .category-facts { display:flex; flex-wrap:wrap; gap:13px; color:var(--muted); font-size:12px; } .category-facts b { color:var(--ink); } .edit-button { flex:none; } .edit-button span { margin-left:6px; } .empty-panel { padding:28px; color:var(--muted); background:#fff; border:1px dashed var(--line); border-radius:7px; text-align:center; } .category-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; } .category-form { background:#fff; border:1px solid var(--line); border-radius:7px; padding:20px; display:grid; gap:14px; } .category-form.new { border-style:dashed; } .form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .form-row.thirds { grid-template-columns:repeat(3,minmax(0,1fr)); } .form-footer { display:flex; align-items:center; justify-content:flex-end; gap:14px; padding-top:5px; } .inventory { margin-right:auto; color:var(--muted); font-size:12px; } .toggle { display:flex; grid-template:none; flex-direction:row; align-items:center; white-space:nowrap; } .toggle input { width:auto; } .admin-section.split { display:grid; grid-template-columns:minmax(280px,.75fr) minmax(500px,1.5fr); gap:24px; align-items:start; } .import-form { display:grid; gap:14px; margin-top:18px; padding:20px; background:#fff; border:1px solid var(--line); border-radius:7px; } .table-wrap { overflow:auto; background:#fff; border:1px solid var(--line); border-radius:7px; } table { border-collapse:collapse; width:100%; min-width:700px; font-size:13px; } th,td { padding:11px 13px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; } th { color:var(--muted); font-size:11px; background:#fafbfc; } td code { max-width:220px; display:block; overflow:hidden; text-overflow:ellipsis; }
.stock-summary { min-width:125px; padding:14px 17px; border:1px solid var(--line); border-radius:7px; background:#fff; } .stock-summary span,.stock-summary strong,.stock-summary small { display:block; } .stock-summary span,.stock-summary small { color:var(--muted); font-size:11px; } .stock-summary strong { font-size:28px; line-height:1.15; margin:3px 0; } .settings-form { display:grid; gap:14px; } .settings-section { background:#fff; border:1px solid var(--line); border-radius:7px; padding:24px; display:grid; grid-template-columns:230px minmax(0,1fr); gap:24px; } .settings-title { display:flex; align-items:flex-start; gap:12px; } .settings-index { color:var(--blue); font:700 12px ui-monospace,Consolas,monospace; padding-top:4px; } .settings-title h2 { font-size:17px; margin:0 0 6px; } .settings-title p { color:var(--muted); font-size:12px; margin:0; } .settings-fields { display:grid; gap:14px; } .setting-wide { max-width:380px; } .weight-preview { display:flex; align-items:center; flex-wrap:wrap; gap:8px; color:var(--muted); font-size:12px; } .weight-preview b { padding:5px 8px; border-radius:4px; background:var(--canvas); color:var(--ink); font-size:11px; } .editor-actions { display:flex; justify-content:flex-end; gap:10px; padding-top:8px; }
.installer-shell { width:min(720px,calc(100% - 28px)); margin:5vh auto; background:#fff; border:1px solid var(--line); border-radius:7px; padding:32px; box-shadow:var(--shadow); } .installer-head { margin:32px 0 24px; } .installer-head h1 { font-size:34px; } .installer-form { display:grid; gap:24px; } .installer-form section { display:grid; gap:14px; border-top:1px solid var(--line); padding-top:20px; } .installer-form h2 { font-size:17px; } .field-help,.installer-foot { color:var(--muted); font-size:12px; font-weight:400; } .installer-foot { margin:20px 0 0; }
.category-select-body { background:linear-gradient(180deg,#f5f8fb 0%,#fbfcfd 34%,#fbfcfd 100%); } .category-select-shell { max-width:960px; margin:auto; padding:30px 22px 56px; } .category-select-head { padding:46px 0 22px; } .category-select-head h1 { font-size:42px; margin-bottom:12px; } .public-category-list { display:grid; gap:14px; } .public-category-item { display:grid; grid-template-columns:58px minmax(0,1fr) 32px; align-items:center; gap:18px; padding:18px 20px; color:var(--ink); text-decoration:none; background:#fff; border:1px solid var(--line); border-radius:7px; box-shadow:0 12px 28px rgba(26,39,52,.06); transition:transform .16s, border-color .16s, box-shadow .16s; } .public-category-item:hover { transform:translateY(-2px); border-color:#b8c8df; box-shadow:0 18px 36px rgba(26,39,52,.10); } .public-category-mark { width:58px; height:58px; display:grid; place-items:center; border-radius:7px; background:var(--ink); color:#fff; font-size:12px; font-weight:800; } .public-category-copy { min-width:0; } .public-category-copy h2 { font-size:18px; margin:0 0 4px; } .public-category-copy p { color:var(--muted); margin:0 0 10px; overflow-wrap:anywhere; } .public-category-meta { display:flex; flex-wrap:wrap; gap:10px; color:var(--muted); font-size:12px; } .public-category-best { color:#8a641f; } .public-category-best.has-best { color:var(--blue); font-weight:700; } .stock-ok { color:var(--green); } .stock-empty { color:#bd3434; } .public-category-arrow { color:var(--blue); font-size:24px; justify-self:end; }
.database-alert { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:24px; padding:16px 18px; background:#fff8ea; border:1px solid #f1c879; border-radius:7px; box-shadow:0 12px 24px rgba(237,123,47,.08); } .database-alert strong { display:block; color:#8a4d09; font-size:15px; } .database-alert p { margin:3px 0 0; color:#8a641f; font-size:13px; } .admin-intro-actions,.category-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; } .category-actions .button { white-space:nowrap; } .edit-button.disabled { pointer-events:none; opacity:.42; } .copy-link-button { color:var(--blue); } .copy-toast { position:fixed; right:22px; bottom:22px; max-width:min(360px,calc(100% - 44px)); padding:12px 15px; color:#fff; background:rgba(23,33,43,.94); border-radius:6px; box-shadow:var(--shadow); transform:translateY(12px); opacity:0; visibility:hidden; transition:.18s; z-index:10; overflow-wrap:anywhere; } .copy-toast.show { opacity:1; visibility:visible; transform:translateY(0); } .copy-toast.error { background:#bd3434; }
@media (max-width:900px) { .category-grid,.admin-section.split { grid-template-columns:1fr; } .settings-section { grid-template-columns:1fr; gap:14px; } }
@media (max-width:600px) { .admin-nav { padding:0 15px; } .admin-nav-actions { gap:7px; } .nav-user,.nav-divider { display:none; } .admin-main { padding:24px 14px; } .admin-stats { grid-template-columns:1fr; } .admin-intro,.editor-head,.database-alert { display:block; } .admin-intro-actions { justify-content:flex-start; margin-top:14px; } .admin-intro .button,.database-alert .button { display:inline-block; margin-top:14px; } .stock-summary { margin-top:20px; display:inline-block; } .form-row,.form-row.thirds { grid-template-columns:1fr; } .form-footer { flex-wrap:wrap; } .category-item { align-items:flex-start; flex-direction:column; } .category-actions { width:100%; justify-content:stretch; } .category-actions .button { flex:1; text-align:center; } .edit-button { align-self:stretch; text-align:center; } .settings-section { padding:18px; } .category-select-shell { padding:20px 14px 42px; } .public-category-item { grid-template-columns:46px minmax(0,1fr); padding:15px; } .public-category-mark { width:46px; height:46px; } .public-category-arrow { display:none; } }

.inline-form { margin:0; }
.admin-dashboard { max-width:1320px; padding-top:40px; }
.admin-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:28px; margin-bottom:22px; }
.admin-hero h1 { margin:0 0 8px; font-size:38px; line-height:1.08; }
.admin-hero-copy { min-width:0; }
.admin-hero-copy .muted { margin:0; }
.admin-hero-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex:none; }
.admin-hero-actions .button { display:inline-flex; align-items:center; justify-content:center; min-height:40px; white-space:nowrap; }
.admin-stats { grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; margin:0 0 28px; }
.admin-stats .stat-card { min-height:118px; padding:22px; border-radius:7px; box-shadow:none; }
.admin-panel { background:#fff; border:1px solid var(--line); border-radius:7px; padding:22px; box-shadow:0 10px 26px rgba(26,39,52,.05); }
.admin-panel + .admin-panel,.admin-panel + .admin-workbench { margin-top:22px; }
.admin-dashboard .section-title { margin-bottom:16px; }
.admin-dashboard .section-title h2 { font-size:22px; line-height:1.2; }
.admin-dashboard .section-title .eyebrow { margin-bottom:5px; }
.category-list { gap:12px; }
.category-item { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:18px; padding:18px; border-radius:7px; box-shadow:none; }
.category-main { min-width:0; align-items:center; }
.category-copy { min-width:0; }
.category-name-row { margin-bottom:6px; }
.category-name-row h3 { font-size:18px; line-height:1.25; }
.category-slug { display:flex; align-items:center; gap:8px; margin:0 0 12px; color:var(--muted); }
.category-slug span { font-size:11px; }
.category-slug code { display:inline-block; max-width:100%; padding:4px 7px; border-radius:4px; background:var(--canvas); color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.category-facts { gap:8px; }
.category-facts span { display:inline-flex; align-items:center; gap:4px; padding:5px 8px; border-radius:4px; background:#f7f9fb; color:var(--muted); line-height:1.2; }
.category-actions { display:grid; grid-template-columns:1fr; gap:8px; min-width:118px; }
.category-actions .button { display:flex; justify-content:center; align-items:center; min-height:38px; padding:8px 12px; }
.copy-link-button { border-color:#c8d7ff; background:#f8fbff; }
.admin-workbench { display:grid; grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr); gap:22px; align-items:start; margin-top:22px; }
.admin-workbench .admin-panel { margin:0; min-width:0; }
.import-form { margin:12px 0 0; padding:0; border:0; box-shadow:none; }
.import-form textarea { min-height:172px; }
.logs-panel .table-wrap { border-radius:7px; }
.logs-panel table { min-width:620px; }
.logs-panel td,.logs-panel th { padding:12px 14px; } .table-note { display:block; margin-top:4px; color:var(--muted); font-size:11px; }
.database-alert { max-width:100%; }
@media (max-width:900px) { .admin-dashboard { padding-top:28px; } .admin-hero { align-items:flex-start; flex-direction:column; } .admin-hero-actions { justify-content:flex-start; width:100%; } .admin-stats { grid-template-columns:1fr; } .category-item { grid-template-columns:1fr; align-items:start; } .category-actions { display:flex; width:100%; } .category-actions .button { flex:1; } .admin-workbench { grid-template-columns:1fr; } }
@media (max-width:600px) { .admin-dashboard { padding:24px 14px 46px; } .admin-hero h1 { font-size:30px; } .admin-hero-actions { flex-direction:column; align-items:stretch; } .admin-hero-actions .button { width:100%; margin-top:0; } .admin-panel { padding:17px; } .category-main { align-items:flex-start; } .category-icon { width:44px; height:44px; } .category-slug { align-items:flex-start; flex-direction:column; gap:5px; } .category-actions { flex-direction:column; } .category-facts span { width:100%; justify-content:space-between; } }