:root{
  --card-alpha:.72; --overlay-alpha:.06; --top-alpha:.65;
  --bg:#ffffff; --text:#0b172a; --muted:#556278; --border:#d5dbe7;
  --topbar-bg: rgba(255, 255, 255, var(--top-alpha));
  --card-light: rgba(255,255,255,var(--card-alpha));
  --card-border: rgba(15,23,42,.08);
  --shadow: 0 6px 26px rgba(2,6,23,.10);
  --accent: #4f4f4f; /* Neutral Accent */
  --accent-weak: rgba(79, 79, 79, .1);
  --accent-text: #333333;
  --btn-border: rgba(79, 79, 79, .3);
  
  --admin-card-alpha: .70;
  --admin-overlay-alpha: .40;
  --admin-top-alpha: .60;
}
[data-theme="dark"]{
  --bg: #121212; --text: #e2e2e2; --muted: #a0a0a0; --border: rgba(255, 255, 255, 0.15);
  --topbar-bg: rgba(28, 28, 30, var(--top-alpha));
  --card-dark: rgba(28, 28, 30, var(--card-alpha));
  --card-border: rgba(255, 255, 255, 0.12);
  --shadow: 0 8px 34px rgba(0,0,0,.5);
  --accent: #a0a0a0;
  --accent-weak: rgba(160, 160, 160, .12);
  --accent-text: #e2e2e2;
  --btn-border: rgba(160, 160, 160, .45);
}
*{box-sizing:border-box}
html{scroll-behavior: smooth;}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;line-height:1.65; transition: background-color .3s ease, color .3s ease;}

[data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3,[data-theme="dark"] h4,[data-theme="dark"] p,[data-theme="dark"] div,[data-theme="dark"] li,[data-theme="dark"] pre { color: var(--text); }
.content-body p, .content-body li { color: var(--text) !important; }

body.has-bg{background-image:var(--bg-image);background-size:cover;background-position:center top;background-attachment:fixed}
body.has-bg::before{content:"";position:fixed;inset:0;background:rgba(0,0,0,var(--overlay-alpha));pointer-events:none;z-index:-1}
body.admin.has-bg{background-image:var(--admin-bg-image);}
body.admin.has-bg::before{background:rgba(0,0,0,var(--admin-overlay-alpha));}

.container{max-width:1180px;margin:0 auto;padding:24px 16px;position:relative;z-index:1}
.card{background:var(--card-light);border:1px solid var(--card-border);border-radius:16px;padding:18px;box-shadow:var(--shadow);backdrop-filter:saturate(140%) blur(6px)}
[data-theme="dark"] .card{background:var(--card-dark)}
body.admin .card { background: rgba(255,255,255, var(--admin-card-alpha)); }
[data-theme="dark"] body.admin .card { background: var(--card-dark); --card-alpha: var(--admin-card-alpha); }

.topbar{position:sticky;top:0;z-index:10;background:var(--topbar-bg);backdrop-filter:saturate(140%) blur(6px);transition:opacity .25s ease,transform .25s ease, background-color .3s ease;color:#fff}
body.admin .topbar { background:var(--topbar-bg); --top-alpha: var(--admin-top-alpha); }
.topbar.fade{opacity:0;pointer-events:none;transform:translateY(-6px)}
.topbar-inner{max-width:1180px;margin:0 auto;padding:12px 16px;display:flex;gap:12px;align-items:center}
.brand{display:flex;align-items:center;gap:8px;font-weight:800}
.brand a{color: var(--text); text-decoration:none}
[data-theme="dark"] .brand a {color: var(--text);}
.dot{width:10px;height:10px;border-radius:50%; background:#22c55e}
.tools{margin-left:auto;display:flex;gap:10px;align-items:center}

.tabs{position:sticky;top:52px;z-index:9;background:var(--topbar-bg);backdrop-filter:saturate(140%) blur(6px);transition:opacity .25s ease,transform .25s ease, background-color .3s ease;border-bottom:1px solid var(--border)}
body.admin .tabs { background:var(--topbar-bg); --top-alpha: var(--admin-top-alpha); }
.tabs.fade{opacity:0;pointer-events:none;transform:translateY(-6px)}
.tabs-inner{max-width:1180px;margin:0 auto;display:flex;gap:24px;padding:0 16px; overflow-x: auto;}
.tab{color:var(--muted);text-decoration:none;padding:12px 2px;border-bottom:2px solid transparent; font-weight: 600; white-space: nowrap;}
.tab:hover{color:var(--text)}
.tab.active{border-color:var(--text);color:var(--text)}

.btn{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;border:1px solid var(--btn-border);background:var(--accent-weak);color:var(--text);text-decoration:none;cursor:pointer;transition:.15s; font-weight: 600;}
.btn:hover{transform:translateY(-1px); border-color: var(--accent);}
.btn.primary{background:var(--text);border-color:var(--text);color:var(--bg)}
.topbar .tools .btn { background-color: var(--accent-weak); border: 1px solid var(--btn-border); color: var(--muted); }
.topbar .tools .btn:hover { color: var(--text); border-color: var(--accent); }

label{display:block;margin:.6rem 0 .2rem;font-weight:600;color:var(--muted)}
label.chk{display:inline-flex;align-items:center;gap:8px;margin-right:16px}
input,textarea,select{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--card-border);background:transparent;color:var(--text)}
input[type="checkbox"]{width:auto}
textarea{resize:vertical}

.ann-list{display:grid;gap:16px; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));}
.ann-card-link { text-decoration: none; }
.ann{border:1px solid var(--card-border);border-radius:16px;overflow:hidden;background:transparent; display: flex; flex-direction: column;}
.ann .wrap{position:relative; z-index: 1;}
.ann-cover{width:100%;height:220px;object-fit:cover;display:block}
.ann-body{padding:14px;background:var(--card-light);backdrop-filter:saturate(140%) blur(6px);border-top:1px solid var(--card-border); position: relative; z-index: 2; flex-grow: 1; display: flex; flex-direction: column;}
[data-theme="dark"] .ann-body{background:var(--card-dark)}
.ann-head{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:6px}
.ann-intro {color: var(--muted); margin-top: 8px; white-space: pre-wrap; word-wrap: break-word;}
.tag {display: inline-block; padding: 2px 8px; border-radius: 8px; background: var(--accent-weak); color: var(--muted); border: 1px solid var(--btn-border); font-size: 12px; }
.tag.body-tag{margin-bottom: 8px;}
.badge{display:inline-block;padding:2px 8px;border-radius:999px;border:1px solid var(--card-border);background:rgba(148,163,184,.12);color:var(--muted);font-size:12px}
.badge.pin{background:rgba(244,63,94,.12);color:#ef5a7a;border-color:rgba(244,63,94,.2)}

.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.45);z-index:20}
.modal .panel{background:var(--card-light);border:1px solid var(--card-border);border-radius:16px;padding:18px;max-width:520px;width:92%;backdrop-filter:saturate(140%) blur(6px)}
[data-theme="dark"] .modal .panel{background:var(--card-dark)}
.modal .actions{display:flex;gap:10px;justify-content:flex-end;margin-top:10px}
.modal.show{display:flex}

.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid var(--card-border);padding:8px 6px;text-align:left}

input[type=range]{-webkit-appearance:none; appearance:none; height:8px; border-radius:999px; background:linear-gradient(var(--accent), var(--accent)) 0/var(--progress, 0%) 100% no-repeat, rgba(148,163,184,.25); outline:none; cursor:pointer;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:16px; height:16px; border-radius:50%; background:var(--accent); border:2px solid var(--bg); box-shadow:0 0 0 1px var(--btn-border); margin-top:-4px; }
input[type=range]::-moz-range-thumb{width:16px; height:16px; border-radius:50%; background:var(--accent); border:2px solid var(--bg);}

.range-row{display:flex;align-items:center;gap:.75rem}
.range-row input[type=range]{flex:1}
.range-row .num{min-width:2.5rem;text-align:center}

.wiki-shell-grid { display: grid; grid-template-columns: 240px 1fr; gap: 24px;}
.wiki-main-content { min-width: 0; }
.wiki-sidebar, .updates-archive {height: calc(100vh - 150px); overflow-y: auto; position: sticky; top: 100px; padding: 10px !important;}
.wiki-sidebar a, .updates-archive a {display:block; padding: 6px 10px; text-decoration: none; color: var(--muted); border-radius: 8px; font-size: 14px;}
.wiki-sidebar a:hover, .updates-archive a:hover {background-color: var(--accent-weak); color: var(--text);}
.wiki-sidebar a.active {background-color: var(--accent-weak); color: var(--text); font-weight: 600;}
.updates-archive h5 {margin: 16px 0 8px 10px; color: var(--text);}
.wiki-sidebar details {margin-top: 4px;}
.wiki-sidebar summary {padding: 6px 10px; font-weight: 700; cursor: pointer; border-radius: 8px; color: var(--text); font-size: 15px;}
.wiki-sidebar summary:hover {background-color: var(--accent-weak);}
.wiki-sidebar details div {padding-left: 16px;}

.pagination { display: flex; justify-content: center; gap: 8px; margin-top: 24px; }
.badge.success { background-color: #dcfce7; border-color: #86efac; color: #166534; }
[data-theme="dark"] .badge.success { background-color: #14532d; border-color: #22c55e; color: #dcfce7; }
.badge.status-open { background-color: #fee2e2; color: #b91c1c; border-color: #fca5a5; }
.badge.status-in_progress { background-color: #fef9c3; color: #854d0e; border-color: #fde047; }
.badge.status-resolved { background-color: #dcfce7; color: #166534; border-color: #86efac; }
.badge.status-closed { background-color: #e5e7eb; color: #374151; border-color: #d1d5db; }
[data-theme="dark"] .badge.status-open { background-color: #991b1b; color: #fecaca; border-color: #ef4444; }
[data-theme="dark"] .badge.status-in_progress { background-color: #b45309; color: #fef08a; border-color: #facc15; }
[data-theme="dark"] .badge.status-resolved { background-color: #166534; color: #dcfce7; border-color: #4ade80; }
[data-theme="dark"] .badge.status-closed { background-color: #4b5563; color: #d1d5db; border-color: #9ca3af; }
.ann-update { background-color: var(--card-light); padding: 16px; border-radius: 16px; border: 1px solid var(--card-border); box-shadow: var(--shadow); }
[data-theme="dark"] .ann-update { background-color: var(--card-dark); }
pre.ticket-detail { white-space:pre-wrap; background: var(--accent-weak); padding: 10px; border-radius: 8px; margin-top: 10px; }

.ticket-type-list { display: flex; flex-direction: column; gap: 12px; }
.ticket-type-btn { text-align: center; padding: 12px; font-size: 16px; }

@media (max-width: 1024px) {
    .wiki-shell-grid {grid-template-columns: 220px 1fr; }
}
@media (max-width: 768px) {
    .wiki-shell-grid {grid-template-columns: 1fr;}
    .wiki-sidebar, .updates-archive {height: auto; position: static; margin-bottom: 24px;}
    .tabs-inner {gap: 12px; overflow-x: auto; -ms-overflow-style: none; scrollbar-width: none;}
    .tabs-inner::-webkit-scrollbar { display: none; }
}