/* my.dngnz.com portal — no client-side JavaScript, so everything here has to
   carry the whole interface: state, emphasis, and every affordance. */

:root{
  --void:#07080A;
  --panel:#0D0F14;
  --panel-2:#12151C;
  --line:#1F2431;
  --line-soft:#171B24;
  --ink:#EDF1F8;
  --dim:#9AA5BB;
  --faint:#7E8A9E;
  --signal:#FF5A2B;
  --signal-ink:#160702;
  --ok:#4FC48E;
  --warn:#E9B949;
  --danger:#F26A5C;
  --sans:"Inter","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --radius:10px;
  --pad:clamp(1rem,3.2vw,2rem);
}

*,*::before,*::after{box-sizing:border-box}

html{
  background:var(--void);
  caret-color:var(--signal);
  scrollbar-color:#2A3140 var(--void);
  -webkit-text-size-adjust:100%;
}
body{
  margin:0;
  min-height:100vh;
  display:grid;
  grid-template-columns:15rem 1fr;
  grid-template-rows:1fr auto;
  grid-template-areas:"sidebar main" "sidebar footer";
  background:
    radial-gradient(120% 60% at 50% -10%, rgba(90,116,160,.10), rgba(7,8,10,0) 70%),
    var(--void);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

::selection{background:var(--signal);color:var(--signal-ink)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--void)}
::-webkit-scrollbar-thumb{background:#2A3140;border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:#3A4354}

:focus-visible{outline:2px solid var(--signal);outline-offset:2px;border-radius:4px}

.skip{
  position:absolute;left:-9999px;top:0;
  background:var(--signal);color:var(--signal-ink);
  padding:.6rem 1rem;border-radius:0 0 var(--radius) 0;font-weight:600;z-index:10;
}
.skip:focus{left:0}

/* ---------- chrome ---------- */
header.site{
  grid-area:sidebar;
  display:flex;flex-direction:column;gap:1.25rem;
  padding:1.25rem 1rem;
  border-right:1px solid var(--line);
  background:rgba(13,15,20,.7);
  position:sticky;top:0;height:100vh;align-self:start;overflow-y:auto;
}
.brand{
  display:inline-flex;align-items:center;gap:.6rem;
  text-decoration:none;color:var(--ink);
  padding:.25rem .5rem .75rem;
}
.brand .wordmark{width:88px;height:auto;overflow:visible;display:block}
.brand .wordmark path{fill:none;stroke:currentColor;stroke-width:16;stroke-linecap:round;stroke-linejoin:round}
.brand span{
  font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--faint);
  padding-left:.6rem;border-left:1px solid var(--line);
}

header.site nav{display:flex;flex-direction:column;gap:.15rem}
header.site nav a{
  display:block;
  color:var(--dim);text-decoration:none;font-size:.9rem;font-weight:500;
  padding:.55rem .7rem;border-radius:8px;
}
header.site nav a:hover{color:var(--ink);background:var(--panel-2)}
header.site nav a[aria-current="page"]{color:var(--ink);background:var(--panel-2);box-shadow:inset 0 0 0 1px var(--line)}

.signout{
  display:flex;flex-direction:column;align-items:flex-start;gap:.4rem;
  margin-top:auto;padding-top:1rem;border-top:1px solid var(--line-soft);
}
.signout .who{
  font-size:.85rem;color:var(--dim);max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
button.link{
  background:none;border:0;padding:.25rem;margin:0;
  color:var(--dim);font:inherit;font-size:.85rem;
  text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line);
  cursor:pointer;
}
button.link:hover{color:var(--ink);text-decoration-color:var(--signal)}

main{
  grid-area:main;
  width:100%;max-width:56rem;margin:0 auto;
  padding:clamp(1.5rem,4vw,3rem) var(--pad);
}
body.wide main{max-width:76rem}

footer.site{
  grid-area:footer;
  display:flex;justify-content:space-between;gap:1rem;
  padding:1rem var(--pad);
  border-top:1px solid var(--line-soft);
  font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--faint);
}
footer.site a{color:var(--faint)}
footer.site a:hover{color:var(--dim)}

/* Narrow screens: collapse the sidebar back to a top bar. */
@media (max-width:800px){
  body{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"sidebar" "main" "footer"}
  header.site{
    position:static;height:auto;overflow:visible;
    flex-direction:row;flex-wrap:wrap;align-items:center;gap:1rem;
    border-right:0;border-bottom:1px solid var(--line);
  }
  .brand{padding:0}
  header.site nav{flex-direction:row;flex-wrap:wrap;gap:.25rem;margin-right:auto}
  header.site nav a{border-radius:99px;padding:.4rem .7rem}
  .signout{
    flex-direction:row;align-items:center;gap:.75rem;
    margin-top:0;margin-left:auto;padding-top:0;border-top:0;
  }
}

/* ---------- type ---------- */
h1{font-size:clamp(1.5rem,3.4vw,2rem);line-height:1.15;letter-spacing:-.02em;margin:0 0 .4rem}
h2{font-size:1.1rem;letter-spacing:-.01em;margin:2.5rem 0 .9rem}
h2:first-child{margin-top:0}
p{margin:0 0 1rem}
.lede{color:var(--dim);margin-bottom:2rem;max-width:62ch}
.hint{color:var(--faint);font-size:.85rem;margin:.35rem 0 0}
.gc-geo.ok{color:var(--signal)}
.gc-geo.error{color:var(--danger)}
.admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:1rem;margin-top:1.25rem}
.admin-card{display:flex;flex-direction:column;gap:.35rem;padding:1.1rem 1.2rem;border:1px solid var(--line);border-radius:12px;background:var(--panel-2);text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.admin-card:hover{border-color:var(--signal);transform:translateY(-2px)}
.admin-card-t{font-weight:600;font-size:1.05rem}
.admin-card-d{color:var(--dim);font-size:.88rem}

/* Admin › Scripts — userscript cards */
.us-list{display:flex;flex-direction:column;gap:1rem;margin-top:1.25rem}
.us-card{border:1px solid var(--line);border-radius:12px;background:var(--panel-2);padding:1.1rem 1.25rem}
.us-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.us-id{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;min-width:0}
.us-name{margin:0;font-size:1.12rem;font-weight:650;letter-spacing:-.01em}
.us-ver{font-size:.7rem;font-weight:700;color:var(--faint);border:1px solid var(--line);border-radius:99px;padding:.05rem .45rem}
.us-desc{color:var(--dim);margin:.7rem 0 0;line-height:1.5}
.us-meta{margin:.9rem 0 0;display:grid;gap:.4rem}
.us-meta > div{display:flex;gap:.6rem;font-size:.86rem}
.us-meta dt{flex:0 0 5rem;color:var(--faint);margin:0;text-transform:uppercase;letter-spacing:.05em;font-size:.7rem;font-weight:700;padding-top:.1rem}
.us-meta dd{margin:0;color:var(--dim);min-width:0}
.us-matches{display:flex;flex-wrap:wrap;gap:.35rem}
.us-matches code,.us-meta dd code{font-family:var(--mono);font-size:.78rem;background:var(--void);border:1px solid var(--line-soft);border-radius:6px;padding:.05rem .4rem;color:var(--ink)}
.us-src{margin-top:.95rem;border-top:1px solid var(--line-soft);padding-top:.8rem}
.us-src summary{cursor:pointer;color:var(--dim);font-size:.86rem;font-weight:600;list-style:none;display:inline-flex;align-items:center;gap:.4rem}
.us-src summary::-webkit-details-marker{display:none}
.us-src summary::before{content:"▸";color:var(--faint)}
.us-src[open] summary::before{content:"▾"}
.us-src summary:hover{color:var(--ink)}
.us-code{margin:.75rem 0 0;max-height:26rem;overflow:auto;background:var(--void);border:1px solid var(--line-soft);border-radius:10px;padding:.9rem 1rem;font-family:var(--mono);font-size:.78rem;line-height:1.55;color:var(--ink);white-space:pre;-webkit-overflow-scrolling:touch}
.us-code code{font:inherit;background:none;border:0;padding:0}
a{color:var(--ink);text-decoration-color:var(--line);text-underline-offset:3px}
a:hover{text-decoration-color:var(--signal)}
code,.mono{font-family:var(--mono);font-size:.9em}

/* ---------- panels ---------- */
.panel{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:clamp(1.1rem,3vw,1.6rem);
}
.panel + .panel{margin-top:1rem}
.stack{display:flex;flex-direction:column;gap:1rem}

.notice{
  display:block;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:.85rem 1rem;
  margin:0 0 1.5rem;
  background:var(--panel);
  font-size:.93rem;
}
.notice strong{color:var(--ink)}
.notice.ok{border-color:rgba(79,196,142,.4);background:rgba(79,196,142,.07);color:#CDEBDD}
.notice.warn{border-color:rgba(233,185,73,.4);background:rgba(233,185,73,.07);color:#F0E2BE}
.notice.error{border-color:rgba(242,106,92,.45);background:rgba(242,106,92,.08);color:#F6D2CD}

/* ---------- forms ---------- */
form.card{max-width:30rem}
.field{margin-bottom:1.1rem}
label{display:block;font-size:.85rem;font-weight:500;color:var(--dim);margin-bottom:.35rem}
input[type=text],input[type=email],input[type=password],input[type=url],input[type=tel],input[type=number],input[type=date],select{
  width:100%;
  background:var(--panel-2);
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:8px;
  padding:.6rem .75rem;
  font:inherit;font-size:.95rem;
}
input:focus,select:focus{border-color:#3A4354}
input::placeholder{color:#5C6679}

/* Date inputs: dark native calendar + a tinted, legible picker button. */
input[type=date]{color-scheme:dark;appearance:none;-webkit-appearance:none}
input[type=date]::-webkit-datetime-edit{color:var(--ink)}
input[type=date]::-webkit-datetime-edit-fields-wrapper{color:var(--ink)}
input[type=date]::-webkit-calendar-picker-indicator{
  filter:invert(1) brightness(.8);opacity:.65;cursor:pointer;
  padding:.15rem;border-radius:5px;
}
input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1;background:var(--panel)}
select{appearance:none;padding-right:2rem;
  background-image:linear-gradient(45deg,transparent 50%,var(--dim) 50%),linear-gradient(135deg,var(--dim) 50%,transparent 50%);
  background-position:calc(100% - 18px) 52%,calc(100% - 13px) 52%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
}

.actions{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin-top:1.25rem}

button,.btn{
  display:inline-block;
  font:inherit;font-size:.9rem;font-weight:500;
  padding:.55rem 1.1rem;
  border-radius:8px;
  border:1px solid var(--line);
  background:var(--panel-2);
  color:var(--ink);
  text-decoration:none;
  cursor:pointer;
}
button:hover,.btn:hover{border-color:#3A4354;background:#171B24}
button.primary{background:var(--signal);border-color:var(--signal);color:var(--signal-ink);font-weight:600}
button.primary:hover{background:#FF6B41;border-color:#FF6B41}
button.danger{color:var(--danger);border-color:rgba(242,106,92,.35)}
button.danger:hover{background:rgba(242,106,92,.1);border-color:var(--danger)}
button.small,.btn.small{padding:.3rem .6rem;font-size:.8rem}
button[disabled]{opacity:.45;cursor:not-allowed}
button[disabled]:hover{background:var(--panel-2);border-color:var(--line)}

/* ---------- the one-time password ---------- */
.secret{
  margin:1.25rem 0;
  border:1px solid rgba(255,90,43,.4);
  border-radius:var(--radius);
  background:rgba(255,90,43,.06);
  padding:1.25rem;
}
.secret code{
  display:block;
  font-family:var(--mono);
  font-size:clamp(1.05rem,3.4vw,1.5rem);
  letter-spacing:.14em;
  word-break:break-all;
  color:var(--ink);
  padding:.6rem 0;
  user-select:all;
}
.secret .label{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--signal)}

/* ---------- tables ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
table{border-collapse:collapse;width:100%;font-size:.9rem}
caption{text-align:left;padding:.9rem 1rem;color:var(--faint);font-size:.8rem;border-bottom:1px solid var(--line-soft)}
th,td{text-align:left;padding:.7rem 1rem;border-bottom:1px solid var(--line-soft);vertical-align:middle}
thead th{
  font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);
  font-weight:500;white-space:nowrap;
}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--panel-2)}
td.num,td .stamp{font-family:var(--mono);font-size:.82rem;color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap}
td.who strong{display:block;font-weight:500}
td.who span{color:var(--faint);font-size:.82rem;word-break:break-all}
.who-code code{font-family:var(--mono);font-size:.72rem;color:var(--dim);background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:.02rem .35rem}
td.row-actions{white-space:nowrap;text-align:right}
td.row-actions form{display:inline}
td.row-actions .self{color:var(--faint);font-size:.8rem}

.tag{
  display:inline-block;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.2rem .5rem;border-radius:99px;border:1px solid var(--line);color:var(--dim);
  white-space:nowrap;
}
.tag.admin{color:var(--signal);border-color:rgba(255,90,43,.4)}
.tag.on{color:var(--ok);border-color:rgba(79,196,142,.35)}
.tag.off{color:var(--faint)}
.tag.locked{color:var(--warn);border-color:rgba(233,185,73,.4)}
.tag.pending{color:var(--warn);border-color:rgba(233,185,73,.35)}

.empty{padding:2rem 1rem;text-align:center;color:var(--faint);font-size:.9rem}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

dl.facts{display:grid;grid-template-columns:auto 1fr;gap:.5rem 1.5rem;margin:0}
dl.facts dt{color:var(--faint);font-size:.85rem}
dl.facts dd{margin:0;font-size:.9rem}

/* ---------- narrow screens: rows become blocks ---------- */
@media (max-width:760px){
  header.site{gap:.75rem}
  .signout{width:100%;justify-content:space-between}
  .table-wrap{border:0;background:none;overflow-x:visible}
  table,tbody,tr,td{display:block;width:100%}
  caption{display:block;width:100%;padding:0 0 .75rem;border-bottom:0}
  thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  tbody tr{
    background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
    padding:.4rem .2rem;margin-bottom:.75rem;
  }
  tbody tr:hover{background:var(--panel)}
  td{border-bottom:1px solid var(--line-soft);display:flex;gap:1rem;justify-content:space-between;align-items:baseline}
  td:last-child{border-bottom:0}
  td::before{
    content:attr(data-label);
    color:var(--faint);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
    flex:0 0 auto;
  }
  td.row-actions{justify-content:flex-end;flex-wrap:wrap;gap:.4rem}
  td.who{flex-direction:column;align-items:flex-start;gap:.15rem}
}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}

/* ------------------------------------------------------------ pages editor */
.crumbs{font-size:.85rem;color:var(--faint);margin:0 0 .6rem}
.crumbs a{color:var(--dim)}

.site-state{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:flex-end;justify-content:space-between}
.site-state .actions{margin-top:0}

.editor-grid{display:grid;grid-template-columns:minmax(0,1fr) 20rem;gap:2rem;align-items:start}
.editor-main{min-width:0}
.editor-side{position:sticky;top:1rem;display:flex;flex-direction:column;gap:1rem}
.editor-side h2{margin-top:0}
.editor-side .panel{padding:1rem}
.editor-side h3{margin:0 0 .5rem;font-size:.95rem}
@media (max-width:900px){
  .editor-grid{grid-template-columns:1fr}
  .editor-side{position:static}
}

/* one block, collapsed until opened — no script needed */
.block-card{
  border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);
  margin-bottom:.75rem;overflow:hidden;
}
.block-card[open]{border-color:#2C3446}
.block-card > summary{
  display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;
  padding:.8rem 1rem;cursor:pointer;list-style:none;
}
.block-card > summary::-webkit-details-marker{display:none}
.block-card > summary::before{
  content:"▸";color:var(--faint);font-size:.8rem;transition:transform 120ms ease;
}
.block-card[open] > summary::before{transform:rotate(90deg)}
.block-card > summary:hover{background:var(--panel-2)}
.block-kind{
  font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--signal);
  border:1px solid rgba(255,90,43,.3);border-radius:99px;padding:.15rem .55rem;
}
.block-summary{color:var(--dim);font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.block-card[data-hidden="1"] > summary{opacity:.6}
.block-card > form{padding:0 1rem 1rem;border-top:1px solid var(--line-soft)}
.block-tools{
  display:flex;gap:.4rem;flex-wrap:wrap;
  padding:.7rem 1rem;border-top:1px solid var(--line-soft);background:var(--void);
}
.block-tools form{display:inline}
button.danger.small{color:var(--danger);border-color:rgba(242,106,92,.3)}
.danger-link{color:var(--danger);border-color:rgba(242,106,92,.3)}

fieldset.repeat{
  border:1px solid var(--line-soft);border-radius:8px;padding:.9rem 1rem .2rem;margin:0 0 .9rem;
}
fieldset.repeat.tight{padding-bottom:.1rem}
fieldset legend{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);padding:0 .4rem}

.field.check{display:flex;align-items:baseline;gap:.55rem;flex-wrap:wrap;margin-bottom:1rem}
.field.check label{margin:0;color:var(--ink);font-weight:400}
.field.check .hint{flex-basis:100%;margin:0}
input[type=checkbox]{accent-color:var(--signal);width:1rem;height:1rem}
input[type=color]{
  width:4rem;height:2.2rem;padding:.2rem;background:var(--panel-2);
  border:1px solid var(--line);border-radius:8px;
}
input[type=file]{
  width:100%;font:inherit;font-size:.85rem;color:var(--dim);
  padding:.5rem;background:var(--panel-2);border:1px dashed var(--line);border-radius:8px;
}
textarea{
  width:100%;background:var(--panel-2);color:var(--ink);border:1px solid var(--line);
  border-radius:8px;padding:.6rem .75rem;font:inherit;font-size:.95rem;resize:vertical;
}
textarea.mono{font-family:var(--mono);font-size:.85rem;line-height:1.5}
textarea:focus{border-color:#3A4354}

fieldset.image-field{border:1px solid var(--line-soft);border-radius:8px;padding:.9rem 1rem;margin:0 0 1.1rem}
fieldset.image-field .sub{display:block;margin:.7rem 0 .3rem;font-size:.8rem;color:var(--faint)}
.image-field .thumb{display:flex;align-items:center;gap:.9rem;margin-bottom:.7rem}
.image-field .thumb img{max-width:8rem;max-height:5rem;border-radius:6px;border:1px solid var(--line)}
.image-field .thumb .remove{display:flex;align-items:center;gap:.4rem;font-size:.85rem;color:var(--dim);margin:0}
.xcover-row{display:flex;align-items:center;gap:.65rem;margin-top:.7rem;flex-wrap:wrap}
.xcover-status{font-size:.85rem;color:var(--dim)}
.xcover-status.ok{color:var(--signal)}
.xcover-status.error{color:var(--danger)}
.xcover-preview img{height:2.4rem;width:auto;border-radius:6px;border:1px solid var(--line);display:block}

/* "Suggest from video" — three selectable frame thumbnails. */
.xthumbs-row{display:flex;align-items:center;gap:.65rem;margin-top:.55rem;flex-wrap:wrap}
.xthumbs-status{font-size:.85rem;color:var(--dim)}
.xthumbs-status.ok{color:var(--signal)}
.xthumbs-status.error{color:var(--danger)}
.xthumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.6rem}
.xthumb{position:relative;padding:0;border:2px solid var(--line);border-radius:9px;overflow:hidden;background:var(--void);cursor:pointer;display:block;line-height:0;transition:border-color .12s ease,transform .12s ease}
.xthumb:hover{border-color:#3A4354;transform:translateY(-1px)}
.xthumb img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block}
.xthumb-cap{display:block;padding:.2rem .3rem;font-size:.68rem;line-height:1.3;color:var(--dim);text-align:center;background:var(--panel-2)}
.xthumb.is-selected{border-color:var(--signal)}
.xthumb.is-selected .xthumb-cap{color:var(--signal);font-weight:700}
.xthumb.is-selected::after{content:"✓";position:absolute;top:.25rem;right:.35rem;width:18px;height:18px;line-height:18px;text-align:center;font-size:.7rem;font-weight:800;color:var(--signal-ink);background:var(--signal);border-radius:50%}

/* Tiers: circular icon tiles */
.tier-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem 1.1rem;margin-bottom:1.5rem}
.tier-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:.4rem .3rem 1rem;border-radius:12px}
.tier-card:hover,.tier-card:focus-within{background:var(--panel-2)}
.tier-form{display:flex;flex-direction:column;align-items:center;width:100%;margin:0}
.tier-icon{position:relative;width:92px;height:92px;border-radius:50%;display:grid;place-items:center;
  border:2px dashed var(--line);color:var(--faint);cursor:pointer;transition:border-color .15s,color .15s,box-shadow .15s}
.tier-icon:hover{border-color:var(--signal);color:var(--signal)}
.tier-icon .tier-icon-file{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border-radius:50%}
.tier-icon .tier-icon-file:focus-visible{outline:2px solid var(--signal);outline-offset:3px;border-radius:50%}
.tier-icon.filled{border-style:solid;border-color:var(--line);overflow:hidden}
.tier-icon.filled img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.tier-icon-cam{position:absolute;right:2px;bottom:2px;width:26px;height:26px;border-radius:50%;
  display:grid;place-items:center;background:var(--signal);color:var(--signal-ink);
  box-shadow:0 2px 6px rgba(0,0,0,.45);opacity:0;transform:scale(.85);transition:opacity .15s,transform .15s;pointer-events:none}
.tier-icon:hover .tier-icon-cam,.tier-icon:focus-within .tier-icon-cam{opacity:1;transform:scale(1)}
.tier-form .tier-name{margin-top:.75rem;width:100%;text-align:center;background:transparent;border:1px solid transparent;border-radius:7px;
  color:var(--ink);font-weight:600;font-size:.95rem;padding:.32rem .3rem;font-family:inherit}
.tier-form .tier-name:hover{border-color:var(--line-soft)}
.tier-form .tier-name:focus{outline:none;border-color:var(--signal);background:var(--panel)}
.tier-form .tier-desc{margin-top:.3rem;width:100%;text-align:center;background:transparent;border:1px solid transparent;border-radius:7px;
  color:var(--dim);font-size:.8rem;padding:.28rem .3rem;font-family:inherit}
.tier-form .tier-desc:hover{border-color:var(--line-soft)}
.tier-form .tier-desc:focus{outline:none;border-color:var(--signal);background:var(--panel);color:var(--ink)}
.tier-form .tier-desc::placeholder{color:var(--faint)}
.tier-remove{display:flex;align-items:center;gap:.35rem;justify-content:center;margin-top:.45rem;font-size:.78rem;color:var(--dim)}
.tier-save{margin-top:.6rem;visibility:hidden}
.tier-card:hover .tier-save,.tier-form:focus-within .tier-save{visibility:visible}
.tier-ctrls{display:flex;gap:.3rem;justify-content:center;margin-top:.55rem;opacity:0;transition:opacity .15s}
.tier-card:hover .tier-ctrls,.tier-card:focus-within .tier-ctrls{opacity:1}
.tier-ctrls form{margin:0}
.field-label{display:block;margin-bottom:.4rem;color:var(--dim);font-size:.85rem}

.mode-note{
  border:1px solid var(--line-soft);border-left:2px solid var(--warn);
  border-radius:6px;padding:.8rem 1rem;margin:0 0 1.1rem;background:var(--void);
}
.mode-note p{margin:0 0 .6rem;font-size:.85rem;color:var(--dim);line-height:1.5}
.mode-note p:last-child{margin-bottom:0}
.mode-note strong{color:var(--ink)}

.palette{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:.6rem}
.palette form{display:contents}
button.palette-item{
  display:flex;flex-direction:column;gap:.25rem;align-items:flex-start;text-align:left;
  width:100%;height:100%;padding:.85rem 1rem;
}
.palette-name{font-weight:500}
.palette-hint{font-size:.78rem;color:var(--faint);line-height:1.4;font-weight:400}

.tokens{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.tokens li{display:grid;gap:.1rem}
.tokens code{font-family:var(--mono);font-size:.8rem;color:var(--ink)}
.tokens span{font-size:.78rem;color:var(--faint)}

.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:1rem;margin-top:1.5rem}
.media-item{
  margin:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel);
  display:flex;flex-direction:column;
}
.media-item img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:var(--void)}
.media-item figcaption{padding:.6rem .75rem;display:grid;gap:.2rem;flex:1}
.media-item .name{font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.media-item .meta{font-size:.7rem;color:var(--faint)}
.media-item form{padding:0 .75rem .75rem}
.break{word-break:break-all}

/* pages list: address subline + adult tag + small primary action */
.who .row-sub{
  display:block;margin-top:.15rem;
  font-family:var(--mono);font-size:.75rem;color:var(--faint);
}
.tag.adult{color:var(--danger);border-color:rgba(242,106,92,.4)}
td.row-actions{display:flex;gap:.4rem;justify-content:flex-end;flex-wrap:wrap}
.btn.small.primary{background:var(--signal);border-color:var(--signal);color:var(--signal-ink);font-weight:600}
.btn.small.primary:hover{background:#FF6B41;border-color:#FF6B41}

/* ---------------------------------------------------------- link tree editor */
.tree{list-style:none;margin:0;padding:0}
.tree.root{margin-top:1rem}
.tree .tree{margin:.35rem 0 .35rem 1.25rem;padding-left:1rem;border-left:1px solid var(--line)}
.node{margin:.35rem 0}
.node-row{
  display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;
  padding:.55rem .8rem;border:1px solid var(--line);border-radius:9px;background:var(--panel);
}
.node.kind-group > .node-row{background:var(--panel-2)}
.node-badge{
  font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.15rem .5rem;border-radius:99px;border:1px solid var(--line);color:var(--faint);white-space:nowrap;
}
.node-badge.group{color:var(--signal);border-color:rgba(255,90,43,.4)}
.node-badge.link{color:var(--ok);border-color:rgba(79,196,142,.35)}
.node-ic{display:inline-flex;color:var(--dim)}
.node-ic .link-icon{width:20px;height:20px}
.node-thumb{width:28px;height:28px;border-radius:6px;object-fit:cover}
.node-title{font-weight:500}
.node-url{color:var(--faint);font-size:.8rem;font-family:var(--mono);text-decoration:none}
.node-url:hover{color:var(--dim)}
.node-actions{display:flex;gap:.35rem;align-items:center;margin-left:auto;flex-wrap:wrap}
.node-actions form{display:inline}
.node-panel{margin:.35rem 0 .35rem .5rem}
.node-panel > summary{
  cursor:pointer;font-size:.82rem;color:var(--dim);padding:.25rem .5rem;
  border-radius:6px;display:inline-block;
}
.node-panel > summary:hover{color:var(--ink);background:var(--panel-2)}
.node-panel.add > summary{color:var(--signal)}
.node-panel form{margin-top:.5rem;max-width:34rem}
.link-add-form{padding:1rem}
.image-field-lite{margin-bottom:1rem}
button.small[title^="Move"]{font-family:var(--mono);line-height:1;min-width:2rem}

/* link editor: top action bar + CSS-only (:target) modals */
.link-actions-bar{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:0 0 1.5rem}
.link-actions-bar .hint{margin:0 0 0 auto}

.modal{position:fixed;inset:0;z-index:60;display:none}
.modal:target{display:flex;align-items:center;justify-content:center;padding:max(3vh,1rem) 1rem;overflow:auto}
.modal-scrim{position:fixed;inset:0;background:radial-gradient(130% 130% at 50% -10%,rgba(7,8,10,.5),rgba(7,8,10,.82));backdrop-filter:blur(5px) saturate(115%)}
.modal-card{
  position:relative;z-index:1;width:min(34rem,100%);max-height:min(88vh,46rem);overflow-y:auto;
  background:var(--panel);border:1px solid var(--line);border-radius:16px;
  padding:0 1.4rem 1.4rem;
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 34px 84px -22px rgba(0,0,0,.72),0 8px 24px -12px rgba(0,0,0,.5);
  scrollbar-width:thin;
}
/* The card is the scroll surface; the header sticks to its top so the title
   and close control stay in reach through long forms. */
.modal-head{
  position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.15rem 0 .85rem;margin-bottom:1.1rem;background:var(--panel);border-bottom:1px solid var(--line-soft);
}
.modal-head h2{margin:0;font-size:1.15rem;font-weight:650;letter-spacing:-.012em;line-height:1.25}
.modal-x{
  flex:0 0 auto;color:var(--dim);display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;margin:-.25rem -.45rem -.25rem 0;border-radius:9px;border:1px solid transparent;
  transition:color .12s ease,background .12s ease,border-color .12s ease,transform .08s ease;
}
.modal-x:hover{color:var(--ink);background:var(--panel-2);border-color:var(--line)}
.modal-x:active{transform:scale(.93)}
.modal form{margin:0}
.modal .field:last-of-type{margin-bottom:.5rem}
/* Actions read as a footer, set off from the content above. */
.modal .actions{margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--line-soft)}
@media (prefers-reduced-motion:no-preference){
  .modal:target .modal-card{animation:modal-in .22s cubic-bezier(.16,1,.3,1)}
  .modal:target .modal-scrim{animation:modal-fade .22s ease}
}
@keyframes modal-in{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes modal-fade{from{opacity:0}to{opacity:1}}

/* =========================================================================
   Pages editor — block cards with icon chips + control cluster, pill palette
   (restyle; overrides the earlier .block-card / .palette rules)
   ========================================================================= */
.add-block-bar{
  display:flex;align-items:flex-start;gap:.85rem;flex-wrap:wrap;
  margin:0 0 1.25rem;padding:.9rem 1rem;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);
}
.add-block-label{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);padding-top:.55rem;white-space:nowrap}
.add-pills{display:flex;flex-wrap:wrap;gap:.4rem}
.add-pills form{display:inline-flex;margin:0}
.add-pill{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.45rem .8rem;border-radius:99px;border:1px solid var(--line);
  background:var(--panel-2);color:var(--ink);font-size:.85rem;font-weight:500;cursor:pointer;
}
.add-pill:hover{border-color:color-mix(in srgb,var(--signal) 50%,var(--line))}
.add-pill-ic{display:inline-flex;color:var(--signal)}
.add-pill-ic .blk-ic{width:16px;height:16px}
.empty-blocks{color:var(--faint);padding:2rem 1rem;text-align:center;border:1px dashed var(--line);border-radius:var(--radius)}

.block-card{position:relative;border:1px solid var(--line);border-radius:12px;background:var(--panel);margin-bottom:.6rem;overflow:visible}
.block-card[open]{border-color:#2C3446}
.block-card.is-hidden{opacity:.6}

.block-card > summary.blk-head{
  display:flex;align-items:center;gap:.7rem;
  padding:.7rem 12rem .7rem .8rem;
  cursor:pointer;list-style:none;border-radius:12px;
}
.block-card > summary.blk-head::-webkit-details-marker{display:none}
.block-card > summary.blk-head::marker{content:""}
.block-card > summary.blk-head::before{content:none}
.block-card[open] > summary.blk-head{border-bottom:1px solid var(--line-soft);border-radius:12px 12px 0 0}
.block-card > summary.blk-head:hover{background:transparent}

.blk-drag{display:inline-flex;color:var(--faint);cursor:grab;flex:0 0 auto}
.blk-drag .ctrl-ic{width:18px;height:18px}
.blk-chip{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:9px;flex:0 0 auto;
  background:color-mix(in srgb,var(--signal) 15%,var(--panel-2));color:var(--signal);
}
.blk-chip .blk-ic{width:19px;height:19px}
.blk-type{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--ink);white-space:nowrap;flex:0 0 auto}
.blk-sum{color:var(--faint);font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.blk-head .tag.off{flex:0 0 auto}
.blk-chevron{display:inline-flex;color:var(--faint);transition:transform .15s ease;flex:0 0 auto}
.block-card[open] .blk-chevron{transform:rotate(90deg)}

.blk-ctrls{position:absolute;top:.62rem;right:.7rem;display:flex;align-items:center;gap:.35rem;z-index:2}
.blk-ctrls form{display:inline-flex;margin:0}
.ctrl-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;padding:0;border-radius:8px;
  border:1px solid var(--line);background:var(--panel-2);color:var(--dim);cursor:pointer;
}
.ctrl-btn:hover{color:var(--ink);border-color:#3A4354}
.ctrl-btn.danger:hover{color:var(--danger);border-color:rgba(242,106,92,.4)}
.ctrl-btn[disabled]{opacity:.35;cursor:not-allowed}
.ctrl-btn[disabled]:hover{color:var(--dim);border-color:var(--line)}
.ctrl-ic{width:18px;height:18px}

.switch{
  width:36px;height:20px;border-radius:99px;border:none;padding:0;position:relative;cursor:pointer;
  background:#2A3140;flex:0 0 auto;
}
.switch .knob{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#8E9AB4;transition:left .15s ease,background .15s ease}
.switch.on{background:var(--signal)}
.switch.on .knob{left:18px;background:#fff}

.blk-form{padding:0 1rem 1.1rem}
.block-card[open] .blk-form{padding-top:1rem}

@media (max-width:680px){
  .block-card > summary.blk-head{padding:.7rem .8rem 3rem}
  .blk-ctrls{top:auto;bottom:.6rem;right:.7rem}
  .add-block-label{padding-top:0}
}

/* ---- editor v2: always-visible previews + modal editing ---- */
.block-card > .blk-head{
  display:flex;align-items:center;gap:.7rem;
  padding:.7rem 14rem .7rem .8rem;min-height:54px;
}
.blk-preview{border-top:1px solid var(--line-soft)}

.buttons-editor{border-top:1px solid var(--line-soft);padding:1rem}
.buttons-layout{display:flex;align-items:center;gap:.5rem;margin-bottom:.9rem}
.buttons-layout label{margin:0;font-size:.8rem;color:var(--dim)}
.buttons-layout select{width:auto;min-width:7rem}
.buttons-preview{display:flex;gap:.6rem;flex-wrap:wrap;align-items:stretch}
.buttons-preview.layout-grid,.buttons-preview.layout-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr))}
.btn-card-link{display:flex;border-radius:10px;text-decoration:none}
.btn-card-link .btn-preview{width:100%;cursor:pointer}
.btn-card-link:hover .btn-preview{outline:2px solid color-mix(in srgb,var(--signal) 55%,transparent);outline-offset:2px}
.btn-add-form{display:flex}
.btn-add{
  display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1rem;
  border-radius:10px;border:1px dashed var(--line);background:transparent;color:var(--dim);
  cursor:pointer;font:inherit;font-size:.85rem;
}
.btn-add:hover{color:var(--ink);border-color:var(--signal)}
.btn-add .ctrl-ic{width:16px;height:16px}
.modal-remove{margin-top:.9rem;text-align:center;border-top:1px solid var(--line-soft);padding-top:.9rem}
.danger-link{background:none;border:0;color:var(--danger);cursor:pointer;font:inherit;text-decoration:underline;text-underline-offset:3px}

@media (max-width:680px){
  .block-card > .blk-head{padding:.7rem .8rem 3rem}
}

/* links editor: unify node actions to icon buttons (like the pages editor) */
.node-actions{gap:.3rem}
.node-actions form{display:inline-flex;margin:0}
.node-actions .ctrl-btn{width:30px;height:30px}

/* videos editor: inline category rename + tag chips in the table */
.inline-rename{display:flex;gap:.4rem;align-items:center}
.inline-rename input{width:auto;flex:1;min-width:8rem}
td .tag{margin:0 .15rem .15rem 0}

/* apps editor: screenshot manager + version list */
.shot-admin{display:grid;grid-template-columns:repeat(auto-fill,minmax(6rem,1fr));gap:.6rem;margin-bottom:1rem}
.shot-admin-item{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--void)}
.shot-admin-item img{width:100%;aspect-ratio:9/16;object-fit:cover;display:block}
.shot-admin-ctrls{display:flex;gap:.25rem;padding:.35rem;justify-content:center;flex-wrap:wrap}
.app-ver-list{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.75rem}


/* modern drag-and-drop upload zones (native drop target, no JS) */
.dropzone{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;text-align:center;padding:1.5rem 1rem;border:1.5px dashed var(--line);border-radius:12px;background:var(--panel-2);color:var(--dim);cursor:pointer;transition:border-color .15s ease,background .15s ease}
.dropzone:hover{border-color:color-mix(in srgb,var(--signal) 55%,var(--line));color:var(--ink);background:var(--panel)}
.dropzone input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.dz-ic{color:var(--signal);display:inline-flex}
.dz-text{font-size:.9rem;font-weight:500}
.dz-hint{font-size:.78rem;color:var(--faint)}


/* tag selection */
.tag-picker{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.5rem}
.tag-pick{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .6rem;border:1px solid var(--line);border-radius:99px;font-size:.82rem;color:var(--dim);cursor:pointer}
.tag-pick input{accent-color:var(--signal)}
.tag-pick:hover{color:var(--ink)}
/* ---------- GlobalConnect ---------- */
.gc-map{
  height:70vh;min-height:420px;width:100%;
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  background:#0b0e13;
}
/* Dark Leaflet theme, to match the portal. */
.gc-map .leaflet-container{background:#0b0e13}
.gc-map .leaflet-bar{border-color:var(--line);box-shadow:0 1px 6px rgba(0,0,0,.5)}
.gc-map .leaflet-control-zoom a{background:var(--panel);color:var(--ink);border-color:var(--line)}
.gc-map .leaflet-control-zoom a:hover{background:var(--panel-2);color:var(--ink)}
.gc-map .leaflet-control-attribution{background:rgba(13,15,20,.78);color:var(--faint)}
.gc-map .leaflet-control-attribution a{color:var(--dim)}
.gc-map .leaflet-popup-content-wrapper{
  background:var(--panel);color:var(--ink);
  border:1px solid var(--line);border-radius:10px;box-shadow:0 6px 24px rgba(0,0,0,.55);
}
.gc-map .leaflet-popup-tip{background:var(--panel);border:1px solid var(--line)}
.gc-map .leaflet-popup-content{font-family:var(--sans);font-size:.85rem;line-height:1.55;color:var(--dim)}
.gc-map .leaflet-popup-content strong{color:var(--ink)}
.gc-map .leaflet-popup-content a{color:var(--signal)}
/* Float the close button outside the popup box, top-right, as a round chip.
   The selector is deliberately specific to beat Leaflet's own default rule. */
.gc-map .leaflet-popup a.leaflet-popup-close-button{
  top:-12px;right:-12px;width:26px;height:26px;padding:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--panel-2);border:1px solid var(--line);border-radius:50%;
  color:var(--dim);font:700 16px/1 var(--sans);box-shadow:0 3px 10px rgba(0,0,0,.5);
}
.gc-map .leaflet-popup a.leaflet-popup-close-button:hover{color:var(--ink);border-color:var(--signal);background:var(--panel)}
/* Signal-coloured pin (pure CSS, no marker image). */
.gc-pin span{
  display:block;width:14px;height:14px;border-radius:50%;
  background:var(--signal);border:2px solid #fff;
  box-shadow:0 0 0 2px rgba(255,90,43,.30),0 1px 4px rgba(0,0,0,.7);
}
/* Role-tinted pins (single markers): Dom red, Sub yellow, Vers green. */
.gc-pin-dom span{background:#F26A5C;box-shadow:0 0 0 2px rgba(242,106,92,.32),0 1px 4px rgba(0,0,0,.7)}
.gc-pin-sub span{background:#E9B949;box-shadow:0 0 0 2px rgba(233,185,73,.32),0 1px 4px rgba(0,0,0,.7)}
.gc-pin-switch span{background:#F5821F;box-shadow:0 0 0 2px rgba(245,130,31,.32),0 1px 4px rgba(0,0,0,.7)}
/* Filter bar above the map. */
.gc-mapbar{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin-bottom:.9rem}
.gc-mapbar input[type=search]{
  flex:1;min-width:14rem;
  background:var(--panel-2);color:var(--ink);border:1px solid var(--line);border-radius:8px;
  padding:.55rem .75rem;font:inherit;font-size:.9rem;
}
.gc-mapbar input[type=search]:focus{border-color:#3A4354;outline:none}
.gc-mapbar input[type=search]::placeholder{color:#5C6679}
.gc-mapbar select{width:auto;min-width:12rem}
.gc-count{color:var(--faint);font-size:.85rem;margin-left:auto}
/* Connection form rows. */
.field-row{display:flex;gap:1rem;flex-wrap:wrap}
.field-row>.field{flex:1;min-width:11rem;margin:0}
.links-field .link-row{display:flex;gap:.5rem;margin-bottom:.4rem}
.links-field .link-row input{flex:1;min-width:0}
.links-field .link-row input:first-child{max-width:14rem}
.links-field .link-vis{flex:0 0 auto;width:auto;min-width:6.5rem}
.link-vis{width:auto;min-width:7rem}
.special-link{align-items:flex-start}
.special-link .field:last-child{flex:0 0 auto;min-width:8rem}
.gc-card-badges{display:inline-flex;align-items:center;gap:.4rem;flex:0 0 auto;align-self:flex-start}
.gc-internal{font-size:.62rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--warn);
  border:1px solid rgba(233,185,73,.4);background:rgba(233,185,73,.1);border-radius:99px;padding:.1rem .45rem}
details.coords{border:1px solid var(--line-soft);border-radius:8px;padding:.5rem .75rem}
details.coords summary{cursor:pointer;color:var(--dim);font-size:.9rem}

/* GlobalConnect: role/tag chips + popup extras */
.row-tags{display:block;margin-top:.25rem}
.pct{color:var(--faint);font-size:.8rem}
.tag.role-dom{border-color:rgba(242,106,92,.45);color:#F6D2CD}
.tag.role-switch{border-color:rgba(245,130,31,.45);color:#F6D2B0}
.tag.role-sub{border-color:rgba(233,185,73,.45);color:#F0E1AE}
.gc-map .gc-pop-meta{color:var(--signal);font-size:.8em;font-weight:600}
.gc-map .gc-pop-tags{display:block;margin-top:.35rem}
.gc-map .gc-pop-tags span{display:inline-block;background:var(--panel-2);border:1px solid var(--line);border-radius:99px;padding:.05rem .45rem;margin:.15rem .25rem 0 0;font-size:.72rem;color:var(--dim)}

/* GlobalConnect avatars */
.who .avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;vertical-align:middle;margin-right:.55rem;border:1px solid var(--line)}
.gc-map .gc-pop-photo{width:100%;max-height:120px;object-fit:cover;border-radius:6px;margin-bottom:.4rem;display:block}

/* GlobalConnect: multi-contact marker + popup pager */
.gc-pin-multi span{
  display:block;width:26px;height:26px;border-radius:50%;
  background:var(--signal);border:2px solid #fff;
  box-shadow:0 0 0 2px rgba(255,90,43,.30),0 1px 4px rgba(0,0,0,.7);
  color:#fff;font:600 12px/22px var(--sans);text-align:center;
}
.gc-map .gc-nav{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin:0 0 .5rem;padding-bottom:.4rem;border-bottom:1px solid var(--line)}
.gc-map .gc-nav button{background:var(--panel-2);border:1px solid var(--line);color:var(--ink);border-radius:6px;min-width:1.9rem;padding:.1rem .4rem;font-size:1.05rem;line-height:1.4;cursor:pointer}
.gc-map .gc-nav button:hover{background:#1b2029;border-color:#3A4354}
.gc-map .gc-idx{color:var(--faint);font-size:.75rem}

/* GlobalConnect polish: table name/avatars, image preview, map cards */
.gc-name{display:flex;align-items:center;gap:.6rem}
.gc-name-txt{display:flex;flex-direction:column;min-width:0}
.gc-name-txt .row-tags{margin-top:.2rem}
.gc-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:1px solid var(--line)}
.gc-avatar-fb{display:inline-flex;align-items:center;justify-content:center;background:var(--panel-2);color:var(--dim);font:600 12px/1 var(--sans)}
.pct{display:inline-block;font-size:.72rem;color:var(--dim);background:var(--panel-2);border:1px solid var(--line);border-radius:99px;padding:.05rem .4rem;vertical-align:middle}

/* Connections as cards, with a role-coloured left stripe. */
.gc-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(20.5rem,1fr));gap:1rem;margin-top:1rem}
.gc-card{--gc-stripe:#3a3f4d;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:.9rem;
  padding:1.15rem 1.2rem 1.05rem 1.4rem;border:1px solid var(--line);border-radius:16px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel-2) 88%,var(--panel)) 0%,var(--panel-2) 100%);
  transition:border-color .14s ease,transform .14s ease,box-shadow .14s ease}
.gc-card[hidden]{display:none}
.gc-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--gc-stripe)}
.gc-card::after{content:"";position:absolute;left:0;top:0;bottom:0;width:64px;pointer-events:none;
  background:linear-gradient(90deg,color-mix(in srgb,var(--gc-stripe) 16%,transparent),transparent)}
.gc-card:hover{border-color:#3A4354;transform:translateY(-2px);box-shadow:0 14px 30px -18px rgba(0,0,0,.8)}
.gc-card.gc-role-dom{--gc-stripe:var(--danger)}
.gc-card.gc-role-switch{--gc-stripe:#F5821F}
.gc-card.gc-role-sub{--gc-stripe:var(--warn)}
.gc-card > *{position:relative;z-index:1}
.gc-card-head{display:flex;align-items:center;gap:.85rem}
.gc-card-av{flex:0 0 auto;line-height:0}
.gc-card .gc-avatar{width:76px;height:76px;border-radius:18px;box-shadow:0 0 0 1px var(--line),0 0 0 3px color-mix(in srgb,var(--gc-stripe) 22%,transparent)}
.gc-card .gc-avatar-fb{font-size:1.5rem}
.gc-card-h-txt{min-width:0;flex:1 1 auto}
.gc-card-name{margin:0;font-size:1.06rem;font-weight:650;letter-spacing:-.012em;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gc-card-name a{color:inherit;text-decoration:none}
.gc-card-name a:hover{text-decoration:underline}
.gc-card-place{display:flex;align-items:center;gap:.32rem;margin:.28rem 0 0;color:var(--dim);font-size:.85rem;min-width:0}
.gc-card-place span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gc-pin-ic{flex:0 0 auto;color:var(--faint)}
.gc-card-role{flex:0 0 auto;align-self:flex-start}
/* Connection-strength meter */
.gc-card-conn-h{display:flex;justify-content:space-between;align-items:baseline;font-size:.76rem;color:var(--faint);margin-bottom:.35rem}
.gc-card-conn-v{color:var(--ink);font-weight:700;font-size:.82rem}
.gc-meter{height:6px;border-radius:99px;background:var(--panel);border:1px solid var(--line-soft);overflow:hidden}
.gc-meter-fill{display:block;height:100%;width:0;border-radius:99px;background:var(--gc-stripe);transition:width .5s cubic-bezier(.16,1,.3,1)}
.gc-card-facts{margin:0;display:grid;gap:.4rem}
.gc-card-facts > div{display:flex;justify-content:space-between;gap:.8rem;font-size:.86rem;min-width:0}
.gc-card-facts dt{margin:0;color:var(--faint);flex:0 0 auto}
.gc-card-facts dd{margin:0;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.gc-card-tags{display:flex;flex-wrap:wrap;gap:.32rem}
.gc-card-foot{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:auto;padding-top:.75rem;border-top:1px solid var(--line-soft)}
.gc-card-status{display:inline-flex;align-items:center;gap:.42rem;font-size:.78rem;color:var(--faint)}
.gc-card-status.is-on{color:var(--ok)}
.gc-dot{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 18%,transparent)}
.gc-card-actions{display:inline-flex;gap:.25rem}
.gc-filterbar{margin-top:1rem}
.gc-lowtoggle{display:inline-flex;align-items:center;gap:.45rem;font-size:.85rem;color:var(--dim);white-space:nowrap;cursor:pointer;padding:.2rem .1rem}
.gc-lowtoggle input{accent-color:var(--signal)}
.gc-lowtoggle:hover{color:var(--ink)}

.dropzone{position:relative}
.dz-preview{display:none;max-width:100%;max-height:150px;border-radius:8px;margin:0 auto}
.dropzone.has-preview .dz-preview{display:block}
.dropzone.has-preview .dz-ic,.dropzone.has-preview .dz-text{display:none}

.gc-map .gc-card-head{display:flex;gap:.6rem;align-items:center;margin-bottom:.5rem}
.gc-av{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:1px solid var(--line)}
.gc-av-fb{display:flex;align-items:center;justify-content:center;background:var(--panel-2);color:var(--dim);font:600 15px/1 var(--sans)}
.gc-card-id{display:flex;flex-direction:column;gap:.12rem;min-width:0}
.gc-card-id strong{color:var(--ink);font-size:.95rem}
.gc-card-meta{color:var(--signal);font-size:.74rem;font-weight:600}
.gc-card-place{color:var(--faint);font-size:.78rem}
.gc-map .gc-rows{display:flex;flex-direction:column;gap:.12rem;margin-bottom:.45rem}
.gc-map .gc-row{color:var(--dim);font-size:.8rem}
.gc-map a.gc-row-link{color:var(--signal)}
.gc-map .gc-links{display:flex;flex-wrap:wrap;gap:.3rem;margin-bottom:.35rem}
.gc-map a.gc-link{background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:.12rem .5rem;font-size:.75rem;color:var(--ink);text-decoration:none}
.gc-map a.gc-link:hover{border-color:var(--signal)}

/* ChastityLog */
.cl-toolbar{display:flex;align-items:center;gap:1rem;margin:0 0 1rem}
.cl-toolbar strong{font-size:1.1rem}
.cl-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:1.5rem;background:#0b0b0d}
.cl-card svg{width:100%;height:auto;display:block}

/* Galleries */
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;margin-bottom:1.5rem}
.gal-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel);text-decoration:none;color:var(--ink)}
.gal-card:hover{border-color:#3A4354}
.gal-cover{aspect-ratio:4/3;background:var(--panel-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.gal-cover img{width:100%;height:100%;object-fit:cover;display:block}
.gal-cover-empty{color:var(--faint);font-size:.85rem}
.gal-meta{display:flex;flex-direction:column;gap:.15rem;padding:.7rem .85rem}
.gal-meta strong{font-size:.95rem}
.gal-sub{color:var(--faint);font-size:.78rem}
.gal-upload{margin-bottom:1.25rem}
.gal-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.75rem}
.gal-photo{margin:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--panel-2);position:relative}
.gal-photo img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.gal-photo-ctrls{display:flex;gap:.25rem;justify-content:center;padding:.35rem;background:var(--panel)}
.gal-photo-ctrls .ctrl-btn.on{color:var(--signal);border-color:rgba(255,90,43,.4)}
.dz-hint{display:block;color:var(--faint);font-size:.78rem;margin-top:.25rem}

/* Gallery upload preview */
.gal-previews{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem;margin-top:.85rem;width:100%}
.gal-prev{width:64px;height:64px;object-fit:cover;border-radius:6px;border:1px solid rgba(255,255,255,.18)}
.gal-prev-count{color:var(--dim);font-size:.8rem;flex-basis:100%;text-align:center;margin-top:.3rem}

/* Gallery public link box */
.gal-linkbox label{display:block;margin-bottom:.25rem}
.gal-linkbox .gal-link{font-size:.8rem;word-break:break-all;margin:0 0 .25rem}
.gal-linkbox .gal-link a{color:var(--signal)}

/* ---------------- Navigation editor (/navigation) ---------------- */
.nav-list{list-style:none;margin:0 0 2.5rem;padding:0;display:flex;flex-direction:column;gap:.6rem}
.nav-item{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);padding:.7rem .85rem}
.nav-item.is-hidden{opacity:.6}
.nav-item-head{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
.nav-item-label{font-weight:600;color:var(--ink)}
.nav-item-target{font-family:var(--mono);font-size:.8rem;color:var(--faint);background:var(--void);padding:.15rem .5rem;border-radius:6px}
.nav-item-ctrls{display:flex;gap:.35rem;margin-left:auto}
.nav-item-ctrls form{margin:0}
.nav-badge{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:var(--warn);border:1px solid var(--line);border-radius:99px;padding:.05rem .45rem;font-weight:600}
.nav-item-edit{margin-top:.6rem}
.nav-item-edit>summary{cursor:pointer;color:var(--dim);font-size:.85rem;width:max-content;list-style:none}
.nav-item-edit>summary::-webkit-details-marker{display:none}
.nav-item-edit>summary::before{content:"✎ ";color:var(--signal)}
.nav-item-edit[open]>summary{color:var(--ink);margin-bottom:.6rem}
.nav-form{border-top:1px solid var(--line-soft);padding-top:.9rem}
.nav-add .nav-form{border:0;padding-top:0}
.nav-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem 1.1rem}
.nav-form-grid .field{margin-bottom:.5rem}
.nav-form-grid .nav-url{grid-column:1 / -1}
.nav-form-grid .nav-checks{grid-column:1 / -1;display:flex;gap:1.4rem;flex-wrap:wrap;align-items:center}
.nav-checks .check{display:inline-flex;align-items:center;gap:.45rem;color:var(--ink);font-weight:400;cursor:pointer}
.nav-when{color:var(--faint);font-weight:400;font-size:.78rem}
.nav-add{border-top:1px solid var(--line);padding-top:1.4rem}
.nav-empty{color:var(--faint);border:1px dashed var(--line);border-radius:var(--radius);padding:1rem;text-align:center;list-style:none}
@media (max-width:640px){.nav-form-grid{grid-template-columns:1fr}}

/* A destructive link styled like a button (e.g. "Delete video/gallery"). */
a.btn.danger{color:var(--danger);border-color:rgba(242,106,92,.35)}
a.btn.danger:hover{background:rgba(242,106,92,.1);border-color:var(--danger)}

/* Danger zone at the foot of an editor (destructive actions) */
.danger-zone{margin-top:2.5rem;padding-top:1.4rem;border-top:1px solid var(--line)}
.danger-zone h2{font-size:1rem;margin:0 0 .3rem}
.danger-zone .hint{margin:0 0 .9rem}
.danger-zone .actions{margin-top:0}

/* Videos manager pagination */
.pager{display:flex;align-items:center;justify-content:center;gap:1rem;margin:1.6rem 0 0}
.pager-info{color:var(--dim);font-size:.9rem}

/* Videos manager: sub-tabs, search/filter toolbar, row thumbnails */
.subtabs{display:flex;gap:.4rem;margin:0 0 1.6rem;border-bottom:1px solid var(--line);flex-wrap:wrap}
.subtabs a{padding:.5rem .95rem;color:var(--dim);text-decoration:none;font-weight:500;font-size:.92rem;border-bottom:2px solid transparent;margin-bottom:-1px}
.subtabs a:hover{color:var(--ink)}
.subtabs a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--signal)}
.vid-toolbar{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin:0 0 1.3rem}
.vid-toolbar input[type=search]{flex:1;min-width:11rem;width:auto;background:var(--panel-2);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:.55rem .75rem;font:inherit;font-size:.95rem}
.vid-toolbar input[type=search]:focus{border-color:#3A4354}
.vid-toolbar select{width:auto}
.vidcell{display:flex;align-items:center;gap:.7rem;min-width:0}
.row-thumb{flex:none;width:64px;height:40px;border-radius:6px;overflow:hidden;background:var(--panel-2);border:1px solid var(--line-soft)}
.row-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.row-thumb-ph{display:block;width:100%;height:100%;background:linear-gradient(135deg,var(--panel-2),var(--line))}
.vidcell-text{display:flex;flex-direction:column;min-width:0}

/* Video editor: embed preview player */
.edit-player{max-width:640px;margin:0 0 1.6rem;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#000;aspect-ratio:16/9}
.edit-player iframe,.edit-player video{width:100%;height:100%;border:0;display:block}
.edit-player video{object-fit:contain;background:#000}
.edit-player.is-social{aspect-ratio:auto;background:transparent;overflow:visible;max-width:550px}
.edit-player.is-social iframe{height:620px}

/* Video editor: two-column layout (sticky preview + actions beside the form) */
.vedit-head{margin:0 0 1.3rem}
.vedit-head .crumbs{margin:0 0 .35rem}
.vedit-head h1{margin:0}
.vedit{display:grid;grid-template-columns:1fr;gap:1.4rem;align-items:start}
@media(min-width:920px){.vedit{grid-template-columns:minmax(300px,340px) minmax(0,1fr)}}
.vedit-side{display:flex;flex-direction:column;gap:1rem;min-width:0}
@media(min-width:920px){.vedit-side{position:sticky;top:1rem}}
.vedit-preview{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#000}
.vedit-preview .edit-player{margin:0;border:0;border-radius:0;max-width:none}
.vedit-preview .edit-player.is-native{aspect-ratio:auto;display:flex;justify-content:center;max-height:66vh}
.vedit-preview .edit-player.is-native video{position:static;width:100%;height:auto;max-height:66vh;object-fit:contain}
.vedit-noplayer{aspect-ratio:16/9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;color:var(--faint);text-align:center;padding:1.2rem;background:var(--panel-2)}
.vedit-noplayer svg{opacity:.5}
.vedit-noplayer p{margin:0;font-size:.9rem;max-width:22ch}
.vedit-actions{display:flex;flex-direction:column;gap:.6rem;padding:1rem;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}
.btn.block{display:flex;width:100%;justify-content:center}
.vedit-actions-row{display:flex;gap:.6rem}
.vedit-actions-row .btn{flex:1;justify-content:center;text-align:center}
.btn.ghost{background:transparent;border-color:transparent;text-decoration:underline;text-underline-offset:3px}
.vedit-state{margin:.15rem 0 0;text-align:center}
.pill{display:inline-flex;align-items:center;gap:.3rem;font-size:.78rem;padding:.2rem .65rem;border-radius:99px;border:1px solid var(--line);color:var(--dim)}
.pill.on{color:#7ee0a8;border-color:rgba(126,224,168,.35);background:rgba(126,224,168,.08)}
.vedit-backup{display:flex;flex-direction:column;gap:.55rem;padding:1rem;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}
.vedit-backup-h{margin:0;font-size:.9rem;letter-spacing:.02em;text-transform:uppercase;color:var(--dim)}
.vedit-backup .hint{margin:0}
.vedit-backup-done{margin:0;font-size:.85rem;color:var(--signal)}
.vedit-backup-done a{color:inherit}
.vedit-backup-vid{width:100%;max-height:320px;border-radius:8px;background:#000;display:block}
.vedit-backup-prog{height:6px;border-radius:999px;background:var(--line);overflow:hidden}
.vedit-backup-bar{height:100%;width:0;background:var(--signal);border-radius:999px;transition:width .2s ease}
.vedit-backup-prog.indeterminate .vedit-backup-bar{width:40%;animation:vbk-indet 1.1s ease-in-out infinite}
@keyframes vbk-indet{0%{margin-left:-40%}100%{margin-left:100%}}
.xbackup-status{position:fixed;right:1rem;bottom:1rem;z-index:50;max-width:22rem;padding:.6rem .9rem;border:1px solid var(--line);border-radius:10px;background:var(--panel-2);color:var(--dim);font-size:.85rem;box-shadow:0 6px 24px rgba(0,0,0,.35)}
.vedit-danger{text-align:center;padding:.2rem 0}
.vedit-main{min-width:0}
.vedit-main .panel{margin:0}

/* Two-factor setup */
.totp-key{font-size:1.15rem;letter-spacing:.12em;background:var(--void);border:1px solid var(--line);border-radius:8px;padding:.6rem .9rem;display:inline-block}
.recovery-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,max-content);gap:.35rem 2rem}
.recovery-list code{font-size:1.05rem;letter-spacing:.06em}

/* Tiers manager + per-user tier assignment */
.tier-edit{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.tier-edit input[name=name]{width:auto;min-width:9rem}
.tier-edit input[name=description]{width:auto;flex:1;min-width:12rem}
.tiers-cell .tag{margin:0 .2rem .2rem 0}
.tier-assign{margin-top:.35rem}
.tier-assign>summary{cursor:pointer;color:var(--dim);font-size:.82rem;width:max-content;list-style:none}
.tier-assign>summary::-webkit-details-marker{display:none}
.tier-assign>summary::before{content:"✎ ";color:var(--signal)}
.tier-assign[open]>summary{color:var(--ink)}
.tier-assign form{margin-top:.5rem;display:flex;flex-direction:column;gap:.3rem}
.tier-assign .check{display:inline-flex;align-items:center;gap:.4rem;color:var(--ink);font-weight:400;font-size:.9rem}

/* Video visibility (tier access) controls in the editor */
.vis-field{border:1px solid var(--line);border-radius:8px;padding:.85rem 1rem;margin-bottom:1.1rem}
.vis-field legend{padding:0 .4rem;color:var(--dim);font-size:.85rem;font-weight:500}
.vis-field .radio{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem;color:var(--ink);font-weight:400;cursor:pointer}
.vis-tiers{margin:.4rem 0 .6rem 1.6rem;display:flex;flex-direction:column;gap:.3rem}
.vis-tiers .check{display:inline-flex;align-items:center;gap:.45rem;color:var(--ink);font-weight:400}
.vis-warn{display:flex;align-items:flex-start;gap:.5rem;margin-top:.7rem;padding-top:.6rem;border-top:1px solid var(--line-soft);color:var(--dim);font-weight:400;font-size:.9rem;cursor:pointer}

/* Playlists tab: per-playlist visibility editor */
.pl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1rem;margin-bottom:1.5rem}
.pl-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:.95rem 1.05rem}
.pl-card>form:not(.pl-del){display:flex;flex-direction:column;flex:1}
.pl-card-head{display:flex;align-items:center;gap:.6rem;padding-right:2rem;margin-bottom:.5rem}
.pl-name{flex:1;min-width:0;background:transparent;border:1px solid transparent;border-radius:7px;padding:.3rem .35rem;color:var(--ink);font-weight:600;font-size:1rem;font-family:inherit}
.pl-name:hover{border-color:var(--line-soft)}
.pl-name:focus{outline:none;border-color:var(--signal);background:var(--panel-2)}
.pl-count{flex:0 0 auto;font-size:.75rem;color:var(--faint);white-space:nowrap}
.pl-card-meta{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.7rem;min-width:0}
.pl-vis{display:inline-flex;align-items:center;gap:.4rem;font-size:.76rem;padding:.2rem .6rem;border-radius:99px;border:1px solid var(--line);color:var(--dim);white-space:nowrap}
.pl-vis::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:var(--faint);flex:0 0 auto}
.pl-vis.public{color:#7ee0a8;border-color:rgba(126,224,168,.3)}
.pl-vis.public::before{background:#7ee0a8}
.pl-vis.member{color:#e6c27c;border-color:rgba(230,194,124,.3)}
.pl-vis.member::before{background:#e6c27c}
.pl-vis.tiers{color:var(--signal);border-color:color-mix(in srgb,var(--signal) 40%,var(--line))}
.pl-vis.tiers::before{background:var(--signal)}
.pl-link{font-family:var(--mono);font-size:.74rem;color:var(--faint);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pl-link:hover{color:var(--dim)}
.pl-access{margin-top:auto;border-top:1px solid var(--line-soft);padding-top:.55rem}
.pl-access>summary{cursor:pointer;font-size:.82rem;color:var(--dim);list-style:none;display:inline-flex;align-items:center;gap:.4rem;padding:.15rem 0}
.pl-access>summary::-webkit-details-marker{display:none}
.pl-access>summary::before{content:"▸";color:var(--faint);font-size:.7rem}
.pl-access[open]>summary::before{content:"▾"}
.pl-access[open]>summary{margin-bottom:.6rem}
.pl-access .vis-field{margin:0}
.pl-card-foot{margin-top:.7rem;display:flex}
.pl-del{position:absolute;top:.65rem;right:.7rem;margin:0}
.pl-del .ctrl-btn{width:1.9rem;height:1.9rem}

/* Support cases: modal with a pure-CSS status filter */
.count-pill{display:inline-flex;align-items:center;justify-content:center;min-width:1.3rem;height:1.3rem;padding:0 .35rem;border-radius:99px;background:var(--signal);color:var(--signal-ink);font-size:.72rem;font-weight:700;margin-left:.35rem}
.case-filter{display:flex;flex-direction:column}
.cf-radio{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.case-tabs{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1rem;border-bottom:1px solid var(--line);padding-bottom:.7rem}
.case-tabs label{cursor:pointer;font-size:.82rem;color:var(--dim);padding:.3rem .7rem;border-radius:99px;border:1px solid transparent}
.case-tabs label:hover{color:var(--ink)}
.case-tabs label span{opacity:.65;font-variant-numeric:tabular-nums}
#cf-all:checked ~ .case-tabs label[for=cf-all],
#cf-open:checked ~ .case-tabs label[for=cf-open],
#cf-prog:checked ~ .case-tabs label[for=cf-prog],
#cf-closed:checked ~ .case-tabs label[for=cf-closed]{color:var(--ink);background:var(--panel-2);border-color:var(--line)}
#cf-open:checked ~ .case-list .case-row:not([data-status=open]),
#cf-prog:checked ~ .case-list .case-row:not([data-status=in_progress]),
#cf-closed:checked ~ .case-list .case-row:not([data-status=closed]){display:none}
.case-list{display:flex;flex-direction:column;gap:.7rem;max-height:58vh;overflow-y:auto}
.case-row{border:1px solid var(--line);border-radius:10px;padding:.8rem .9rem;background:var(--panel-2)}
.case-row[data-status=closed]{opacity:.65}
.case-row-head{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:.35rem;flex-wrap:wrap}
.case-who{font-size:.9rem;min-width:0;overflow-wrap:anywhere}
.case-who a{color:var(--dim)}
.case-badge{font-size:.7rem;font-weight:600;padding:.15rem .55rem;border-radius:99px;border:1px solid var(--line);white-space:nowrap}
.case-badge.open{color:#e6c27c;border-color:rgba(230,194,124,.35)}
.case-badge.in_progress{color:#7cc0e6;border-color:rgba(124,192,230,.35)}
.case-badge.closed{color:var(--faint)}
.case-device{margin:.1rem 0;font-size:.8rem;color:var(--faint)}
.case-desc{margin:.3rem 0 .6rem;font-size:.9rem;white-space:pre-wrap;overflow-wrap:anywhere}
.case-foot{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap}
.case-date{font-size:.75rem;color:var(--faint);font-variant-numeric:tabular-nums}
.case-status-form{display:flex;gap:.4rem;align-items:center;margin:0}
.case-status-form select{padding:.3rem .5rem;font-size:.85rem}

/* ---------------------------------------------------------------- Calendar */
.cal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap}
.cal-head-actions{display:flex;gap:.5rem;flex-wrap:wrap}
/* Preset palette — colours live here because the CSP blocks inline styles. */
.cal-c-orange{--cal-c:#FF5A2B}.cal-c-red{--cal-c:#E5484D}.cal-c-amber{--cal-c:#F5A524}
.cal-c-green{--cal-c:#30A46C}.cal-c-teal{--cal-c:#12A594}.cal-c-blue{--cal-c:#3E63DD}
.cal-c-violet{--cal-c:#8E4EC6}.cal-c-pink{--cal-c:#E93D82}.cal-c-gray{--cal-c:#8B8D98}
.cal-c-none{--cal-c:#55575E}
.cal-sw-none span{display:grid;place-items:center;color:#c9c9c9;font-size:14px;line-height:1}

.cal-year{margin:1.25rem 0;overflow-x:auto}
.cal-svg{display:block;width:100%;height:auto;max-width:1000px;min-width:660px}
.cal-legend{color:var(--faint);font-size:.82rem;margin:.55rem 0 0}
.cal-hit{cursor:pointer}
.cal-tip{position:fixed;z-index:60;width:max-content;max-width:20rem;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 44px -12px rgba(0,0,0,.7),0 4px 14px -6px rgba(0,0,0,.5);padding:.7rem .8rem;font-size:.82rem;color:var(--dim);pointer-events:none}
/* Date header: muted weekday over a bold day-month-year. */
.cal-tip-date{display:flex;flex-direction:column;gap:.05rem;margin-bottom:.55rem}
.cal-tip-wd{font-size:.66rem;text-transform:uppercase;letter-spacing:.1em;color:var(--faint);font-weight:700}
.cal-tip-dm{font-size:.98rem;font-weight:700;color:var(--ink);letter-spacing:-.01em}
/* Whereabouts strip, set apart from the event list. */
.cal-tip-loc{display:flex;align-items:center;gap:.5rem;padding:.4rem .55rem;background:var(--panel-2);border:1px solid var(--line-soft);border-radius:9px}
.cal-tip-loc-ic{flex:0 0 auto;font-size:.9rem;line-height:1}
.cal-tip-places{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;min-width:0}
.cal-tip-place{display:inline-flex;align-items:center;gap:.38rem;color:var(--ink);font-weight:600}
.cal-tip-place.is-pot{color:var(--dim)}
.cal-tip-place .cal-tip-dot{width:9px;height:9px;margin:0}
.cal-tip-arrow{color:var(--faint);font-weight:700;font-size:.9rem}
/* Events section, divided from the whereabouts above it. */
.cal-tip-sec.has-sep{margin-top:.55rem;padding-top:.5rem;border-top:1px solid var(--line-soft)}
.cal-tip-sec-h{font-size:.62rem;text-transform:uppercase;letter-spacing:.1em;color:var(--faint);font-weight:700;margin-bottom:.32rem}
.cal-tip-row{display:flex;align-items:flex-start;gap:.45rem;padding:.16rem 0}
.cal-tip-dot{width:10px;height:10px;border-radius:3px;background:var(--cal-c);flex:0 0 auto;margin-top:.28rem}
.cal-tip-dot.is-pot{opacity:.45}
.cal-tip-ic{flex:0 0 auto;line-height:1.35}
.cal-tip-body{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;min-width:0}
.cal-tip-t{color:var(--ink);font-weight:600;overflow-wrap:anywhere}
.cal-tip-loc-x{color:var(--dim)}
.cal-tip-badge{font-size:.58rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700;border:1px solid var(--line);border-radius:99px;padding:.03rem .4rem;color:var(--faint)}
.cal-tip-badge-ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 40%,transparent)}
.cal-tip-badge-pot{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 40%,transparent)}
.cal-month{border:1px solid var(--line);border-radius:12px;padding:.75rem .85rem;background:var(--panel-2)}
.cal-mh{margin:0 0 .55rem;font-size:.95rem}
.cal-mh span{color:var(--dim);font-weight:400}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal-wd{font-size:.62rem;color:var(--faint);text-align:center;padding-bottom:1px}
.cal-d{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:.72rem;color:var(--dim);border-radius:6px}
.cal-pad{visibility:hidden}
.cal-d.is-today{outline:1.5px solid var(--signal);outline-offset:-1.5px;color:var(--ink);font-weight:700}
.cal-ev{background:var(--cal-c);color:#fff;font-weight:600;text-decoration:none}
.cal-ev:hover{filter:brightness(1.12)}
.cal-ev.is-pot{background:color-mix(in srgb,var(--cal-c) 26%,transparent);border:1px dashed var(--cal-c);color:var(--ink)}

.cal-events{margin-top:1.5rem}
.cal-events .count{font-size:.8rem;color:var(--dim);background:var(--panel-2);border:1px solid var(--line);border-radius:99px;padding:.05rem .5rem;vertical-align:middle;margin-left:.35rem}
/* Past events are hidden by default; the toggle (a CSS-only checkbox) reveals them. */
.cal-showpast-cb{position:absolute;width:0;height:0;opacity:0;pointer-events:none}
.cal-past-toggle{margin:1.25rem 0 0}
.cal-past-toggle label{cursor:pointer}
.cal-past-toggle label::before{content:"Show past"}
#cal-showpast:checked ~ .cal-past-toggle label::before{content:"Hide past"}
#cal-showpast:not(:checked) ~ .cal-events .cal-past-wrap{display:none}
.cal-past-wrap{margin-top:.7rem;padding-top:.7rem;border-top:1px dashed var(--line)}
.cal-past-wrap .cal-item{opacity:.72}
.cal-list{display:grid;gap:.6rem;margin-top:.75rem}
.cal-item{position:relative;display:flex;align-items:stretch;gap:0;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--panel-2);min-height:74px}
.cal-item:hover{border-color:#37373d;background:var(--panel)}
.cal-item-sw{width:7px;background:var(--cal-c);flex:0 0 auto;align-self:stretch}
.cal-item-sw.is-pot{background:repeating-linear-gradient(135deg,var(--cal-c),var(--cal-c) 4px,transparent 4px,transparent 8px)}
.cal-item-body{min-width:0;flex:1 1 auto;padding:.8rem .95rem;padding-right:2.6rem}
.cal-item-t{margin:0 0 .25rem;font-size:1rem;display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.cal-item-ic{font-size:1.1rem;line-height:1}
.cal-badge{font-size:.66rem;padding:.1rem .5rem;border-radius:99px;border:1px solid var(--line);color:var(--dim);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.cal-badge-confirmed{color:#7ee0a8;border-color:rgba(126,224,168,.35);background:rgba(126,224,168,.08)}
.cal-badge-potential{color:var(--warn);border-color:rgba(245,165,36,.35);background:rgba(245,165,36,.08)}
.cal-item-meta{margin:0;color:var(--dim);font-size:.85rem}
.cal-item-cover{flex:0 0 auto;width:104px;align-self:stretch;overflow:hidden;background:#141417}
.cal-item-cover img{width:100%;height:100%;object-fit:cover;display:block}
/* The title carries a stretched link so a click anywhere on the card opens the
   details modal; the pen sits above it (z-index) with its own target. */
.cal-item-title{color:inherit;text-decoration:none}
.cal-item-title::after{content:"";position:absolute;inset:0;z-index:0}
.cal-item-title:hover{text-decoration:underline}
.cal-item-edit{position:absolute;top:.5rem;right:.5rem;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;color:var(--dim);border:1px solid transparent}
.cal-item-edit:hover{color:var(--ink);background:var(--panel-2);border-color:var(--line)}
/* The cover bleeds to the card edges, flush beneath the sticky header. */
.cal-detail-cover{width:auto;max-height:300px;object-fit:cover;display:block;margin:-1.1rem -1.4rem 1.15rem;background:var(--void)}
.cal-detail-meta{display:flex;align-items:center;gap:.55rem;margin:0 0 .65rem;color:var(--ink);font-size:.92rem;flex-wrap:wrap}
.cal-item-sw2{width:12px;height:12px;border-radius:3px;background:var(--cal-c);flex:0 0 auto}
.cal-item-sw2.is-pot{opacity:.5}
.cal-detail-loc{margin:0 0 .5rem;color:var(--dim)}
.cal-detail-d{margin:0 0 .85rem;white-space:pre-wrap;color:var(--dim)}

.cal-day-list{display:flex;flex-direction:column;gap:.4rem}
.cal-day-row{position:relative;display:flex;align-items:center;gap:.55rem;padding:.5rem .6rem;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:var(--panel-2);color:inherit;text-decoration:none;transition:background .12s ease,border-color .12s ease}
.cal-day-row.has-cover{padding-left:0;min-height:60px}
.cal-day-row:hover{background:#171B24;border-color:#3A4354}
.cal-day-row .cal-item-sw{flex:0 0 auto;align-self:stretch;width:6px}
.cal-day-cover{flex:0 0 auto;width:76px;align-self:stretch;overflow:hidden;background:var(--void)}
.cal-day-cover img{width:100%;height:100%;object-fit:cover;display:block}
.cal-day-ic{flex:0 0 auto;font-size:1.05rem;line-height:1}
.cal-day-t{flex:1 1 auto;min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-day-loc{font-weight:400;color:var(--dim)}
.cal-day-row .cal-badge{flex:0 0 auto}

.cal-swatches{display:flex;gap:.45rem;flex-wrap:wrap}
.cal-sw{position:relative;cursor:pointer;line-height:0}
.cal-sw input{position:absolute;opacity:0;width:0;height:0}
.cal-sw span{display:block;width:26px;height:26px;border-radius:7px;background:var(--cal-c);border:2px solid transparent;box-sizing:border-box}
.cal-sw input:checked + span{border-color:var(--ink);box-shadow:0 0 0 2px var(--void),0 0 0 3px var(--cal-c)}
.cal-status{display:flex;gap:1.25rem}
.cal-del-real{margin-top:.6rem;text-align:right}
.lbl{display:block;font-weight:500;margin-bottom:.35rem}

/* Videos → Tags tab: an over/under tree of collapsible tags. */
.vtag-icon{width:30px;height:30px;object-fit:cover;border-radius:7px;border:1px solid var(--line);background:var(--panel-2);flex:0 0 auto}
.vtag-icon-none{opacity:.45}
.vtag-tree{margin-top:1rem;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel)}
.vtag-row{display:flex;align-items:center;gap:.7rem;padding:.55rem .9rem;border-top:1px solid var(--line-soft)}
.vtag-tree > .vtag-row:first-child,
.vtag-tree > .vtag-node:first-child > .vtag-row{border-top:0}
.vtag-row::before{content:"";flex:0 0 auto;width:1em;color:var(--faint);text-align:center}
.vtag-parent{cursor:pointer;list-style:none}
.vtag-parent::-webkit-details-marker{display:none}
.vtag-parent::before{content:"▸"}
.vtag-node[open] > .vtag-parent::before{content:"▾"}
.vtag-name{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;text-decoration:none;font-weight:600}
.vtag-name:hover{text-decoration:underline}
.vtag-count{flex:0 0 auto;color:var(--faint);font-size:.8rem;font-variant-numeric:tabular-nums}
.vtag-edit{flex:0 0 auto}
.vtag-kids{padding-left:1.5rem;background:color-mix(in srgb,var(--panel-2) 55%,transparent)}
.vtag-kids .vtag-node{border-top:1px solid var(--line-soft)}

/* X posts admin: existing images grid + "Load from X" previews */
.xpost-thumbs{display:flex;flex-wrap:wrap;gap:.6rem;margin:.4rem 0 .8rem}
.xpost-thumb{position:relative;width:104px}
.xpost-thumb img{width:104px;height:104px;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:block}
.xpost-thumb .remove{display:flex;align-items:center;gap:.3rem;font-size:.8rem;margin-top:.25rem;color:var(--dim)}
.xpost-preview{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.6rem}
.xpost-preview img{width:88px;height:88px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}

/* Post editor: "Translate to English" control */
.xtr-row{margin:-.4rem 0 .9rem}
.xtr-out{margin-top:.5rem;padding:.6rem .7rem;border:1px solid var(--line);border-radius:8px;background:var(--bg-soft);font-size:.92rem;color:var(--dim);display:flex;flex-direction:column;gap:.5rem;align-items:flex-start}
.xtr-out .xtr-text{color:var(--ink);line-height:1.45;white-space:pre-wrap}
.xtr-out.xtr-err{color:#f2a};

/* ---- Knowledge base admin ---- */
.kb-theme{margin:1.4rem 0;padding-top:1rem;border-top:1px solid var(--line)}
.kb-theme-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.7rem}
.kb-theme-head .inline-rename input{font-weight:700}
.kb-theme-head form{margin:0}
.kb-theme-title{font-size:1.1rem;margin:0}
.kb-col-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.8rem}
.kb-col-card{border:1px solid var(--line);border-radius:12px;padding:.85rem 1rem;background:var(--bg-soft);display:flex;flex-direction:column;gap:.22rem}
.kb-col-name{font-weight:700;color:var(--ink);text-decoration:none}
.kb-col-name:hover{color:var(--accent)}
.kb-col-meta{font-size:.8rem;color:var(--dim)}
.kb-col-meta a,.kb-slug{color:var(--dim)}
.kb-col-desc{font-size:.85rem;color:var(--dim);margin:.2rem 0 0}
.kb-manage{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:1.5rem;align-items:start}
@media(max-width:820px){.kb-manage{grid-template-columns:1fr}}
.kb-chap-block{margin-bottom:1.3rem}
.kb-chap-head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.6rem;flex-wrap:wrap}
.kb-chap-head form{margin:0}
.kb-chap-head .row-actions{display:inline-flex;align-items:center;gap:.35rem;flex-wrap:nowrap}
.kb-chap-head .row-actions form{display:inline-flex}
.kb-chap-head .row-actions .ctrl-btn,.kb-chap-head .row-actions .btn.small{height:34px;display:inline-flex;align-items:center;justify-content:center}
.kb-chap-head .row-actions .btn.small{padding:0 .7rem;white-space:nowrap}
.kb-chap-title{font-size:1rem;margin:0}
.kb-side-box{border:1px solid var(--line);border-radius:12px;padding:.9rem 1rem;margin-bottom:1rem;background:var(--bg-soft)}
.kb-side-h{font-size:.95rem;margin:0 0 .6rem}
.kb-add-row{display:flex;gap:.4rem;margin-top:.5rem}
.kb-add-row input{flex:1;min-width:0}
.kb-tag-list{display:flex;flex-wrap:wrap;gap:.4rem}
.kb-tagchip{display:inline-flex;align-items:center;gap:.2rem;padding:.15rem .2rem .15rem .55rem;border:1px solid var(--line);border-radius:99px;font-size:.85rem}
.kb-tagchip form{margin:0}
.kb-tagx{border:0;background:none;color:var(--dim);cursor:pointer;font-size:1rem;line-height:1;padding:0 .25rem}
.kb-tagx:hover{color:#e66}
.kb-editor{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg-soft)}
.kb-toolbar{display:flex;flex-wrap:wrap;gap:.15rem;padding:.4rem;border-bottom:1px solid var(--line)}
.kb-toolbar button{min-width:2rem;height:2rem;padding:0 .5rem;border:1px solid transparent;border-radius:6px;background:none;color:var(--ink);cursor:pointer;font-size:.9rem}
.kb-toolbar button:hover{background:var(--bg);border-color:var(--line)}
.kb-tb-sep{width:1px;background:var(--line);margin:.2rem .25rem}
.kb-rte{min-height:260px;max-height:60vh;overflow:auto;padding:.9rem 1rem;line-height:1.6;background:var(--bg)}
.kb-rte:focus{outline:2px solid var(--accent);outline-offset:-2px}
.kb-rte h2{font-size:1.3rem;margin:1rem 0 .5rem}
.kb-rte h3{font-size:1.1rem;margin:.9rem 0 .4rem}
.kb-rte img{max-width:100%;height:auto;border-radius:8px}
.kb-rte blockquote{border-left:3px solid var(--accent);margin:.6rem 0;padding:.2rem 0 .2rem 1rem;color:var(--dim)}
.kb-vidpick{cursor:pointer}

/* KB thumbnail proposals */
.kb-thumb-propose{margin-top:.7rem}
.kb-thumb-grid{display:flex;flex-wrap:wrap;gap:.5rem;margin:.4rem 0}
.kb-thumb-tile{padding:0;border:2px solid var(--line);border-radius:8px;overflow:hidden;background:none;cursor:pointer;line-height:0}
.kb-thumb-tile img{width:110px;height:70px;object-fit:cover;display:block}
.kb-thumb-tile:hover{border-color:color-mix(in srgb,var(--accent) 60%,var(--line))}
.kb-thumb-tile.is-selected{border-color:var(--accent)}
.kb-thumb-vid{margin-top:.5rem}

.kb-publish{margin-bottom:1rem}
.kb-publish .vis-field{margin-bottom:.6rem}

/* KB "Published" toggle button — green glow when on, grey when off */
.kb-pub{display:block;cursor:pointer;margin:.2rem 0 .2rem}
.kb-pub input{position:absolute;width:1px;height:1px;opacity:0;margin:-1px;overflow:hidden}
.kb-pub-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.6rem 1rem;border-radius:10px;border:1px solid var(--line);background:var(--bg-soft);color:var(--dim);font-weight:700;transition:border-color .15s ease,color .15s ease,background .15s ease,box-shadow .15s ease}
.kb-pub-dot{width:.6rem;height:.6rem;border-radius:50%;background:currentColor;flex:0 0 auto}
.kb-pub-txt::after{content:"Not published"}
.kb-pub input:checked + .kb-pub-btn{border-color:#2fbf6b;background:color-mix(in srgb,#2fbf6b 16%,var(--bg-soft));color:#40df84;box-shadow:0 0 0 1px rgba(64,223,132,.45),0 0 16px rgba(64,223,132,.55)}
.kb-pub input:checked + .kb-pub-btn .kb-pub-txt::after{content:"Published"}
.kb-pub input:focus-visible + .kb-pub-btn{outline:2px solid var(--accent);outline-offset:2px}

/* KB admin file list */
.kb-filelist{list-style:none;margin:.2rem 0 .6rem;padding:0;display:flex;flex-direction:column;gap:.35rem}
.kb-fileitem{display:flex;align-items:center;gap:.5rem;font-size:.9rem}
.kb-file-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kb-file-size{color:var(--dim);font-size:.8rem}
.kb-fileitem form{margin:0 0 0 auto}

/* Wishlist admin: price + currency row */
.wl-price-row{display:flex;gap:.8rem}
.wl-price-row .field{flex:1;min-width:0}

/* Nav editor polish + KB modal section divider */
.nav-item-head{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.nav-item-main{display:flex;flex-direction:column;gap:.15rem;min-width:0;flex:1}
.nav-item-ctrls{display:inline-flex;align-items:center;gap:.35rem;margin-left:auto}
.nav-item-ctrls form{margin:0;display:inline-flex}
.kb-modal-sect{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}

/* Nav form: show only the target field matching the selected Type (CSS-only) */
.nav-form .nav-for-page,.nav-form .nav-for-module,.nav-form .nav-for-url{display:none}
.nav-form:has(select[name="kind"] option[value="page"]:checked) .nav-for-page{display:block}
.nav-form:has(select[name="kind"] option[value="module"]:checked) .nav-for-module{display:block}
.nav-form:has(select[name="kind"] option[value="url"]:checked) .nav-for-url{display:block}

.nav-badge-aud{background:color-mix(in srgb,var(--accent) 22%,transparent);color:var(--accent)}

/* Links collection layout editor */
.modal-card:has(.link-arranger){width:min(72rem,100%);max-height:90vh}
.link-arranger{margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--line)}
.link-arranger h3{margin:0 0 .5rem;font-size:1.1rem}
.link-arranger-workspace{display:grid;grid-template-columns:15rem minmax(0,1fr);gap:1.5rem;margin-top:1rem}
.link-arranger [hidden],form:has(.link-arranger) .field[hidden]{display:none!important}
.link-library{min-width:0}.link-library label{font-size:.875rem;color:var(--dim)}
.link-library input[type=search]{display:block;width:100%;min-height:44px;margin-top:.4rem;padding:.6rem .75rem;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);color:var(--ink);font:inherit}
.link-library input[type=search]::placeholder{color:var(--dim);opacity:1}
.link-library-items{display:flex;flex-direction:column;gap:.4rem;max-height:23rem;overflow:auto;margin:.75rem 0}
.link-library-item{text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;min-height:52px;white-space:normal;overflow-wrap:anywhere;width:100%;cursor:grab;background:var(--panel-2)}
.link-library-item small,.link-arrange-tile small{color:var(--dim);font-size:.8125rem}
.link-library-item:disabled{opacity:.45;cursor:default}
.link-arrange-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;align-content:start;min-height:12rem;border:1px dashed var(--dim);padding:.75rem;border-radius:10px;background:var(--void)}
.link-arrange-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.link-arrange-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.link-arrange-grid.is-drop-target{outline:2px solid var(--signal);outline-offset:2px}
.link-arrange-tile{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;background:var(--panel-2);border:1px solid var(--line);border-radius:8px;min-width:0;overflow-wrap:anywhere;cursor:grab;width:100%}
.link-arrange-actions{display:flex;flex-wrap:wrap;gap:.3rem}.link-arrange-actions button{min-height:44px;padding:.35rem .5rem;font-size:.8125rem}
.link-drop-empty{grid-column:1 / -1;text-align:center;color:var(--dim);padding:2rem .5rem}
@media(max-width:1000px){.link-arrange-grid.cols-4,.link-arrange-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.link-arranger-workspace{grid-template-columns:1fr}.link-library-items{max-height:12rem}.link-arrange-grid,.link-arrange-grid.cols-2,.link-arrange-grid.cols-4{grid-template-columns:1fr}}

/* Wishlist: upload or import a remote image. */
.wl-image-sources { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1rem; align-items:start; }
.wl-image-sources > * { min-width:0; }
.wl-image-sources input[type=url] { width:100%; box-sizing:border-box; }
@media(max-width:600px) { .wl-image-sources { grid-template-columns:1fr; } }


.link-category > summary{list-style:none;cursor:pointer;background:var(--panel-2)}
.link-category > summary::-webkit-details-marker{display:none}
.link-category > summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.category-chevron{display:inline-block;font-size:1.5rem;line-height:1;flex-shrink:0}
.link-category[open] > summary .category-chevron{transform:rotate(90deg)}
.link-category > .hint{padding:.75rem 1rem}

/* Compact Links block workspace. */
.link-arranger-workspace{grid-template-columns:18rem minmax(0,1fr);gap:1.25rem}
.link-arranger > .hint{margin:.25rem 0 .75rem}
.link-type-toggles{display:flex;gap:.4rem;margin:.75rem 0}
.link-type-toggles button,.link-availability{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:40px;font-size:.8125rem;padding:.5rem .65rem;color:var(--dim);border:1px solid var(--line);background:transparent}
.link-type-toggles button{flex:1}
.link-type-toggles svg,.link-availability svg{width:17px;height:17px;flex-shrink:0}
.link-type-toggles button[aria-pressed=true],.link-availability[aria-pressed=true]{background:color-mix(in srgb,var(--signal) 12%,var(--panel));border-color:var(--signal);color:var(--ink)}
.link-type-toggles button:hover,.link-availability:hover{border-color:var(--dim)}
.link-type-toggles button:focus-visible,.link-availability:focus-visible,.link-library-filters summary:focus-visible,.link-appearance summary:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
.link-library-filters{border-bottom:1px solid var(--line);padding-bottom:.5rem}
.link-library-filters summary{cursor:pointer;color:var(--dim);font-size:.8125rem;min-height:32px;padding:.25rem 0}
.link-library-filters summary span{margin-left:.5rem;color:var(--signal);font-size:.75rem}
.link-library-filters label{display:grid;gap:.3rem;margin:.5rem 0}
.link-library-filters select{width:100%;min-width:0}
.link-library-filters .link-availability{margin-bottom:.5rem}
.link-library-meta{display:flex;align-items:center;justify-content:space-between;min-height:36px;color:var(--dim);font-size:.75rem}
.link-library-meta button{border:0;background:transparent;min-height:32px;padding:.25rem .5rem;font-size:.75rem;color:var(--ink);text-decoration:underline}
.link-library-items{margin:.25rem 0 .75rem;gap:0;max-height:22rem}
.link-library-item{position:relative;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;padding:.65rem 2rem .65rem .5rem;min-height:56px;gap:.1rem}
.link-library-item:hover:not(:disabled){background:var(--panel-2)}
.link-library-item span:first-child{font-size:.875rem;font-weight:500}
.link-library-add{position:absolute;right:.6rem;top:.75rem;font-size:1.2rem;color:var(--dim)}
.link-library-item:disabled .link-library-add{visibility:hidden}
.link-library > a{font-size:.8125rem;color:var(--dim)}
.link-selection{min-width:0}
.link-selection-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.75rem;min-height:24px}
.link-selection-heading h4{margin:0;font-size:.875rem}
.link-selection-heading span{font-size:.75rem;color:var(--dim)}
.link-arrange-grid{border-color:var(--line);min-height:20rem}
.link-arrange-tile strong{font-size:.875rem;font-weight:600}
.link-arrange-tile small{font-size:.75rem}
.link-arrange-actions{justify-content:flex-end;gap:.25rem}
.link-arrange-actions button{font-size:1.125rem;min-height:36px;min-width:36px;padding:.2rem;background:transparent}
.link-arrange-actions button:last-child{margin-left:auto}
.link-appearance{border-bottom:1px solid var(--line);margin:0 0 1rem;padding:0 0 .75rem}
.link-appearance > summary{cursor:pointer;font-size:.875rem;font-weight:600;padding:.5rem 0}
.link-appearance > summary span{font-size:.8125rem;font-weight:400;color:var(--dim);margin-left:.75rem}
.link-appearance-fields{display:grid;grid-template-columns:1fr 1fr;gap:.75rem 1.25rem;padding-top:.75rem}
.link-appearance-fields .field{margin:0}
@media(max-width:760px){.link-arranger-workspace{grid-template-columns:1fr}.link-library-items{max-height:12rem}.link-arrange-grid{min-height:10rem}.link-appearance-fields{grid-template-columns:1fr}.link-appearance > summary span{display:none}}
.modal-card:has(.link-arranger) > form > .actions{position:sticky;bottom:-1.4rem;z-index:2;background:var(--panel);margin:1rem -1.4rem -1.4rem;padding:1rem 1.4rem;border-top:1px solid var(--line)}
.modal-card:has(.link-arranger){scroll-padding-top:5rem;scroll-padding-bottom:6rem}

/* Chapter directory: image-led cards, with separate management controls. */
.kb-chapter-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,13rem),1fr));gap:.85rem;margin-bottom:1.5rem}
.kb-chapter-card{min-width:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel)}
.kb-chapter-open{display:block;color:var(--ink);text-decoration:none}
.kb-chapter-open:hover{text-decoration:none;color:var(--ink)}
.kb-chapter-cover{position:relative;aspect-ratio:16/9;background:var(--panel-2);overflow:hidden}
.kb-chapter-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s ease-out}
.kb-chapter-open:hover img{transform:scale(1.025)}
.kb-chapter-number{position:absolute;left:.75rem;bottom:.75rem;padding:.2rem .5rem;border-radius:4px;background:var(--panel);color:var(--ink);font:500 .75rem var(--mono)}
.kb-chapter-placeholder{display:flex;height:100%;align-items:center;justify-content:center;color:var(--dim)}
.kb-chapter-placeholder svg{width:40px;height:40px}
.kb-chapter-body{position:relative;padding:.75rem 2rem .75rem .75rem}
.kb-chapter-body h2{margin:0 0 .3rem;font-size:.9375rem;line-height:1.4;overflow-wrap:anywhere}
.kb-chapter-body > span{font-size:.8125rem;color:var(--dim)}
.kb-chapter-arrow{position:absolute;right:1rem;top:1rem}
.kb-chapter-open:hover .kb-chapter-arrow{color:var(--signal)}
.kb-chapter-open:focus-visible{outline:2px solid var(--signal);outline-offset:-3px}
.kb-chapter-actions{display:flex;align-items:center;justify-content:space-between;gap:.25rem;padding:.4rem .5rem;border-top:1px solid var(--line)}
.kb-chapter-actions .row-actions{display:flex;gap:.15rem;flex-shrink:0}
.kb-chapter-actions form{margin:0;display:flex}
.kb-chapter-add{display:inline-flex;gap:.3rem;align-items:center;font-size:.8125rem;color:var(--ink);min-height:36px}
@media(prefers-reduced-motion:reduce){.kb-chapter-cover img{transition:none}.kb-chapter-open:hover img{transform:none}}
