/* ===== additions for the hosted, multi-user site ===== */
.top .acct{flex:none;display:flex;align-items:center;gap:8px}
.btn{font:inherit;font-family:var(--mono);font-size:.76rem;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border-radius:9px;border:1px solid var(--line-strong);background:var(--paper);color:var(--ink);cursor:pointer;text-decoration:none;white-space:nowrap;line-height:1.2}
.btn:hover{border-color:var(--cobalt);color:var(--cobalt)}
.btn.primary{background:var(--cobalt);border-color:var(--cobalt);color:var(--paper)}
.btn.primary:hover{filter:brightness(1.08);color:var(--paper)}
.btn.danger{color:#a3261c;border-color:color-mix(in srgb,#a3261c 40%,var(--line))}
.btn.ghost{background:transparent}
.btn.sm{padding:5px 10px;font-size:.7rem}
.btn[disabled]{opacity:.5;cursor:default}
.userbtn{display:flex;align-items:center;gap:8px;padding:3px 10px 3px 3px;border-radius:999px;border:1px solid var(--line);background:var(--glaze);cursor:pointer;font:inherit;color:var(--ink);font-size:.86rem}
.userbtn:hover{border-color:var(--cobalt)}
.userbtn .av{width:30px;height:30px;font-size:.72rem}
.tabs a .count{display:inline-block;min-width:18px;padding:0 5px;margin-left:5px;border-radius:999px;background:var(--ochre-mark);color:#2a1c00;font-size:.64rem;text-align:center}

/* drawer actions */
.dact{display:flex;flex-wrap:wrap;gap:6px}
.mine{font-family:var(--mono);font-size:.7rem;color:var(--leaf);background:var(--leaf-soft);border:1px solid color-mix(in srgb,var(--leaf) 40%,transparent);padding:3px 9px;border-radius:999px;display:inline-block}
.facts .by{font-family:var(--mono);font-size:.66rem;color:var(--muted);margin-left:4px}
.facts .fnote{display:block;font-size:.82rem;color:var(--muted)}
.tag.t-memory{border-color:var(--ochre);color:var(--ochre);background:var(--ochre-soft)}
.tag.t-record{border-color:var(--cobalt);color:var(--cobalt);background:var(--cobalt-soft)}
.tag.t-account{border-color:var(--leaf);color:var(--leaf);background:var(--leaf-soft)}

/* modal */
.modal-wrap{position:fixed;inset:0;z-index:80;background:rgba(12,18,32,.45);display:grid;place-items:center;padding:16px;overflow:auto}
.modal{width:min(640px,100%);max-height:calc(100vh - 32px);overflow:auto;background:var(--paper);border:1px solid var(--line-strong);border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.3);display:flex;flex-direction:column}
.modal.wide{width:min(900px,100%)}
.mhead{display:flex;align-items:flex-start;gap:12px;padding:18px 20px 12px;border-bottom:1px solid var(--line)}
.mhead h2{font-size:1.35rem}
.mhead p{font-size:.92rem;color:var(--muted);margin-top:4px}
.mhead .x{margin-left:auto}
.mbody{padding:18px 20px;display:grid;gap:16px}
.mfoot{display:flex;gap:8px;justify-content:flex-end;align-items:center;padding:12px 20px 18px;border-top:1px solid var(--line);flex-wrap:wrap}
.mfoot .msg{margin-right:auto;font-size:.88rem;color:#a3261c}

/* forms */
.f{display:grid;gap:6px}
.f>label,.f>.lab{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.f .help{font-size:.82rem;color:var(--faint)}
.f input[type=text],.f input[type=email],.f input[type=password],.f input[type=number],.f input:not([type]),.f select,.f textarea{font:inherit;font-size:.95rem;width:100%;padding:9px 11px;border:1px solid var(--line-strong);border-radius:8px;background:var(--glaze);color:var(--ink)}
.f textarea{min-height:90px;resize:vertical;line-height:1.5}
.f textarea.code{font-family:var(--mono);font-size:.8rem;min-height:320px}
.frow{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.check2{display:flex;gap:8px;align-items:center;font-size:.92rem}
fieldset.box{border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:grid;gap:10px;margin:0}
fieldset.box legend{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:0 6px}
.rowlist{display:grid;gap:10px}
.rowitem{display:grid;gap:6px;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--glaze)}
.rowitem .tools2{display:flex;gap:6px;justify-content:flex-end}
.gthumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.gthumbs figure{display:grid;gap:6px;padding:8px;border:1px solid var(--line);border-radius:9px;background:var(--glaze)}
.gthumbs img{width:100%;height:110px;object-fit:cover;border-radius:6px}
.err{color:#a3261c;font-size:.9rem}
.ok{color:var(--leaf);font-size:.9rem}
.copyline{display:flex;gap:6px}
.copyline input{flex:1;font-family:var(--mono);font-size:.78rem}

/* sign-in / landing */
.gate{position:fixed;inset:0;z-index:70;background:var(--glaze);display:grid;place-items:center;padding:20px;overflow:auto;
  background-image:radial-gradient(var(--dot) 1px,transparent 1.2px);background-size:22px 22px}
.gate .card2{width:min(440px,100%);background:var(--paper);border:1px solid var(--line-strong);border-radius:16px;padding:28px;display:grid;gap:18px;box-shadow:0 20px 60px rgba(10,20,50,.12)}
.gate h1{font-size:1.9rem}
.gate svg.mark{width:44px;height:44px}

/* admin */
.subnav{display:flex;flex-wrap:wrap;gap:6px}
.subnav button{font-family:var(--mono);font-size:.76rem;padding:7px 13px;border-radius:999px;border:1px solid var(--line-strong);background:transparent;color:var(--muted);cursor:pointer}
.subnav button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--glaze)}
.acard{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px 18px;display:grid;gap:12px}
.acard .meta{font-family:var(--mono);font-size:.7rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 14px}
.acard .kind{font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:var(--cobalt-soft);color:var(--cobalt)}
.acard blockquote{font-style:normal;font-size:.95rem}
.adiff{display:grid;gap:8px}
.adiff .dr{display:grid;grid-template-columns:110px 1fr 1fr;gap:10px;font-size:.88rem;align-items:start}
.adiff .dr>span:first-child{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;color:var(--muted);padding-top:3px}
.adiff .old{color:var(--muted);text-decoration:line-through;text-decoration-color:color-mix(in srgb,#a3261c 50%,transparent)}
.adiff .new{background:var(--leaf-soft);border-radius:4px;padding:1px 4px}
.atable-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.atable{width:100%;border-collapse:collapse;font-size:.88rem;min-width:720px}
.atable th,.atable td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.atable th{font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:500;background:var(--glaze)}
.atable tr:last-child td{border-bottom:0}
.atable select{font:inherit;font-size:.85rem;padding:5px 8px;border-radius:7px;border:1px solid var(--line-strong);background:var(--glaze);color:var(--ink);max-width:220px}
.empty{padding:28px;text-align:center;color:var(--muted);border:1px dashed var(--line-strong);border-radius:12px}

/* arrange mode */
body.arrange .node{cursor:move}
body.arrange .vp{outline:3px dashed var(--ochre-mark);outline-offset:-3px}
.arrbar{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:6;display:flex;gap:8px;align-items:center;background:var(--paper);border:1px solid var(--ochre);border-radius:12px;padding:8px 10px;box-shadow:0 6px 20px rgba(20,30,60,.15);font-size:.86rem;max-width:calc(100% - 24px);flex-wrap:wrap}
.tray{position:absolute;left:12px;top:12px;z-index:6;width:230px;max-height:50%;overflow:auto;background:var(--paper);border:1px solid var(--line-strong);border-radius:12px;padding:10px;display:grid;gap:6px;font-size:.84rem}
.tray b{font-family:var(--mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:500}

/* stories: suggest bar */
.suggestbar{display:flex;justify-content:flex-end;padding-top:6px}
.check li{list-style:none}

.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:90;background:var(--ink);color:var(--glaze);padding:10px 16px;border-radius:10px;font-size:.9rem;box-shadow:0 10px 30px rgba(0,0,0,.25);max-width:calc(100% - 32px)}
@media (max-width:720px){
  .top .acct .uname{display:none}
  .adiff .dr{grid-template-columns:1fr}
  .tray{display:none}
}