/* Talosha Inner Lodge app. "Celestial Observatory", premium three-column edition: a navigation rail, the page, and the
   "around the Lodge" column. Bodoni Moda for statements, Manrope for reading, midnight + mineral + one amber accent.
   Every page uses these classes; page-specific styles go in lodge/pages/<page>.css and are loaded by that page only. */
:root{color-scheme:dark;--ink:#06090d;--night:#0e1720;--night-2:#0a1219;--raise:#111c26;--silver:#c5d2d8;--white:#f2f1ea;--muted:#9eaeb9;--gold:#dcc09a;--gold-deep:#b89668;--line:#26323c;--line-soft:#1d2831;--paper:#dce2df;--paper-ink:#16242b;--entry:#e8d7bd;--entry-ink:#1d211f;--entry-hover:#f3e5ce;
--serif:'Bodoni Moda',Georgia,serif;--sans:'Manrope',sans-serif;--ease-out:cubic-bezier(.23,1,.32,1);--rail-w:248px;--col-w:720px;--aside-w:320px;--gutter:clamp(16px,3vw,32px);--header-h:64px;--hover:#c5d2d80a}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--ink);scrollbar-color:#2a3843 transparent}body{margin:0;color:var(--white);font:15px/1.65 var(--sans);-webkit-font-smoothing:antialiased;background:var(--ink)}
/* The night sky behind the Lodge: two star layers and a faint amber dawn, fixed, drawn in CSS (no image to load). */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(1px 1px at 12% 18%,#f2f1eacc 50%,transparent 51%),radial-gradient(1px 1px at 78% 12%,#f2f1eaaa 50%,transparent 51%),
    radial-gradient(1.5px 1.5px at 34% 72%,#dcc09acc 50%,transparent 51%),radial-gradient(1px 1px at 88% 64%,#f2f1ea99 50%,transparent 51%),
    radial-gradient(1px 1px at 56% 38%,#f2f1ea88 50%,transparent 51%),radial-gradient(1.5px 1.5px at 6% 86%,#f2f1eaaa 50%,transparent 51%),
    radial-gradient(1px 1px at 66% 90%,#dcc09a99 50%,transparent 51%),radial-gradient(1px 1px at 94% 34%,#f2f1eabb 50%,transparent 51%),
    radial-gradient(900px 520px at 85% -10%,#dcc09a14,transparent 70%),radial-gradient(1100px 700px at 0% 110%,#1b3346 0%,transparent 65%),
    radial-gradient(1200px 600px at 50% -200px,#13202b 0%,transparent 70%);
  background-size:420px 420px,520px 520px,640px 640px,380px 380px,300px 300px,700px 700px,460px 460px,560px 560px,100% 100%,100% 100%,100% 100%}
a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer;-webkit-appearance:none;appearance:none;background-color:transparent;-webkit-tap-highlight-color:transparent}a{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
::selection{background:var(--gold);color:var(--ink)}
::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:#22303b;border-radius:10px;border:3px solid var(--ink)}
input,textarea{caret-color:var(--gold)}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}

/* The Lodge header */
.topbar{position:fixed;inset:0 0 auto;z-index:40;height:var(--header-h);background:#05080bd9;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--line-soft)}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,#dcc09a55 30%,#dcc09a55 70%,transparent);pointer-events:none}
.top-inner{max-width:1400px;margin:0 auto;height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 24px 0 18px;gap:16px}
.brand{display:flex;align-items:center;gap:12px;padding:4px 10px;border-radius:999px;width:max-content}
.brand img{width:40px;height:40px;object-fit:contain;filter:drop-shadow(0 0 12px #dcc09a4d)}
.top-title{justify-self:center;text-align:center}.top-right{justify-self:end}
.brand-word{font:400 22px/1 var(--serif);letter-spacing:-.02em;white-space:nowrap}.brand-word small{display:block;font:600 9px/1.6 var(--sans);letter-spacing:.32em;text-transform:uppercase;color:var(--gold)}
.top-links{display:flex;gap:6px;justify-self:center}
.top-links a{position:relative;padding:9px 16px;border-radius:999px;color:var(--muted);font-size:14px;font-weight:600;letter-spacing:.01em;transition:color 160ms ease,background-color 160ms ease}
.top-links a[aria-current=page]{color:var(--white);background:#dcc09a14;box-shadow:inset 0 0 0 1px #dcc09a40}
.top-links .badge{position:static;margin-left:6px;vertical-align:1px;box-shadow:none}
.top-right{display:flex;align-items:center;gap:8px;justify-self:end}
.top-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;color:var(--silver)}.top-icon svg{width:22px;height:22px}
/* Header dropdowns (notifications, account) */
.drop{position:relative}
.drop-panel{position:absolute;right:-6px;top:calc(100% + 12px);z-index:50;border:1px solid #2b3945;border-radius:20px;background:linear-gradient(180deg,#0f1922 0%,#0a1218 100%);box-shadow:0 30px 80px -24px #000,0 0 0 1px #00000066,inset 0 1px 0 #ffffff0d;transform-origin:top right;animation:menu-in 200ms var(--ease-out)}
.drop-panel::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.drop-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px 10px}.drop-head b{font:400 20px/1.2 var(--serif);letter-spacing:-.01em}
.text-btn{border:0;padding:6px 10px;margin:-6px -8px -6px 0;border-radius:999px;color:var(--gold);font-size:13px;font-weight:600}
.drop-quiet{margin:0;padding:18px;color:var(--muted);font-size:14px}
.drop-foot{display:block;padding:13px 18px;border-top:1px solid var(--line-soft);color:var(--gold);font-size:14px;font-weight:600;text-align:center;border-radius:0 0 20px 20px}
.notes-panel{width:380px}
.notes-list{display:grid;max-height:min(440px,60vh);overflow:auto;padding:0 6px 6px;scrollbar-width:thin}
.note-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:12px;align-items:start;padding:11px 12px;border-radius:14px;position:relative}
.note-row.unread{background:linear-gradient(90deg,#dcc09a12,transparent 70%)}
.note-row.unread::before{content:"";position:absolute;left:2px;top:24px;width:5px;height:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 8px #dcc09a}
.note-text{display:grid;gap:2px;font-size:14px;line-height:1.4;min-width:0}.note-text b{font-weight:700}
.note-text small{color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.note-row time{color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums;padding-top:2px}
.acct-panel{width:340px;padding:8px;max-height:calc(100svh - var(--header-h) - 24px);overflow:auto;scrollbar-width:none}
.acct-who{display:flex;align-items:center;gap:12px;padding:10px 12px 12px;margin:0 0 4px;border-bottom:1px solid var(--line-soft)}
.acct-who>span:not(.avatar){display:grid;line-height:1.3;min-width:0;flex:1}.acct-who .avatar{flex:0 0 auto}.acct-who b{font-weight:700;font-size:15px}.acct-who small{color:var(--muted);font-size:13px}
.plus-mark{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);background:linear-gradient(180deg,#f0e1c8,#d9bf94);border-radius:999px;padding:3px 9px;font-weight:700}
.menu-sec{padding:6px 0 4px;border-bottom:1px solid var(--line-soft)}
.menu-sec h3{margin:6px 12px 4px;font:600 10px/1.6 var(--sans);letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}
.menu-sec.admin h3{color:#e7a59a}
.menu-row{display:grid;padding:6px 12px;border-radius:12px;line-height:1.3}.menu-row span{font-size:14px;font-weight:600;color:var(--white)}.menu-row small{font-size:12px;color:var(--muted)}
.proj-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;padding:8px 6px 4px}
.proj{display:grid;justify-items:center;gap:6px;padding:10px 2px 8px;border-radius:14px;font-size:11px;font-weight:600;color:var(--silver);text-align:center;transition:background-color 160ms ease,transform 160ms var(--ease-out)}
.proj img{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 4px 10px #000c)}
.menu-out{display:flex;align-items:center;gap:10px;margin-top:4px;padding:9px 12px;border-radius:12px;color:#f0c2b9;font-size:14px;font-weight:600}.menu-out svg{width:18px;height:18px}
.acct-wrap{position:relative}
.acct{display:grid;place-items:center;padding:2px;border:1px solid #dcc09a55;border-radius:50%;background:none;transition:border-color 160ms ease,box-shadow 160ms ease}
.acct[aria-expanded=true]{border-color:var(--gold);box-shadow:0 0 0 4px #dcc09a1f}
.acct-menu{position:absolute;right:0;top:calc(100% + 10px);width:260px;padding:8px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#101b25,#0b131a);box-shadow:0 24px 60px -18px #000e;display:grid;transform-origin:top right;animation:menu-in 180ms var(--ease-out)}
@keyframes menu-in{from{opacity:0;transform:translateY(-4px) scale(.97)}to{opacity:1;transform:none}}
.acct-who{display:flex;align-items:center;gap:12px;padding:10px 10px 14px;border-bottom:1px solid var(--line-soft);margin-bottom:6px}.acct-who span{display:grid;line-height:1.3;min-width:0}.acct-who b{font-weight:700}.acct-who small{color:var(--muted);font-size:13px}
.acct-menu a{padding:10px 12px;border-radius:10px;font-size:14px;font-weight:600;color:var(--silver)}
.acct-menu .danger{color:#f0c2b9}.acct-rule{height:1px;background:var(--line-soft);margin:6px 4px}


/* Layout */
.lodge{display:grid;grid-template-columns:var(--rail-w) minmax(0,1fr);max-width:1400px;margin:var(--header-h) auto 0;min-height:calc(100svh - var(--header-h))}
.lodge.with-aside{grid-template-columns:var(--rail-w) minmax(0,1fr) var(--aside-w)}
.stage{min-width:0;outline:none;padding:28px clamp(20px,3vw,40px) 96px}
.stage.column{padding:24px 24px 96px;border-left:1px solid var(--line-soft);border-right:1px solid var(--line-soft);background:#070b10;box-shadow:0 0 80px -20px #000}
.stage.column.flush{padding:0 0 96px}
.stage.column>*{min-height:100%}

/* Rail */
.rail{position:sticky;top:var(--header-h);align-self:start;height:calc(100svh - var(--header-h));display:flex;flex-direction:column;gap:2px;padding:22px 0 18px 18px;overflow:auto;scrollbar-width:none}
.seal{display:flex;align-items:center;gap:12px;padding:6px 24px 20px 10px}

.seal-word{font:400 22px/1.05 var(--serif);letter-spacing:-.02em}.seal-word small{display:block;font:500 10px/1.8 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.nav-list{display:grid;gap:2px}
.nav-sec{display:grid;gap:2px}.nav-sec:not(.first){margin-top:14px;padding-top:14px;border-top:1px solid #c5d2d814}
.nav-sec-title{margin:0 0 4px;padding:0 14px;font:600 10px/1.6 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.nav{display:flex;align-items:center;gap:16px;padding:11px 14px;border-radius:999px 0 0 999px;color:var(--silver);font-size:17px;letter-spacing:-.005em;transition:background-color 180ms ease,color 180ms ease}
.nav svg{width:24px;height:24px}
.nav-icon{position:relative;display:inline-grid}
.nav[aria-current=page]{color:var(--white);font-weight:700}.nav[aria-current=page] svg{color:var(--gold);stroke-width:1.9}
.badge{position:absolute;top:-6px;right:-9px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--gold);color:var(--ink);font:700 10px/18px var(--sans);text-align:center;box-shadow:0 0 0 2px var(--ink)}
.plus-tag{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);border:1px solid #dcc09a55;border-radius:999px;padding:1px 7px;margin-left:2px}
.write{display:flex;align-items:center;justify-content:center;gap:10px;margin:18px 14px 0 6px;height:46px;border-radius:999px;background:transparent;border:1px solid color-mix(in srgb,var(--gold) 38%,transparent);color:color-mix(in srgb,var(--gold) 85%,var(--white));font-weight:600;font-size:15px;transition:transform 140ms var(--ease-out),background-color 180ms ease,border-color 180ms ease}
.write:active{transform:scale(.98)}
.me-row{margin-top:auto;padding-right:14px;display:flex;align-items:center;gap:4px;min-width:0}
.me-chip{flex:1;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:999px;transition:background-color 180ms ease;min-width:0}
.sign-out{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:var(--muted);flex-shrink:0;transition:color 160ms ease,background-color 160ms ease}
.me-text{display:grid;line-height:1.3;min-width:0}.me-text b{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.me-text small{color:var(--muted);font-size:13px}

/* Right column */
.aside{position:sticky;top:var(--header-h);align-self:start;padding:18px 8px 24px 24px;display:grid;gap:16px;align-content:start}
.search{display:flex;align-items:center;gap:12px;height:48px;padding:0 18px;border-radius:999px;background:var(--night);border:1px solid var(--line-soft);color:var(--muted);transition:border-color 160ms ease,background-color 160ms ease}
.search:focus-within{border-color:#dcc09a88;background:var(--ink);color:var(--gold)}
.search input{-webkit-appearance:none;appearance:none;flex:1;min-width:0;height:100%;border:0;background:none;outline:none;padding:0;font-size:15px;color:var(--white)}
.search input::-webkit-search-cancel-button{-webkit-appearance:none}.search input::placeholder{color:var(--muted)}
.side-card{border:1px solid var(--line-soft);border-radius:18px;background:linear-gradient(180deg,var(--night),var(--night-2));overflow:hidden}
.side-card h2{font:400 22px/1.2 var(--serif);letter-spacing:-.02em;margin:0;padding:16px 18px 8px}.side-card h2 em{color:var(--gold)}
.side-card>p{margin:0;padding:0 18px 14px;color:var(--silver);font-size:14px}
.side-card .btn{margin:0 18px 18px}
.side-row{display:flex;align-items:center;gap:12px;padding:11px 18px;transition:background-color 160ms ease;min-width:0}
.side-row>span{display:grid;line-height:1.35;min-width:0}.side-row b{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side-row small{color:var(--muted);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-row.person{justify-content:space-between}.side-person{display:flex;align-items:center;gap:12px;min-width:0}.side-person>span{display:grid;line-height:1.35;min-width:0}
.side-row.person .btn,.side-row.person button{min-height:34px;padding:4px 14px;font-size:13px;border-radius:999px;flex-shrink:0}
.side-row .date{display:grid;place-items:center;width:44px;height:48px;border:1px solid var(--line);border-radius:10px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);line-height:1.1;flex-shrink:0}.side-row .date b{font:400 20px/1 var(--serif);color:var(--white);letter-spacing:0}
.hall-dot{width:10px;height:10px;border-radius:50%;border:1px solid var(--gold);box-shadow:0 0 12px #dcc09a66;flex-shrink:0}
.side-more{display:block;padding:12px 18px 16px;color:var(--gold);font-size:14px}
.side-quiet{color:var(--muted);font-size:14px;padding:4px 18px 4px;margin:0}
.plus-card{background:radial-gradient(420px 200px at 100% 0,#dcc09a1f,transparent 70%),linear-gradient(180deg,var(--night),var(--night-2));border-color:#dcc09a33}
/* The Order invitation (people with no Order rank): the one card with a gold hairline, a lit crest and a wide ivory pill. */
.order-card{position:relative;padding-top:22px;border-color:#dcc09a47;background:radial-gradient(260px 150px at 50% -24px,#dcc09a2e,transparent 72%),linear-gradient(180deg,#121c26,var(--night-2));box-shadow:0 18px 40px -26px #000,inset 0 1px 0 #f2f1ea0d}
.order-card::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent)}
.order-crest{display:block;width:48px;height:48px;margin:0 18px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px #dcc09a59,0 8px 22px -8px #dcc09a73}
.order-card h2{font-size:25px;line-height:1.15;padding-top:14px;padding-bottom:10px;text-wrap:balance}.order-card h2 em{font-style:italic}
.order-card>p{padding-bottom:8px;text-wrap:pretty}.order-card>p+p{color:var(--white);padding-bottom:16px}
.order-card .btn{display:flex;margin:0 18px 18px}
.order-card.calm{border-color:#dcc09a2e;background:radial-gradient(260px 150px at 50% -24px,#dcc09a1a,transparent 72%),linear-gradient(180deg,#121c26,var(--night-2))}.order-card.calm .btn{border-color:#dcc09a59;color:var(--gold)}
.side-foot{display:grid;gap:3px;justify-items:center;text-align:center;padding:0 6px;font-size:12px;line-height:1.45;color:#6f7f8a}
.foot-line{display:flex;justify-content:center;flex-wrap:nowrap;white-space:nowrap;min-width:0}.foot-line>a+a::before{content:"\00b7";margin:0 6px;color:#4d5a63}
.side-foot a:hover{color:var(--silver);text-decoration:underline;text-underline-offset:2px}
.side-foot .copy{color:#5f6e78;font-size:11.5px}

/* Column header (sticky, glass) used by column pages */
.col-head{position:sticky;top:var(--header-h);z-index:10;background:#070b10eb;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line-soft);isolation:isolate}
.col-head .col-title{display:flex;align-items:center;gap:14px;padding:14px 20px 10px;min-height:56px}
.col-head h1{font:400 24px/1.15 var(--serif);letter-spacing:-.02em;margin:0}
.col-head .col-sub{color:var(--muted);font-size:13px;margin:0}

/* Shared pieces every page uses */
.page-head{display:flex;align-items:end;justify-content:space-between;gap:24px;padding-bottom:22px;border-bottom:1px solid var(--line-soft);margin-bottom:28px}
.stage.column.flush .page-head{padding:22px 20px 18px;margin-bottom:0}
.page-head h1{font:400 clamp(32px,3.6vw,46px)/1.05 var(--serif);letter-spacing:-.035em;margin:0}.page-head h1 em{color:var(--gold);font-style:italic}
.page-head p{margin:8px 0 0;color:var(--muted);font-size:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:42px;padding:9px 20px;border:1px solid #e5ccb0;border-radius:999px;background:var(--entry);color:var(--entry-ink);font-size:14px;font-weight:700;transition:transform 140ms var(--ease-out),background-color 160ms ease,border-color 160ms ease}
.btn:active{transform:scale(.97)}.btn.ghost{background:transparent;color:var(--white);border-color:var(--line);font-weight:600}
.btn[disabled]{opacity:.45;cursor:default}
.card{background:linear-gradient(180deg,var(--night),var(--night-2));border:1px solid var(--line-soft);border-radius:16px;padding:20px 22px}
.quiet{color:var(--muted)}.label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;background:radial-gradient(circle at 30% 25%,#1d2b37,#0d161e);border:1px solid var(--line);display:inline-grid;place-items:center;font-family:var(--serif);color:var(--silver);flex-shrink:0}
.chip{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border:1px solid var(--line);border-radius:999px;font-size:11px;color:var(--silver)}.chip.gold{border-color:#dcc09a66;color:var(--gold)}
.field{display:grid;gap:6px}.field input,.field textarea,.field select{background:var(--ink);border:1px solid var(--line);padding:12px 14px;border-radius:10px}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:#dcc09a88}
.empty{padding:64px 24px;text-align:center;color:var(--muted)}.empty h2{font:400 30px/1.2 var(--serif);letter-spacing:-.025em;color:var(--white);margin:0 0 10px}.empty p{max-width:44ch;margin:0 auto 22px}
.gate{max-width:560px;margin:8vh auto;text-align:center;padding:0 16px}.gate h1{font:400 clamp(40px,6vw,64px)/1.05 var(--serif);letter-spacing:-.04em;margin:0 0 18px}.gate h1 em{color:var(--gold)}.gate p{color:var(--silver)}.gate .actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.tabbar,.fab{display:none}

@media(hover:hover) and (pointer:fine){
  .nav:hover,.me-chip:hover{background:#c5d2d812;color:var(--white)}
  .top-links a:hover{color:var(--white);background:#c5d2d80d}.top-icon:hover{background:#c5d2d812;color:var(--white)}
  .acct:hover,.drop.open .acct{border-color:var(--gold)}
  .menu-row:hover,.note-row:hover,.menu-out:hover{background:#c5d2d80d}.text-btn:hover{background:#dcc09a14}.drop-foot:hover{background:#dcc09a0d}
  .proj:hover{background:#dcc09a0f;color:var(--white);transform:translateY(-1px)}
  .sign-out:hover{color:#f0c2b9;background:#e7a59a14}
  .write:hover{background:color-mix(in srgb,var(--gold) 10%,transparent);border-color:color-mix(in srgb,var(--gold) 60%,transparent)}
  .side-row:hover{background:var(--hover)}.side-more:hover{background:var(--hover)}
  .btn:hover{background:var(--entry-hover)}.btn.ghost:hover{background:#c5d2d80f;border-color:#3a4a56}
}
/* Narrower desktops: the right column goes first, then the rail folds to icons. */
@media(max-width:1240px){.lodge.with-aside{grid-template-columns:var(--rail-w) minmax(0,1fr)}.aside{display:none}}
@media(max-width:1000px){
  :root{--rail-w:88px}
  .top-inner{grid-template-columns:1fr auto 1fr}
  .rail{align-items:center;padding:14px 8px}.seal-word,.nav-label,.plus-tag,.me-text,.nav-sec-title{display:none}.nav-sec:not(.first){margin-top:8px;padding-top:8px}.seal{padding:6px 0 18px}
  .nav{padding:12px;width:max-content;border-radius:999px}.me-row{padding-right:0}.write{width:52px;margin:16px 0 0}.me-chip{padding:6px}.me-row{flex-direction:column}
}
/* Phones: bottom tab bar, a floating write button, the page full width. */
@media(max-width:700px){
  .lodge,.lodge.with-aside{grid-template-columns:1fr}.rail{display:none}
  .stage{padding:20px 16px calc(96px + env(safe-area-inset-bottom))}.stage.column{padding:0 0 calc(96px + env(safe-area-inset-bottom));border:0}
  .tabbar{display:flex;position:fixed;inset:auto 0 0;z-index:30;justify-content:space-around;padding:6px 6px calc(6px + env(safe-area-inset-bottom));background:#06090df0;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid var(--line-soft)}
  .tabbar a{display:grid;justify-items:center;gap:2px;min-width:56px;padding:6px 4px;font-size:10px;color:var(--muted)}.tabbar svg{width:24px;height:24px}
  .tabbar .nav-label{display:block}.tabbar .badge{right:-10px}
  .tabbar a[aria-current=page]{color:var(--white)}.tabbar a[aria-current=page] svg{color:var(--gold);stroke-width:1.9}
  .fab{display:grid;place-items:center;position:fixed;right:18px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:31;width:56px;height:56px;border-radius:50%;background:linear-gradient(180deg,#f0e1c8,#e1caa6);color:var(--entry-ink);box-shadow:0 12px 30px -8px #000c,0 0 0 1px #fff3 inset}
  .fab svg{width:24px;height:24px;stroke-width:1.8}
  .col-head .col-title{padding:12px 16px 8px}
  .top-links{display:none}.notes-panel{width:calc(100vw - 24px);right:-58px}.acct-panel{width:calc(100vw - 24px);right:-6px}.top-inner{grid-template-columns:1fr auto 1fr;padding:0 12px}.brand-word{display:block;font-size:19px}
  .stage.column{padding:20px 16px calc(96px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
.acct-who > span.plus-mark.plus-mark{display:inline-block;flex:0 0 auto;flex:0 0 auto;width:auto;margin-left:auto;text-align:center;line-height:1.6;padding:3px 9px 3px calc(9px + .18em)}
/* Side box "Lodge members": a compact Follow pill, so the name and @handle get the room */
.side-row.person .side-person{flex:1 1 auto}
.side-row.person .follow-btn.follow-btn{flex:0 0 auto;width:auto;min-width:0;min-height:30px;padding:3px 12px;font-size:12.5px;gap:4px}
.side-row.person .follow-btn svg{width:14px;height:14px}
/* Account setup not finished (owner 2026-11-14): the navigation is shown but cannot be used until the setup is done. */
body.setup-pending .rail .nav-list,body.setup-pending .rail .write,body.setup-pending .rail .me-chip,body.setup-pending #tabbar,body.setup-pending #topbar a[href^="/lodge"],body.setup-pending #topbar button{opacity:.35;pointer-events:none;cursor:default}
/* Owner 2026-11-14: a rail item (bold when open) never wraps beside its PLUS pill */
.rail .nav .nav-label,.rail .plus-tag{white-space:nowrap}.rail .plus-tag{flex-shrink:0}
.rail .nav:has(.plus-tag){gap:12px}
/* Owner 2026-11-15: Inner Lodge Plus seal on avatars everywhere (was Messages only) */
.av-wrap{position:relative;display:inline-flex;flex:none}
.av-wrap > .avatar{width:100%;height:100%}
.av-plus{position:absolute;right:-2px;bottom:-2px;width:var(--s);height:var(--s);display:grid;place-items:center;border-radius:50%;background:linear-gradient(180deg,#f0e1c8,#d4b483);color:#1a1408;box-shadow:0 0 0 2px var(--bg,#0b1017);pointer-events:none}
.av-plus svg{width:62%;height:62%;fill:currentColor;stroke:none}
/* Owner 2026-11-15: picture pop-up for posts and messages (global, so Messages has it too) */
.pc-lightbox{padding:0;border:0;background:transparent;max-width:min(96vw,1400px);max-height:94vh;overflow:visible}
.pc-lightbox::backdrop{background:#05080dcc;backdrop-filter:blur(4px)}
.pc-lightbox img{display:block;max-width:min(96vw,1400px);max-height:90vh;width:auto;height:auto;border-radius:12px;object-fit:contain}
.pc-lb-close{position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--ink);color:var(--white);display:grid;place-items:center;cursor:pointer}
.pc-lb-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
/* Owner 2026-11-15: the floating confirmation — a quiet glass pill at the bottom centre */
.lodge-flash{position:fixed;left:50%;bottom:28px;z-index:1000;display:flex;align-items:center;gap:12px;max-width:min(560px,calc(100vw - 32px));padding:12px 18px 12px 12px;border-radius:999px;
  background:linear-gradient(180deg,#1b2128f2,#12171df2);border:1px solid #dcc09a33;box-shadow:0 18px 50px #000c,inset 0 1px 0 #ffffff0d;backdrop-filter:blur(12px);
  color:var(--white);font-size:14.5px;letter-spacing:.01em;opacity:0;transform:translate(-50%,12px) scale(.98);transition:opacity 260ms ease,transform 320ms cubic-bezier(.2,.8,.2,1)}
.lodge-flash.in{opacity:1;transform:translate(-50%,0) scale(1)}
.lodge-flash .lf-mark{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,#9be7b9,#5fcf8f);color:#0b1a12;box-shadow:0 0 0 4px #7fe0a81f}
.lodge-flash .lf-mark svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.lodge-flash.warn{border-color:#e0a87f44}
.lodge-flash .lf-link{margin-left:4px;padding:6px 12px;border-radius:999px;background:#dcc09a1f;color:var(--gold);font-weight:600;font-size:13.5px;text-decoration:none;white-space:nowrap}
.lodge-flash .lf-link:hover{background:#dcc09a33}
@media (prefers-reduced-motion:reduce){.lodge-flash{transition:none}}
/* Owner 2026-11-15: a shared post for visitors without an account */
.pub{max-width:680px;margin:0 auto;padding:24px 16px}
.pub-card{border:1px solid var(--line);border-radius:18px;padding:18px 20px}
.pub-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}.pub-head b{display:block;color:var(--white)}.pub-head span{color:var(--muted);font-size:13px}
.pub .pc-body{white-space:pre-wrap;margin:8px 0}.pub .pc-title{margin:6px 0}
.pub-imgs{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.pub-imgs img{max-width:min(100%,60%);max-height:360px;border-radius:14px;cursor:zoom-in}
.pub-stats{display:flex;gap:18px;margin-top:12px;color:var(--muted);font-size:14px}.pub-stats b{color:var(--white)}
.pub-join{margin-top:20px;padding:18px 20px;border:1px solid #dcc09a44;border-radius:18px;background:#dcc09a0d;text-align:center}
.pub-join p{margin:0 0 12px;color:var(--white)}.pub-actions{display:flex;gap:10px;justify-content:center}

/* Owner 2026-11-15: X-style hover on every small icon-only button: soft round grey circle + a label pill under it (pill is drawn by ui.js so it is never clipped and works inside dialogs). */
.ltip{position:fixed;z-index:2147483000;padding:4px 8px;border-radius:4px;background:rgba(91,99,110,.92);color:#fff;font:500 13px/1.3 system-ui,-apple-system,sans-serif;white-space:nowrap;pointer-events:none;opacity:0;transform:translateX(-50%);transition:opacity 150ms ease}
.ltip.on{opacity:1}
.ib-hover{transition:background-color 150ms ease,color 150ms ease,filter 150ms ease}
.react svg{border-radius:50%;transition:background-color 150ms ease,box-shadow 150ms ease,filter 150ms ease}
@media (hover:hover) and (pointer:fine){
  .ib-hover:not(.cp-tool):not(.react):not(:disabled):hover{background-color:rgba(255,255,255,.10);border-radius:50%;filter:brightness(1.2)}
  .react:hover svg{background:rgba(255,255,255,.10);box-shadow:0 0 0 9px rgba(255,255,255,.10);filter:brightness(1.2)}
}
.ib-hover:not(.cp-tool):not(.react):focus-visible{background-color:rgba(255,255,255,.10);border-radius:50%}
.react:focus-visible svg{background:rgba(255,255,255,.10);box-shadow:0 0 0 9px rgba(255,255,255,.10)}

.side-row small.side-why{color:var(--gold);font-size:12px;opacity:.85}

/* Recent searches panel (owner 2026-11-15, X-style) — components/recent-search.js */
.rs-host{position:relative}
.rs-panel{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:40;max-height:min(70vh,520px);overflow:auto;padding:6px 0 8px;border:1px solid var(--line-soft);border-radius:16px;background:var(--ink);box-shadow:0 18px 48px #000a,0 0 0 1px #ffffff06;color:var(--white);cursor:default}
.rs-head{display:flex;align-items:center;justify-content:space-between;padding:10px 16px 6px}.rs-head b{font:400 20px/1.2 var(--serif);letter-spacing:-.01em}
.rs-clear{border:0;background:none;color:var(--gold);font:600 13px var(--sans);padding:6px 8px;margin-right:-8px;border-radius:999px;cursor:pointer}
.rs-row{display:flex;align-items:center;min-width:0}
.rs-go{flex:1;min-width:0;display:flex;align-items:center;gap:12px;border:0;background:none;color:inherit;text-align:left;padding:10px 6px 10px 16px;cursor:pointer;font:inherit}
.rs-row.person .rs-go{padding-top:8px;padding-bottom:8px}
.rs-ic{display:grid;place-items:center;width:40px;flex-shrink:0;color:var(--silver)}
.rs-q{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rs-who{display:grid;line-height:1.3;min-width:0}.rs-who b{font-weight:700;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rs-who small{color:var(--muted);font-size:13px}
.rs-x{flex-shrink:0;display:grid;place-items:center;width:34px;height:34px;margin-right:10px;border:0;border-radius:999px;background:none;color:var(--gold);cursor:pointer}
.rs-empty{margin:0;padding:16px;color:var(--muted);font-size:14px;text-align:center}
@media(hover:hover) and (pointer:fine){.rs-row:hover{background:var(--hover)}.rs-x:hover{background:#dcc09a1f}.rs-clear:hover{background:#dcc09a14}}