/* === Nestit — App Styles === */

/* Self-hosted Fonts */
@font-face { font-family:'Arvo'; font-style:normal; font-weight:400; font-display:swap; src:url('/font/Arvo-Regular.ttf') format('truetype') }
@font-face { font-family:'Arvo'; font-style:italic; font-weight:400; font-display:swap; src:url('/font/Arvo-Italic.ttf') format('truetype') }
@font-face { font-family:'Arvo'; font-style:normal; font-weight:700; font-display:swap; src:url('/font/Arvo-Bold.ttf') format('truetype') }
@font-face { font-family:'Arvo'; font-style:italic; font-weight:700; font-display:swap; src:url('/font/Arvo-BoldItalic.ttf') format('truetype') }
@font-face { font-family:'Ubuntu Mono'; font-style:normal; font-weight:400; font-display:swap; src:url('/font/UbuntuMono-Regular.ttf') format('truetype') }
@font-face { font-family:'Ubuntu Mono'; font-style:italic; font-weight:400; font-display:swap; src:url('/font/UbuntuMono-Italic.ttf') format('truetype') }
@font-face { font-family:'Ubuntu Mono'; font-style:normal; font-weight:700; font-display:swap; src:url('/font/UbuntuMono-Bold.ttf') format('truetype') }
@font-face { font-family:'Ubuntu Mono'; font-style:italic; font-weight:700; font-display:swap; src:url('/font/UbuntuMono-BoldItalic.ttf') format('truetype') }

/* Design Tokens */
:root {
  --a50:#effcf8;--a100:#c8f7ea;--a200:#92efd7;--a300:#53e0bf;--a400:#24c9a5;
  --a500:#0ea88a;--a600:#088770;--a700:#096c5c;--a800:#0b564b;--a900:#0d473f;
  --r-sm:4px;--r-md:8px;--r-lg:14px;--r-full:9999px;
  --sans:'Arvo',Georgia,serif;
  --heading:'Arvo',Georgia,serif;
  --mono:'Ubuntu Mono',monospace;
  --ease:180ms ease;
}

[data-theme="light"] {
  --bg1:#fff;--bg2:#f4f5f7;--bg3:#e9ebef;--bg4:#dddfe5;
  --t1:#141720;--t2:#555b6e;--t3:#8c91a0;--tac:#fff;
  --bd:#d4d7de;--bdl:#e6e8ed;
  --up:#f56c23;--dn:#7b68ee;--ok:#22a55e;--warn:#eda821;--err:#e5424d;--info:var(--a500);
  --sh-sm:0 1px 3px rgba(0,0,0,.05);--sh-md:0 3px 12px rgba(0,0,0,.08);--sh-lg:0 10px 32px rgba(0,0,0,.1);
}

[data-theme="dark"] {
  --bg1:#151720;--bg2:#1c1e28;--bg3:#262834;--bg4:#32343f;
  --t1:#e2e4eb;--t2:#9498a8;--t3:#64687a;--tac:#fff;
  --bd:#2e3040;--bdl:#262838;
  --up:#f5813e;--dn:#9b8afb;--ok:#2ecc71;--warn:#f5b740;--err:#ef5a5a;--info:var(--a400);
  --sh-sm:0 1px 3px rgba(0,0,0,.25);--sh-md:0 3px 12px rgba(0,0,0,.35);--sh-lg:0 10px 32px rgba(0,0,0,.45);
}

/* Reset */
*,*::before,*::after { box-sizing:border-box;margin:0;padding:0 }
body {
  font-family:var(--sans);font-size:15px;line-height:1.6;
  color:var(--t1);background:var(--bg2);
  -webkit-font-smoothing:antialiased;
  transition:background var(--ease),color var(--ease);
}
a { color:var(--a500);text-decoration:none }
a:hover { text-decoration:underline }
img { max-width:100%;height:auto }
ul,ol { list-style:none }

/* Layout */
.site-wrap { min-height:100vh;display:flex;flex-direction:column }
.main-content { flex:1;max-width:1500px;width:100%;margin:0 auto;padding:20px 16px }
.content-col { min-width:0 }

/* Top Bar */
.topbar {
  position:sticky;top:0;z-index:100;
  background:var(--bg1);border:1px solid var(--bdl);
  border-radius:var(--r-lg);margin-bottom:12px;
  padding:8px;display:flex;flex-direction:column;gap:4px;
  box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);
}
.topbar-row {
  display:flex;align-items:center;gap:4px;
}
.topbar-logo {
  font-family:var(--heading);font-size:18px;font-weight:700;
  color:var(--a500);text-decoration:none;flex-shrink:0;
  padding:6px 10px;
}
.topbar-logo:hover { text-decoration:none }
.topbar-refresh {
  flex-shrink:0;
  background:none;border:none;cursor:pointer;
  color:var(--t3);font-size:18px;padding:4px;
  display:flex;align-items:center;
  transition:transform 0.3s;
}
.topbar-refresh:hover { color:var(--t1) }
.topbar-refresh.spinning i { animation:spin 0.6s linear }
@keyframes spin { to { transform:rotate(360deg) } }
.topbar-user { flex-shrink:0;display:flex;align-items:center;margin-left:6px }
.topbar-avatar {
  width:28px;height:28px;border-radius:var(--r-full);
  overflow:hidden;cursor:pointer;
}
.topbar-avatar:hover { opacity:0.8 }
.topbar-avatar img { width:100%;height:100%;object-fit:cover;display:block }
.topbar-subfilter {
  display:inline-flex;align-items:center;gap:2px;
  background:var(--bg2);border-radius:var(--r-full);padding:2px;
}
.topbar-subfilter .time-pill { line-height:1;display:inline-flex;align-items:center }
.topbar-search-form {
  flex:1;position:relative;
}
.topbar-search-form i {
  position:absolute;left:10px;top:50%;transform:translateY(-50%);
  color:var(--t3);font-size:14px;pointer-events:none;
}
.topbar-search-form input {
  width:100%;padding:5px 10px 5px 30px;
  background:var(--bg2);border:1px solid transparent;border-radius:var(--r-full);
  font-family:var(--sans);font-size:12px;color:var(--t1);
  transition:border-color var(--ease);
}
.topbar-search-form input:focus { outline:none;border-color:var(--a500);background:var(--bg1) }

/* Dropdown */
.dropdown { position:relative }
.dropdown-menu {
  display:none;position:absolute;right:0;top:100%;margin-top:4px;
  background:var(--bg1);border:1px solid var(--bd);border-radius:var(--r-md);
  box-shadow:var(--sh-md);min-width:180px;padding:4px 0;z-index:200;
}
.dropdown-menu.show { display:block }
.dropdown-item {
  display:flex;align-items:center;gap:8px;padding:8px 16px;
  font-size:14px;color:var(--t1);cursor:pointer;transition:background var(--ease);
  text-decoration:none;border:none;background:none;width:100%;font-family:var(--sans);
}
.dropdown-item:hover { background:var(--bg2);text-decoration:none }
.dropdown-item i { font-size:16px;color:var(--t3);width:20px;text-align:center }
.dropdown-divider { height:1px;background:var(--bdl);margin:4px 0 }

/* Buttons */
.btn {
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 18px;border-radius:var(--r-md);
  font-family:var(--sans);font-size:14px;font-weight:700;
  border:none;cursor:pointer;transition:all var(--ease);text-decoration:none;
  line-height:1.4;
}
.btn:hover { text-decoration:none }
.btn-p { background:var(--a500);color:var(--tac) }
.btn-p:hover { background:var(--a600) }
.btn-s { background:var(--bg3);color:var(--t1);border:1px solid var(--bd) }
.btn-s:hover { background:var(--bg4) }
.btn-g { background:transparent;color:var(--t2) }
.btn-g:hover { background:var(--bg3);color:var(--t1) }
.btn-d { background:var(--err);color:#fff }
.btn-d:hover { opacity:.9 }
.btn-sm { padding:5px 12px;font-size:13px }
.btn-block { width:100%;justify-content:center }

/* Cards */
.card {
  background:var(--bg1);border:1px solid var(--bdl);
  border-radius:var(--r-lg);overflow:hidden;
  transition:border-color var(--ease);
}
.card:hover { border-color:var(--bd) }
.card-header {
  padding:14px 16px;border-bottom:1px solid var(--bdl);
  font-family:var(--heading);font-size:15px;font-weight:700;
}
.card-body { padding:16px }

/* Post Card */
.post-card {
  background:var(--bg1);border:1px solid var(--bdl);border-radius:var(--r-lg);
  display:flex;margin-bottom:12px;transition:border-color var(--ease);
}
.post-card:hover { border-color:var(--bd) }

/* Vote Widget */
.vote-col {
  display:flex;flex-direction:column;align-items:center;
  padding:8px 4px;gap:2px;min-width:46px;
  background:var(--bg2);border-radius:var(--r-lg) 0 0 var(--r-lg);
}
.vote-btn {
  background:none;border:none;cursor:pointer;padding:4px;
  color:var(--t3);font-size:20px;border-radius:var(--r-sm);
  transition:color var(--ease),background var(--ease);
  line-height:1;
}
.vote-btn:hover { background:var(--bg3) }
.vote-btn.active-up { color:var(--up) }
.vote-btn.active-down { color:var(--dn) }
.vote-score {
  font-size:13px;font-weight:700;color:var(--t1);
  min-width:20px;text-align:center;
}
.vote-score.up { color:var(--up) }
.vote-score.down { color:var(--dn) }

/* Post Content */
.post-main { flex:1;padding:10px 14px;min-width:0 }
.post-meta {
  font-size:12px;color:var(--t3);margin-bottom:4px;
  display:flex;align-items:center;gap:4px;flex-wrap:wrap;
}
.post-meta a { color:var(--t2);font-weight:400 }
.post-meta a:hover { color:var(--a500);text-decoration:underline }
.post-title {
  font-family:var(--heading);font-size:17px;font-weight:700;
  margin-bottom:4px;line-height:1.3;
}
.post-title a { color:var(--t1);text-decoration:none }
.post-title a:hover { color:var(--a500) }
.post-body {
  font-size:14px;color:var(--t2);line-height:1.5;
  margin-bottom:8px;
}
.post-body.truncated {
  max-height:120px;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,#000 60%,transparent);
  mask-image:linear-gradient(180deg,#000 60%,transparent);
}
.text-pager {
  display:inline-flex;align-items:center;gap:6px;
  margin-top:6px;font-size:12px;color:var(--t3);user-select:none;
}
.tp-prev, .tp-next {
  cursor:pointer;padding:1px 4px;border-radius:var(--r-sm);
  color:var(--t2);font-weight:700;
}
.tp-prev:hover, .tp-next:hover { color:var(--t1);background:var(--bg2) }
.tp-info { font-size:11px;color:var(--t3) }
.post-image { max-width:100%;max-height:512px;border-radius:var(--r-md);margin:8px 0;cursor:pointer;display:block }
.post-link {
  display:inline-flex;align-items:center;gap:4px;
  font-size:13px;color:var(--a500);margin-bottom:6px;word-break:break-all;
}
.post-link i { font-size:14px }

/* Link Cards */
.link-card {
  display:flex;align-items:stretch;
  border:1px solid var(--bdl);border-radius:var(--r-md);
  overflow:hidden;margin-bottom:8px;position:relative;
  background:var(--bg2);transition:border-color var(--ease);
}
.link-card:hover { border-color:var(--bd) }
.link-card-display { text-decoration:none;color:inherit }
.link-card-display:hover { text-decoration:none }
.link-card-content { display:flex;align-items:stretch;flex:1;min-width:0 }
.link-card-thumb {
  width:120px;min-height:80px;object-fit:cover;flex-shrink:0;
  background:var(--bg3);
}
.link-card-text { padding:10px 12px;flex:1;min-width:0 }
.link-card-title {
  font-size:14px;font-weight:700;line-height:1.3;
  color:var(--t1);margin-bottom:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.link-card-desc {
  font-size:12px;color:var(--t2);line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.link-card-domain { font-size:11px;color:var(--t3);margin-top:4px;display:flex;align-items:center;gap:4px }
.link-card-domain i { font-size:12px }
.link-card-remove {
  position:absolute;top:6px;right:6px;
  background:var(--bg1);border:1px solid var(--bd);border-radius:var(--r-full);
  width:24px;height:24px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--t3);font-size:14px;padding:0;
  transition:all var(--ease);
}
.link-card-remove:hover { color:var(--err);border-color:var(--err) }
.post-link-cards { display:flex;flex-direction:column;gap:8px }

/* Image Previews (create/edit forms) */
#image-previews { display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px }
.image-preview-item {
  position:relative;width:120px;height:120px;border-radius:var(--r-md);
  overflow:hidden;border:1px solid var(--bd);
}
.image-preview-item img { width:100%;height:100%;object-fit:cover }
.image-preview-remove {
  position:absolute;top:4px;right:4px;
  background:rgba(0,0,0,.6);border:none;border-radius:var(--r-full);
  width:22px;height:22px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:#fff;font-size:14px;padding:0;
}
.image-preview-remove:hover { background:rgba(229,66,77,.8) }

/* Post images grid */
.post-images { display:flex;gap:8px;flex-wrap:wrap }
.post-images .post-image { max-width:100%;max-height:400px;border-radius:var(--r-md);object-fit:contain;margin:0 }

/* Embed frames */
.embed-frame-wrap {
  width:70%;border:1px solid var(--bdl);border-radius:var(--r-md);
  overflow:hidden;margin-bottom:8px;background:var(--bg2);
}
.embed-frame {
  width:100%;min-height:480px;border:none;display:block;
  background:#fff;resize:vertical;
}
.embed-frame-bar {
  display:flex;align-items:center;justify-content:space-between;
  padding:6px 10px;border-top:1px solid var(--bdl);
  font-size:12px;color:var(--t3);background:var(--bg1);
}
.embed-frame-domain { display:flex;align-items:center;gap:4px }
.embed-frame-domain i { font-size:14px }
.embed-frame-action {
  display:flex;align-items:center;gap:4px;
  color:var(--a500);font-size:12px;text-decoration:none;
}
.embed-frame-action:hover { text-decoration:underline }
.post-actions {
  display:flex;gap:4px;flex-wrap:wrap;
}
.post-action {
  display:inline-flex;align-items:center;gap:4px;
  padding:4px 8px;border-radius:var(--r-sm);
  font-size:12px;font-weight:400;color:var(--t3);
  background:none;border:none;cursor:pointer;
  transition:background var(--ease),color var(--ease);
  text-decoration:none;font-family:var(--sans);
}
.post-action:hover { background:var(--bg2);color:var(--t2);text-decoration:none }
.post-action i { font-size:16px }

/* Sort Tabs */
.sort-tabs {
  display:flex;gap:4px;padding:8px;
  background:var(--bg1);border:1px solid var(--bdl);
  border-radius:var(--r-lg);margin-bottom:12px;
}
.sort-tab {
  display:inline-flex;align-items:center;gap:5px;
  padding:6px 14px;border-radius:var(--r-full);
  font-family:var(--sans);font-size:13px;font-weight:700;color:var(--t3);
  text-decoration:none;transition:all var(--ease);
  border:none;background:none;cursor:pointer;
}
.sort-tab:hover { background:var(--bg2);color:var(--t2);text-decoration:none }
.sort-tab.active {
  background:var(--bg3);color:var(--t1);
}
.sort-tab-create { margin-left:auto;background:var(--a500);color:#fff !important }
.sort-tab-create:hover { background:var(--a600) }
.sort-tab i { font-size:16px }

.time-filter {
  display:inline-flex;gap:2px;margin-left:auto;
  background:var(--bg2);border-radius:var(--r-full);padding:2px;
}
.time-pill {
  padding:4px 10px;border-radius:var(--r-full);font-size:12px;
  font-family:var(--sans);font-weight:400;color:var(--t3);text-decoration:none;transition:all var(--ease);
  display:inline-flex;align-items:center;gap:3px;line-height:1.4;
}
.time-pill:hover { color:var(--t2);text-decoration:none }
.time-pill.active { background:var(--bg1);color:var(--t1);box-shadow:var(--sh-sm) }

/* Comments */
.comment-form { margin-bottom:20px }
.comment-form textarea {
  width:100%;padding:12px;border:1px solid var(--bd);border-radius:var(--r-md);
  font-family:var(--sans);font-size:14px;background:var(--bg1);color:var(--t1);
  resize:vertical;min-height:80px;transition:border-color var(--ease);
}
.comment-form textarea:focus { outline:none;border-color:var(--a500) }
.comment-form .btn { margin-top:8px }

.comment-thread { margin-top:16px }
.comment {
  display:flex;gap:8px;padding:10px 0;
  border-left:2px solid var(--bdl);
  padding-left:12px;margin-left:0;
}
.comment.depth-0 { border-left:none;padding-left:0 }
.comment-vote {
  display:flex;flex-direction:column;align-items:center;gap:0;flex-shrink:0;
}
.comment-vote .vote-btn { font-size:16px;padding:2px }
.comment-vote .vote-score { font-size:12px }
.comment-body-wrap { flex:1;min-width:0 }
.comment-meta {
  font-size:12px;color:var(--t3);margin-bottom:4px;
  display:flex;align-items:center;gap:6px;
}
.comment-meta a { color:var(--a500);font-weight:400 }
.comment-text { font-size:14px;line-height:1.5;color:var(--t1) }
.comment-actions {
  display:flex;gap:4px;margin-top:4px;
}
.comment-actions .post-action { font-size:11px }
.comment-removed {
  font-style:italic;color:var(--t3);font-size:13px;
}
.comment-children { margin-left:16px }
.collapse-toggle {
  background:none;border:none;color:var(--t3);cursor:pointer;
  font-size:12px;font-weight:700;padding:0;font-family:var(--sans);
}
.collapse-toggle:hover { color:var(--a500) }

/* Reply form (inline) */
.reply-form {
  margin-top:8px;margin-bottom:8px;display:none;
}
.reply-form.show { display:block }
.reply-form textarea {
  width:100%;padding:8px;border:1px solid var(--bd);border-radius:var(--r-md);
  font-family:var(--sans);font-size:13px;background:var(--bg1);color:var(--t1);
  resize:vertical;min-height:60px;
}
.reply-form textarea:focus { outline:none;border-color:var(--a500) }

/* Nest Header */
.nest-header {
  background:var(--bg1);border:1px solid var(--bdl);border-radius:var(--r-lg);
  margin-bottom:16px;overflow:hidden;
}
.nest-banner {
  aspect-ratio:4/1;background:linear-gradient(135deg,var(--a500),var(--a700));
  overflow:hidden;
}
.nest-banner img { width:100%;height:100%;object-fit:cover }
.nest-info {
  padding:12px 16px;display:flex;align-items:center;gap:14px;
}
.nest-icon {
  width:56px;height:56px;border-radius:var(--r-full);
  background:var(--bg1);border:3px solid var(--bg1);
  margin-top:-32px;display:flex;align-items:center;justify-content:center;
  font-family:var(--heading);font-size:24px;font-weight:700;color:var(--a500);
  overflow:hidden;box-shadow:var(--sh-sm);
}
.nest-icon img { width:100%;height:100%;object-fit:cover }
.nest-details { flex:1 }
.nest-name {
  font-family:var(--heading);font-size:24px;font-weight:700;
  display:flex;align-items:center;gap:8px;
}
.nest-slug { font-size:13px;color:var(--t3) }
.nest-description { font-size:14px;color:var(--t2);margin-top:2px }
.nest-actions { display:flex;gap:8px;align-items:center }

/* Nest panels (rules + members inside nest-header) */
.nest-panels {
  display:grid;grid-template-columns:1fr 1fr;gap:0;
  border-top:1px solid var(--bdl);
}
.nest-panel {
  display:flex;flex-direction:column;min-height:0;
}
.nest-panel + .nest-panel { border-left:1px solid var(--bdl) }
.nest-panel-header {
  padding:8px 14px;font-size:12px;font-weight:700;color:var(--t3);
  border-bottom:1px solid var(--bdl);display:flex;align-items:center;gap:6px;
  flex-shrink:0;text-transform:uppercase;letter-spacing:.3px;
}
.nest-panel-body {
  max-height:200px;overflow-y:auto;font-size:13px;
}
.nest-rules-list { display:flex;flex-direction:column;gap:0 }
.nest-rule-card {
  display:flex;align-items:baseline;gap:8px;padding:7px 14px;
  font-size:13px;color:var(--t1);
}
.nest-rule-card + .nest-rule-card { border-top:1px solid var(--bdl) }
.nest-rule-num {
  font-weight:700;font-size:11px;color:var(--a500);
  min-width:16px;text-align:center;flex-shrink:0;
}
.nest-member-list {
  display:flex;flex-direction:column;gap:0;
}
.nest-member {
  display:flex;align-items:center;gap:8px;padding:5px 14px;
  color:var(--t1);text-decoration:none;transition:background var(--ease);
}
.nest-member + .nest-member { border-top:1px solid var(--bdl) }
.nest-member:hover { background:var(--bg2) }
.nest-member-avatar {
  width:22px;height:22px;min-width:22px;min-height:22px;
  border-radius:var(--r-full);background:var(--bg2);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  font-size:11px;color:var(--t3);flex-shrink:0;
}
.nest-member-avatar img { width:22px;height:22px;max-width:22px;max-height:22px;object-fit:cover;display:block }
.nest-member-name { font-size:13px;font-weight:400;display:flex;align-items:baseline;gap:5px }
.nest-member-handle { font-size:11px;color:var(--t3);font-weight:400 }
.nest-member-badge { color:var(--a500);font-size:13px;margin-left:auto }
@media(max-width:640px) {
  .nest-panels { grid-template-columns:1fr }
  .nest-panel + .nest-panel { border-left:none;border-top:1px solid var(--bdl) }
}

/* Forms */
.form-group { margin-bottom:16px }
.form-label {
  display:block;font-size:13px;font-weight:400;
  color:var(--t2);margin-bottom:4px;
}
.form-input,.form-textarea,.form-select {
  width:100%;padding:10px 14px;border:1px solid var(--bd);
  border-radius:var(--r-md);font-family:var(--sans);font-size:14px;
  background:var(--bg2);color:var(--t1);transition:border-color var(--ease);
}
.form-input:focus,.form-textarea:focus,.form-select:focus {
  outline:none;border-color:var(--a500);
}
.form-textarea { resize:vertical;min-height:120px }
.form-hint { font-size:12px;color:var(--t3);margin-top:4px }

/* Post type tabs */
.type-tabs {
  display:flex;gap:0;border:1px solid var(--bd);border-radius:var(--r-md) var(--r-md) 0 0;
  overflow:hidden;
}
.type-tab {
  flex:1;padding:10px;text-align:center;font-size:14px;font-weight:400;
  color:var(--t3);cursor:pointer;border:none;background:var(--bg2);
  font-family:var(--sans);transition:all var(--ease);
  display:flex;align-items:center;justify-content:center;gap:6px;
}
.type-tab:not(:last-child) { border-right:1px solid var(--bd) }
.type-tab.active { background:var(--bg1);color:var(--a500) }
.type-tab:hover { color:var(--t1) }
.type-tab i { font-size:18px }
.type-panel { display:none }
.type-panel.active { display:block }

/* Flash Messages */
.flash {
  padding:10px 16px;border-radius:var(--r-md);margin-bottom:12px;
  font-size:14px;font-weight:400;display:flex;align-items:center;gap:8px;
}
.flash-success { background:rgba(34,165,94,.1);color:var(--ok);border:1px solid rgba(34,165,94,.2) }
.flash-error { background:rgba(229,66,77,.1);color:var(--err);border:1px solid rgba(229,66,77,.2) }
.flash-warning { background:rgba(237,168,33,.1);color:var(--warn);border:1px solid rgba(237,168,33,.2) }
.flash i { font-size:18px }

/* Pagination */
.pagination {
  display:flex;align-items:center;justify-content:center;gap:4px;
  margin-top:20px;padding:12px;
}
.page-link {
  padding:6px 12px;border-radius:var(--r-md);font-size:13px;font-weight:400;
  color:var(--t2);text-decoration:none;transition:all var(--ease);
}
.page-link:hover { background:var(--bg3);color:var(--t1);text-decoration:none }
.page-link.active { background:var(--a500);color:var(--tac) }
.page-link.disabled { color:var(--t3);pointer-events:none }

/* User Profile */
.profile-header {
  background:var(--bg1);border:1px solid var(--bdl);border-radius:var(--r-lg);
  padding:24px;display:flex;align-items:center;gap:20px;margin-bottom:16px;
}
.profile-avatar {
  width:80px;height:80px;border-radius:var(--r-full);
  background:var(--a500);color:var(--tac);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--heading);font-size:32px;font-weight:700;
  overflow:hidden;flex-shrink:0;
}
.profile-avatar img { width:100%;height:100%;object-fit:cover }
.profile-name { font-family:var(--heading);font-size:22px;font-weight:700 }
.profile-username { font-size:14px;color:var(--t3) }
.profile-bio { font-size:14px;color:var(--t2);margin-top:4px }
.profile-stats {
  display:flex;gap:16px;margin-top:6px;
}
.profile-stat { font-size:13px;color:var(--t3) }
.profile-stat strong { color:var(--t1);font-weight:700 }

/* Tag field */
.tag-field {
  display:flex;flex-wrap:wrap;gap:6px;align-items:center;
  padding:6px 10px;border:1px solid var(--bd);border-radius:var(--r-md);
  background:var(--bg2);cursor:text;min-height:42px;
}
.tag-field:focus-within { border-color:var(--a500) }
.tag-item {
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 8px;border-radius:var(--r-full);
  background:var(--bg3);font-size:13px;color:var(--t1);
}
.tag-remove {
  background:none;border:none;color:var(--t3);cursor:pointer;
  font-size:16px;line-height:1;padding:0 2px;font-family:var(--sans);
}
.tag-remove:hover { color:var(--err) }
.tag-input {
  border:none;outline:none;background:transparent;font-size:13px;
  color:var(--t1);font-family:var(--sans);flex:1;min-width:120px;
  padding:3px 0;
}

/* Admin */
.stat-grid {
  display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:12px;margin-bottom:24px;
}
.stat-card {
  background:var(--bg1);border:1px solid var(--bdl);border-radius:var(--r-lg);
  padding:20px;text-align:center;
}
.stat-value {
  font-family:var(--heading);font-size:28px;font-weight:700;color:var(--a500);
}
.stat-label { font-size:13px;color:var(--t3);margin-top:2px }

/* Tables */
.data-table {
  width:100%;border-collapse:collapse;font-size:14px;
}
.data-table th {
  text-align:left;padding:10px 12px;border-bottom:2px solid var(--bdl);
  font-size:12px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.3px;
}
.data-table td {
  padding:10px 12px;border-bottom:1px solid var(--bdl);color:var(--t1);
}
.data-table tr:hover td { background:var(--bg2) }
.badge {
  display:inline-block;padding:2px 8px;border-radius:var(--r-full);
  font-family:var(--sans);font-size:11px;font-weight:700;
}
.badge-admin { background:var(--a100);color:var(--a700) }
[data-theme="dark"] .badge-admin { background:var(--a900);color:var(--a300) }
.badge-banned { background:rgba(229,66,77,.1);color:var(--err) }
.badge-pending { background:rgba(237,168,33,.1);color:var(--warn) }
.badge-resolved { background:rgba(34,165,94,.1);color:var(--ok) }
.badge-dismissed { background:var(--bg3);color:var(--t3) }

/* Mod queue */
.mod-item {
  background:var(--bg1);border:1px solid var(--bdl);border-radius:var(--r-md);
  padding:12px 16px;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;
}
.mod-item-info { flex:1 }
.mod-item-title { font-weight:400;font-size:14px }
.mod-item-meta { font-size:12px;color:var(--t3) }

/* Empty state */
.empty-state {
  text-align:center;padding:48px 24px;color:var(--t3);
}
.empty-state i { font-size:48px;margin-bottom:12px;display:block;color:var(--bg4) }
.empty-state p { font-size:15px }

/* Utility */
.text-muted { color:var(--t3) }
.text-small { font-size:13px }
.mt-8 { margin-top:8px }
.mt-16 { margin-top:16px }
.mb-8 { margin-bottom:8px }
.mb-16 { margin-bottom:16px }
.flex-between { display:flex;align-items:center;justify-content:space-between }
.gap-8 { gap:8px }

/* Search */
.search-tabs {
  display:flex;gap:4px;margin-bottom:16px;
}
.search-tab {
  padding:6px 16px;border-radius:var(--r-full);font-family:var(--sans);font-size:13px;font-weight:700;
  color:var(--t3);text-decoration:none;transition:all var(--ease);
}
.search-tab:hover { background:var(--bg3);color:var(--t2);text-decoration:none }
.search-tab.active { background:var(--a500);color:var(--tac) }

/* Settings */
.settings-section {
  background:var(--bg1);border:1px solid var(--bdl);border-radius:var(--r-lg);
  padding:24px;margin-bottom:16px;
}
.settings-title {
  font-family:var(--heading);font-size:17px;font-weight:700;margin-bottom:16px;
  padding-bottom:10px;border-bottom:1px solid var(--bdl);
}

/* Markdown Content */
.md-content { line-height:1.6;word-wrap:break-word;overflow-wrap:break-word }
.md-content p { margin-bottom:8px }
.md-content p:last-child { margin-bottom:0 }
.md-content h1,.md-content h2,.md-content h3,.md-content h4,.md-content h5,.md-content h6 {
  font-weight:700;line-height:1.3;margin:16px 0 8px;
}
.md-content h1 { font-size:1.5em }
.md-content h2 { font-size:1.3em }
.md-content h3 { font-size:1.15em }
.md-content h4,.md-content h5,.md-content h6 { font-size:1em }
.md-content strong { font-weight:700 }
.md-content em { font-style:italic }
.md-content a { color:var(--a500);text-decoration:underline }
.md-content a:hover { color:var(--a600) }
.md-content ul,.md-content ol { margin:8px 0;padding-left:24px }
.md-content ul { list-style:disc }
.md-content ol { list-style:decimal }
.md-content li { margin-bottom:4px }
.md-content blockquote {
  border-left:3px solid var(--a500);padding:4px 12px;margin:8px 0;
  color:var(--t2);background:var(--bg2);border-radius:0 var(--r-sm) var(--r-sm) 0;
}
.md-content blockquote p { margin-bottom:0 }
.md-content code {
  font-family:var(--mono);font-size:0.9em;
  background:var(--bg3);padding:2px 5px;border-radius:var(--r-sm);
}
.md-content pre {
  background:var(--bg3);border:1px solid var(--bdl);border-radius:var(--r-md);
  padding:12px 16px;margin:8px 0;overflow-x:auto;
}
.md-content pre code {
  background:none;padding:0;font-size:13px;line-height:1.5;
  color:var(--t1);
}
.md-content hr {
  border:none;border-top:1px solid var(--bdl);margin:16px 0;
}
.md-content img { max-width:100%;border-radius:var(--r-md) }
.md-content .spoiler {
  background:var(--t1);color:transparent;border-radius:3px;padding:0 4px;
  cursor:pointer;transition:all 180ms ease;user-select:none;
}
.md-content .spoiler.revealed { background:var(--bg3);color:var(--t1) }
.md-content table { width:100%;border-collapse:collapse;margin:8px 0;font-size:14px }
.md-content th,.md-content td {
  border:1px solid var(--bdl);padding:6px 10px;text-align:left;
}
.md-content th { background:var(--bg2);font-weight:700 }

/* Markdown Content Lite (inline only) */
.md-content-lite { word-wrap:break-word;overflow-wrap:break-word }
.md-content-lite strong { font-weight:700 }
.md-content-lite em { font-style:italic }
.md-content-lite a { color:var(--a500);text-decoration:underline }
.md-content-lite a:hover { color:var(--a600) }
.md-content-lite code {
  font-family:var(--mono);font-size:0.9em;
  background:var(--bg3);padding:2px 5px;border-radius:var(--r-sm);
}
.md-content-lite .spoiler {
  background:var(--t1);color:transparent;border-radius:3px;padding:0 4px;
  cursor:pointer;transition:all 180ms ease;user-select:none;
}
.md-content-lite .spoiler.revealed { background:var(--bg3);color:var(--t1) }

/* Markdown Editor Toolbar */
.md-editor { position:relative }
.md-toolbar {
  display:flex;gap:2px;padding:6px 8px;
  background:var(--bg2);border:1px solid var(--bd);
  border-radius:var(--r-md) var(--r-md) 0 0;
  border-bottom:none;flex-wrap:wrap;
}
.md-toolbar-btn {
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:28px;border:none;background:none;
  border-radius:var(--r-sm);cursor:pointer;color:var(--t2);
  font-size:16px;transition:all var(--ease);padding:0;
}
.md-toolbar-btn:hover { background:var(--bg3);color:var(--t1) }
.md-toolbar-sep { width:1px;background:var(--bd);margin:2px 4px;align-self:stretch }
.md-editor textarea {
  border-radius:0 0 var(--r-md) var(--r-md) !important;
  border-top-left-radius:0 !important;border-top-right-radius:0 !important;
}

/* Copy Link Menu */
.copy-link-menu {
  position:absolute;bottom:100%;left:50%;transform:translateX(-50%);
  background:var(--bg1);border:1px solid var(--bd);border-radius:var(--r-md);
  box-shadow:var(--sh-md);z-index:100;min-width:200px;padding:4px;
  display:flex;flex-direction:column;gap:2px;margin-bottom:6px;
}
.copy-link-opt {
  display:flex;align-items:center;gap:8px;padding:8px 12px;border:none;
  background:none;cursor:pointer;color:var(--t1);font-size:13px;
  border-radius:var(--r-sm);font-family:var(--sans);text-align:left;
}
.copy-link-opt:hover { background:var(--bg3) }
.copy-link-opt i { font-size:15px;color:var(--t2);flex-shrink:0 }
.copy-link-help {
  display:inline-flex;align-items:center;justify-content:center;
  width:15px;height:15px;border-radius:var(--r-full);
  background:var(--bg3);color:var(--t3);font-size:10px;font-weight:700;
  cursor:help;flex-shrink:0;margin-left:auto;
}
.copy-link-hint {
  display:block;font-size:11px;color:var(--t3);margin-top:1px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:240px;
}
.copy-link-done {
  padding:8px 12px;color:var(--ok);font-size:13px;text-align:center;
  font-family:var(--sans);
}

/* Markdown Link Suggestion */
.md-link-suggest {
  display:flex;align-items:center;gap:8px;padding:6px 10px;
  background:var(--bg2);border:1px solid var(--bd);
  border-top:none;border-radius:0 0 var(--r-md) var(--r-md);
  font-size:12px;color:var(--t2);
}
.md-link-suggest span { flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
.md-link-suggest code { font-family:var(--mono);font-size:11px;color:var(--a500) }
.md-link-suggest-close {
  border:none;background:none;color:var(--t3);cursor:pointer;
  font-size:16px;line-height:1;padding:0 2px;
}
.md-link-suggest-close:hover { color:var(--t1) }

/* 404 Error Page */
.error-page {
  text-align:center;padding:80px 24px;
}
.error-code {
  font-family:var(--heading);font-size:96px;font-weight:700;
  color:var(--a500);line-height:1;
}
.error-msg {
  font-family:var(--heading);font-size:24px;font-weight:700;
  color:var(--t1);margin-top:8px;
}
.error-desc {
  color:var(--t2);font-size:15px;margin-top:8px;
}

/* Scheduled Post Badge */
.scheduled-badge {
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 10px;margin-top:4px;border-radius:var(--r-full);
  background:rgba(237,168,33,.12);color:var(--warn);
  font-size:12px;font-weight:700;
}

/* Schedule Form Row */
.schedule-row {
  display:flex;gap:6px;align-items:center;
}

/* Polls */
.post-poll { border:1px solid var(--bd);border-radius:var(--r-md);padding:12px;background:var(--bg2) }
.poll-question { font-weight:700;font-size:15px;margin-bottom:10px }
.poll-options { display:flex;flex-direction:column;gap:6px }
.poll-option {
  position:relative;display:flex;align-items:center;gap:8px;
  padding:10px 14px;border:1px solid var(--bd);border-radius:var(--r-md);
  background:var(--bg1);cursor:pointer;overflow:hidden;
  font-family:var(--sans);font-size:14px;color:var(--t1);
  text-align:left;width:100%;transition:border-color var(--ease);
}
.poll-option:hover { border-color:var(--a500) }
.poll-bar {
  position:absolute;left:0;top:0;bottom:0;
  background:var(--a100);border-radius:var(--r-md) 0 0 var(--r-md);
  transition:width 400ms ease;z-index:0;
}
[data-theme="dark"] .poll-bar { background:rgba(14,168,138,.15) }
.poll-label { position:relative;z-index:1;flex:1 }
.poll-pct { position:relative;z-index:1;font-size:13px;color:var(--t2);font-weight:700 }
.poll-check { position:relative;z-index:1;color:var(--a500);font-size:16px }
.poll-option.poll-selected { border-color:var(--a500) }
.poll-option.poll-voted { cursor:pointer }
.poll-footer { margin-top:8px;font-size:12px;color:var(--t3) }
.post-poll-preview {
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 10px;margin-top:6px;border-radius:var(--r-full);
  background:var(--bg3);font-size:12px;color:var(--t2);
}

/* Poll Builder (create/edit forms) */
.poll-option-row {
  display:flex;gap:6px;align-items:center;margin-bottom:6px;
}
.poll-option-row .form-input { margin-bottom:0;flex:1 }
.poll-option-remove {
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border:none;background:none;
  color:var(--t3);cursor:pointer;border-radius:var(--r-sm);
  font-size:16px;flex-shrink:0;transition:all var(--ease);
}
.poll-option-remove:hover { background:var(--bg3);color:var(--err) }
.poll-setting-label {
  display:flex;align-items:center;gap:8px;
  font-size:13px;color:var(--t2);cursor:pointer;
}
.poll-setting-label input[type="checkbox"] { accent-color:var(--a500);width:18px;height:18px;flex-shrink:0 }
.poll-setting-label input[type="checkbox"]:disabled { opacity:0.4;cursor:not-allowed }
.poll-setting-label:has(input:disabled) { opacity:0.5;cursor:not-allowed }
.poll-setting-help {
  display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;border-radius:var(--r-full);
  background:var(--bg3);color:var(--t3);font-size:11px;
  cursor:help;flex-shrink:0;margin-left:2px;
}
.poll-setting-help i { font-size:11px }
.poll-voters {
  display:flex;flex-wrap:wrap;gap:4px;padding:2px 14px 6px;
}
.poll-voter {
  font-size:11px;color:var(--t3);background:var(--bg3);
  padding:1px 6px;border-radius:var(--r-full);
}
.poll-voter:hover { color:var(--a500);text-decoration:none }
.poll-option.poll-closed { opacity:0.8;cursor:default }

/* Notification Bell */
.notif-bell.active { background:var(--a500);color:#fff }
.notif-bell.active:hover { background:var(--a600) }
.notif-bell i { font-size:16px }
.poll-option.poll-closed:hover { border-color:var(--bd) }

/* Post card preview constraints */
.post-card .post-body.truncated { max-height:100px }
.post-card .post-image { max-height:280px }
.post-card .post-images { max-height:280px;overflow:hidden }

/* Feed Density Toggle (masonry via columns) */
.post-feed.dense-feed {
  columns:2;column-gap:12px;
}
.post-feed.dense-feed .post-card {
  margin-bottom:12px;break-inside:avoid;
}
.post-feed.dense-feed .post-card .post-body.truncated { max-height:72px }
.post-feed.dense-feed .post-card .post-image { max-height:160px }
.post-feed.dense-feed .post-card .post-images { max-height:160px }

/* Ad Block in Feed */
.ad-block { margin-bottom:12px }
.ad-label {
  font-size:11px;color:var(--t3);padding:4px 8px;
  display:flex;align-items:center;gap:4px;margin-bottom:4px;
}
.ad-cards .post-card {
  border:2px solid var(--ok);
  background:linear-gradient(135deg, rgba(34,165,94,.04), rgba(34,165,94,.08));
}
[data-theme="dark"] .ad-cards .post-card {
  background:linear-gradient(135deg, rgba(46,204,113,.04), rgba(46,204,113,.08));
}
.ad-dual .ad-cards {
  display:grid;grid-template-columns:1fr 1fr;gap:12px;
}
.ad-dual .ad-cards .post-card { margin-bottom:0 }

/* Nav ellipsis more dropdown */
.topbar-more { flex-shrink:0 }
.topbar-more .sort-tab { cursor:pointer;border:none;font-family:var(--sans) }

/* Ads Timeline Page */
.promo-timeline {
  background:var(--bg1);border:1px solid var(--bdl);
  border-radius:var(--r-lg);overflow-y:auto;max-height:60vh;
}
.promo-row {
  display:flex;align-items:stretch;border-bottom:1px solid var(--bdl);
  min-height:28px;
}
.promo-time-label {
  width:75px;flex-shrink:0;padding:4px 8px;
  font-size:11px;color:var(--t3);border-right:1px solid var(--bdl);
  display:flex;align-items:center;
}
.promo-time-sublabel { color:transparent }
.promo-slot-area {
  flex:1;padding:2px 4px;cursor:pointer;
  transition:background var(--ease);position:relative;
}
.promo-slot-area:hover { background:var(--bg2) }
.promo-slot-area.selecting { background:var(--a100) }
[data-theme="dark"] .promo-slot-area.selecting { background:rgba(14,168,138,.15) }
.promo-slot-block {
  background:var(--a500);color:#fff;border-radius:var(--r-sm);
  padding:2px 8px;font-size:11px;
  display:flex;align-items:center;gap:6px;overflow:hidden;
}
.promo-slot-block.mine { cursor:pointer }
.promo-slot-block.unassigned { background:var(--warn) }
.promo-slot-user { font-weight:700;flex-shrink:0 }
.promo-slot-title {
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.promo-slot-actions {
  flex-shrink:0;display:flex;gap:4px;font-size:14px;
}
.promo-slot-actions i { cursor:pointer;opacity:0.8 }
.promo-slot-actions i:hover { opacity:1 }

/* Ads Modal */
.promo-modal-overlay {
  position:fixed;top:0;left:0;right:0;bottom:0;
  background:rgba(0,0,0,.4);z-index:300;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
}
.promo-modal {
  background:var(--bg1);border:1px solid var(--bd);border-radius:var(--r-lg);
  box-shadow:var(--sh-lg);max-width:400px;width:100%;
}
.promo-modal-header {
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;border-bottom:1px solid var(--bdl);
  font-family:var(--heading);font-weight:700;font-size:15px;
}
.promo-modal-body { padding:16px }

/* Update Popup */
.update-popup-overlay {
  position:fixed;top:0;left:0;right:0;bottom:0;
  background:rgba(0,0,0,.5);z-index:400;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
}
.update-popup {
  background:var(--bg1);border:1px solid var(--bd);border-radius:var(--r-lg);
  box-shadow:var(--sh-lg);max-width:520px;width:100%;overflow:hidden;
  animation:updateSlideIn 0.3s ease;
}
@keyframes updateSlideIn {
  from { opacity:0;transform:translateY(20px) }
  to { opacity:1;transform:translateY(0) }
}
.update-popup-image {
  width:100%;overflow:hidden;
}
.update-popup-image svg { display:block;width:100%;height:auto }
.update-popup-content { padding:20px 24px 24px }
.update-popup-title {
  font-family:var(--heading);font-size:20px;font-weight:700;
  color:var(--t1);margin-bottom:12px;
}
.update-popup-body {
  font-size:14px;color:var(--t2);line-height:1.6;margin-bottom:16px;
}
.update-popup-body ul { padding-left:20px }
.update-popup-body li { margin-bottom:6px;list-style:disc }

/* Responsive — Tablet (iPad portrait & landscape) */
@media (max-width:1024px) {
  .main-content { gap:16px }
  .sidebar-col { width:260px }
  .sort-tabs { flex-wrap:wrap }
  .time-filter { margin-left:0;margin-top:4px;width:100% }
  .data-table { display:block;overflow-x:auto;-webkit-overflow-scrolling:touch }
  .md-toolbar { gap:1px }
  .md-toolbar-btn { width:28px;height:26px;font-size:15px }
}

/* Responsive — Small tablet / phone */
@media (max-width:768px) {
  .main-content { flex-direction:column }
  .sidebar-col { width:100%;order:2 }
  .content-col { order:1 }
  .topbar .sort-tab span { display:none }
  .topbar #search-label { display:none }
  .nest-info { flex-direction:column;align-items:flex-start }
  .nest-icon { margin-top:-24px }
  .profile-header { flex-direction:column;text-align:center }
  .stat-grid { grid-template-columns:repeat(2,1fr) }
  .type-tabs { flex-wrap:wrap }
  .type-tab { min-width:0 }
  .sort-tabs { gap:2px;padding:6px }
  .sort-tab { padding:5px 10px;font-size:12px }
  .sort-tab i { font-size:14px }
  .time-pill { padding:3px 8px;font-size:11px }
  .post-card { border-radius:var(--r-md) }
  .vote-col { min-width:38px;padding:6px 2px }
  .vote-btn { font-size:18px }
  .vote-score { font-size:12px }
  .post-main { padding:8px 10px }
  .post-title { font-size:15px }
  .post-meta { font-size:11px }
  .post-action { font-size:11px;padding:3px 6px }
  .nest-banner { aspect-ratio:4/1 }
  .nest-name { font-size:20px }
  .card-body { padding:12px }
  .settings-section { padding:16px }
  .hide-mobile { display:none !important }
  .post-feed.dense-feed { columns:1 }
  .ad-dual .ad-cards { grid-template-columns:1fr }
  .update-popup { max-width:100% }
  .update-popup-content { padding:16px }
}