/* PARK LAB — admin */
.adm { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
.adm-side { position: sticky; top: 0; height: 100vh; padding: 22px 16px; border-right: 1px solid var(--line); background: #0D1220; display: flex; flex-direction: column; gap: 24px; }
.adm-tag { font-size: 10px; letter-spacing: .14em; padding: 2px 6px; border-radius: 5px; background: rgba(139, 203, 255, .14); color: var(--blue); }
.adm-nav { display: grid; gap: 2px; }
.adm-nav a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; color: var(--muted); font-size: 14.5px; transition: all .2s; }
.adm-nav a i { font-style: normal; width: 18px; text-align: center; opacity: .7; }
.adm-nav a:hover { color: var(--text); background: rgba(255, 255, 255, .04); }
.adm-nav a.active { color: var(--text); background: rgba(139, 203, 255, .1); }
.adm-nav .cnt { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--blue); color: var(--bg); font-size: 11.5px; display: grid; place-items: center; }
.adm-side-foot { margin-top: auto; display: grid; gap: 8px; }
.adm-main { min-width: 0; padding-bottom: 100px; }
.adm-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 28px; background: rgba(139, 203, 255, .08); border-bottom: 1px solid rgba(139, 203, 255, .2); font-size: 13.5px; color: #CFE8FF; flex-wrap: wrap; }
.adm-banner.ok { background: rgba(91, 227, 168, .08); border-color: rgba(91, 227, 168, .25); color: #C8F5E2; }
.adm-who { font-size: 12.5px; opacity: .75; }
.adm-banner.warn { background: rgba(255, 200, 107, .1); border-color: rgba(255, 200, 107, .3); color: #FFE2AE; }
.adm-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 28px 28px 8px; flex-wrap: wrap; }
.adm-head h1 { font-size: 26px; }
.adm-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.adm-body { padding: 12px 28px; display: grid; gap: 20px; align-content: start; }
.adm-note { color: var(--muted); font-size: 13.5px; }
.adm-note code, .modal code, .adm-card code { font-family: ui-monospace, Consolas, monospace; font-size: .92em; padding: 1px 6px; border-radius: 5px; background: rgba(255, 255, 255, .06); color: #CFE8FF; }
.adm-login { min-height: 100vh; display: grid; place-items: center; padding: 16px; }
.adm-login .form { width: min(420px, 100%); }
.adm-login h1 { font-size: 24px; margin-top: 10px; }
.err { color: var(--red); font-size: 13.5px; }
.adm-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.adm-stat { padding: 20px; border-radius: 16px; background: var(--bg-2); border: 1px solid var(--line); }
.adm-stat b { display: block; font-family: var(--font-display); font-size: 36px; line-height: 1; letter-spacing: -.03em; }
.adm-stat span { display: block; margin-top: 8px; color: var(--muted); font-size: 13.5px; }
.adm-cols { display: grid; grid-template-columns: 1fr 1.2fr 1.2fr; gap: 16px; align-items: start; }
.adm-card { padding: 22px; border-radius: 18px; background: var(--bg-2); border: 1px solid var(--line); }
.adm-card h2 { font-size: 16px; margin-bottom: 14px; }
.dist { display: flex; height: 12px; border-radius: 6px; overflow: hidden; gap: 2px; }
.dist-legend { margin-top: 14px; display: grid; gap: 8px; font-size: 13.5px; }
.dist-legend li { display: flex; justify-content: space-between; color: var(--muted); }
.dist-legend span { display: inline-flex; align-items: center; gap: 8px; }
.dist-legend i { width: 8px; height: 8px; border-radius: 2px; }
.dist-legend b { color: var(--text); font-family: var(--font-display); }
.adm-list { display: grid; gap: 4px; }
.adm-list a { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 10px; transition: background .2s; }
.adm-list a:hover { background: rgba(255, 255, 255, .04); }
.adm-list a > span:nth-child(2) { flex: 1; min-width: 0; }
.adm-list b { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-list small, .audit small { color: var(--dim); font-size: 12px; }
.thumb { flex: none; width: 44px; height: 44px; border-radius: 10px; overflow: hidden; display: block; }
.thumb .art { width: 100%; height: 100%; }
.thumb .art-window, .thumb .art-orb { display: none; }
.thumb .art-mono { font-size: 14px; left: 6px; bottom: 6px; }
.pill { font-size: 11.5px; padding: 3px 8px; border-radius: 999px; background: rgba(255, 255, 255, .06); color: var(--muted); white-space: nowrap; }
.pill.on { background: rgba(91, 227, 168, .14); color: var(--green); }
.audit { display: grid; gap: 10px; font-size: 13.5px; }
.audit li { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: baseline; }
.audit span { color: var(--blue); }
.audit b { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plist { display: grid; gap: 8px; }
.prow { display: grid; grid-template-columns: 20px 44px minmax(0, 1fr) auto auto auto auto; align-items: center; gap: 14px; padding: 10px 14px; border-radius: 14px; background: var(--bg-2); border: 1px solid var(--line); transition: border-color .2s, opacity .2s; }
.prow.dragging { opacity: .4; }
.prow.over { border-color: var(--blue); }
.handle { cursor: grab; color: var(--dim); letter-spacing: -2px; user-select: none; }
.pt b { display: block; font-size: 15px; }
.pt small { color: var(--dim); font-size: 12.5px; }
.pt:hover b { color: var(--blue); }
.pa { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 12.5px; color: var(--muted); position: relative; }
.switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.switch i { width: 36px; height: 20px; border-radius: 10px; background: var(--bg-4); position: relative; transition: background .2s; }
.switch i::after { content: ''; position: absolute; left: 3px; top: 3px; width: 14px; height: 14px; border-radius: 50%; background: var(--text); transition: transform .25s var(--ease); }
.switch input:checked + i { background: var(--green); }
.switch input:checked + i::after { transform: translateX(16px); }
.switch input:focus-visible + i { outline: 2px solid var(--blue); outline-offset: 2px; }
.star { font-size: 18px; color: var(--bg-4); transition: color .2s, transform .2s; }
.star.on { color: var(--amber); }
.star:hover { transform: scale(1.15); }
.etabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--line); scrollbar-width: none; }
.etab { flex: none; padding: 12px 16px; color: var(--muted); font-size: 14.5px; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .2s; }
.etab:hover { color: var(--text); }
.etab[aria-selected="true"] { color: var(--text); border-bottom-color: var(--blue); font-weight: 600; }
.epanel { padding: 24px 0; display: grid; gap: 16px; align-content: start; }
.fgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 20px; }
.fgrid.one { grid-template-columns: 1fr; }
.fgrid .span2 { grid-column: 1 / -1; }
.checks { display: flex; gap: 24px; flex-wrap: wrap; padding-top: 4px; }
.colors { display: flex; align-items: center; gap: 10px; }
.colors input[type="color"] { width: 44px; height: 44px; padding: 3px; border-radius: 12px; border: 1px solid var(--line-2); background: transparent; cursor: pointer; }
.art-prev { width: 120px; height: 72px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line-2); }
.art-prev .art { width: 100%; height: 100%; }
.art-prev .art-mono { font-size: 22px; }
.media-in { display: flex; gap: 6px; align-items: center; }
.media-in input { flex: 1; min-width: 0; }
.media-in .btn { height: 42px; }
.mini-prev { margin-top: 6px; width: 120px; height: 72px; border-radius: 8px; overflow: hidden; border: 1px solid var(--line-2); display: grid; place-items: center; background: var(--bg); font-size: 12px; color: var(--muted); }
.mini-prev img { width: 100%; height: 100%; object-fit: cover; }
.block { padding: 18px; border-radius: 16px; background: var(--bg-2); border: 1px solid var(--line); display: grid; gap: 14px; }
details.block > summary { display: flex; align-items: center; gap: 12px; cursor: pointer; list-style: none; }
details.block > summary::-webkit-details-marker { display: none; }
details.block > summary::before { content: '\25B8'; color: var(--dim); transition: transform .2s; }
details.block[open] > summary::before { transform: rotate(90deg); }
details.block > summary b { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bno { font-family: var(--font-display); font-size: 11.5px; letter-spacing: .12em; color: var(--blue); }
.row-btns { display: inline-flex; gap: 4px; flex: none; }
.row-block { grid-template-columns: 1fr auto; align-items: start; }
.sub-h { font-size: 16px; margin-top: 16px; }
.add-btn { justify-self: start; border-style: dashed; }
.table-rows { display: grid; gap: 8px; }
.trow { display: grid; gap: 10px; align-items: end; padding: 12px; border-radius: 14px; background: var(--bg-2); border: 1px solid var(--line); }
.tech-row { grid-template-columns: 160px 1fr 2fr auto; }
.node-row { grid-template-columns: 1.2fr 1fr 130px 64px 64px auto; }
.node-row .wide { grid-column: 1 / -2; grid-row: 2; }
.edge-row { grid-template-columns: 1fr 1fr 1fr auto; }
.kv-row { grid-template-columns: 1fr 2fr auto; }
.trow .row-btns { padding-bottom: 6px; }
.savebar { position: fixed; left: 240px; right: 0; bottom: 0; z-index: 40; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 28px; background: rgba(13, 18, 32, .92); backdrop-filter: blur(12px); border-top: 1px solid var(--line); }
.save-state { color: var(--dim); font-size: 13.5px; }
.save-state.dirty { color: var(--amber); }
.savebar-actions { display: flex; gap: 8px; }
.savebar kbd { font-family: var(--font-display); font-size: 10.5px; opacity: .55; margin-left: 4px; }
.meter { height: 8px; border-radius: 4px; background: var(--bg-4); overflow: hidden; margin-bottom: 10px; }
.meter i { display: block; height: 100%; background: var(--grad); }
.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.mtile { margin: 0; border-radius: 14px; overflow: hidden; background: var(--bg-2); border: 1px solid var(--line); }
.mthumb { aspect-ratio: 16/10; display: grid; place-items: center; color: var(--dim); font-size: 12px; }
.mthumb img, .mthumb video { width: 100%; height: 100%; object-fit: cover; }
.mtile figcaption { padding: 12px; display: grid; gap: 4px; font-size: 13.5px; }
.mtile small { color: var(--muted); font-size: 12px; }
.mtile .path { color: var(--dim); word-break: break-all; }
.mtile .btn { justify-self: start; margin-top: 6px; }
.qlist { display: grid; gap: 12px; }
.qcard { padding: 18px; border-radius: 16px; background: var(--bg-2); border: 1px solid var(--line); display: grid; gap: 10px; }
.qcard.done { opacity: .55; }
.qcard header { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.qcard header a { color: var(--blue); font-size: 14px; }
.qcard header small { margin-left: auto; color: var(--dim); }
.qcard p { white-space: pre-line; color: #CAD3E3; }
.qcard footer { display: flex; gap: 6px; }
.btn-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }

@media (max-width: 1100px) {
  .adm-cols { grid-template-columns: 1fr; }
  .prow { grid-template-columns: 20px 44px minmax(0, 1fr) auto auto; }
  .prow .ps { display: none; }
  .prow .pa { grid-column: 1 / -1; justify-content: flex-start; }
}
@media (max-width: 860px) {
  .adm { grid-template-columns: 1fr; }
  .adm-side { position: sticky; top: 0; z-index: 30; height: auto; flex-direction: row; align-items: center; padding: 10px 16px; gap: 12px; overflow-x: auto; }
  .adm-side .logo-text { display: none; }
  .adm-nav { display: flex; gap: 2px; }
  .adm-nav a { padding: 8px 10px; white-space: nowrap; font-size: 13.5px; }
  .adm-side-foot { margin: 0 0 0 auto; display: flex; }
  .adm-head, .adm-body { padding-left: 16px; padding-right: 16px; }
  .adm-banner { padding: 10px 16px; }
  .adm-stats { grid-template-columns: 1fr 1fr; }
  .fgrid { grid-template-columns: 1fr; }
  .tech-row, .node-row, .edge-row, .kv-row { grid-template-columns: 1fr 1fr; }
  .node-row .wide { grid-column: 1 / -1; grid-row: auto; }
  .trow .row-btns { grid-column: 1 / -1; justify-content: flex-end; }
  .savebar { left: 0; padding: 10px 16px; }
  .save-state { display: none; }
}