/* ============================================================
   SHINRIN design system
   palette: forest night #0b1126 · dusk #2c2a55 · firefly #ffc069
            spirit teal #7fe0cf · verify green #8ef0b0 · glass
   type:    Shippori Mincho (display) · Inter (UI) · JetBrains Mono (data)
   ============================================================ */
:root{
  --ink:#0b1126;
  --paper:#eef0fa;
  --dim:#9aa3c7;
  --dimmer:#5f6890;
  --firefly:#ffc069;
  --teal:#7fe0cf;
  --verify:#8ef0b0;
  --danger:#f0928e;
  --glass:rgba(12,16,34,.62);
  --glass-soft:rgba(12,16,34,.42);
  --edge:rgba(255,255,255,.09);
  --edge-strong:rgba(255,255,255,.16);
  --r-lg:20px; --r-md:14px; --r-sm:9px;
  --disp:'Shippori Mincho',serif;
  --ui:'Inter',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden;background:var(--ink)}
body{font-family:var(--ui);color:var(--paper);-webkit-font-smoothing:antialiased}
button{font-family:var(--ui);color:inherit;background:none;border:none;cursor:pointer}
input{font-family:var(--ui)}
::selection{background:rgba(255,192,105,.35)}

#world{position:fixed;inset:0;display:block;cursor:grab;touch-action:none}
#world.dragging{cursor:grabbing}
#world.placing{cursor:crosshair}

/* ---------- shared glass ---------- */
.glass{
  background:var(--glass);
  border:1px solid var(--edge);
  border-radius:var(--r-lg);
  backdrop-filter:blur(18px) saturate(1.3);
  -webkit-backdrop-filter:blur(18px) saturate(1.3);
  box-shadow:0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
}
.chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 13px;border-radius:999px;font-size:12px;font-weight:500;
  background:var(--glass-soft);border:1px solid var(--edge);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  color:var(--dim);white-space:nowrap;
}
.chip b{color:var(--paper);font-weight:600}
.chip .mono{font-family:var(--mono);font-size:11px;letter-spacing:0;color:var(--teal)}
.dot{width:6px;height:6px;border-radius:50%;background:var(--verify);box-shadow:0 0 8px var(--verify);animation:pulse 3s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ---------- HUD top ---------- */
#hud-top{position:fixed;top:0;left:0;right:0;padding:16px 18px;display:flex;align-items:flex-start;gap:10px;pointer-events:none;z-index:20}
#hud-top>*{pointer-events:auto}
#wordmark{display:flex;flex-direction:column;gap:2px;margin-right:6px;user-select:none}
#wordmark .kanji{font-family:var(--disp);font-size:26px;font-weight:700;letter-spacing:.02em;line-height:1;text-shadow:0 2px 18px rgba(0,0,0,.5)}
#wordmark .kanji em{font-style:normal;color:var(--firefly)}
#wordmark .sub{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
#hud-spacer{flex:1}
.chipbtn{cursor:pointer;transition:border-color .2s,background .2s}
.chipbtn:hover{border-color:var(--edge-strong);background:rgba(20,26,52,.7)}
#chip-day .mono{margin-left:4px;opacity:.75;font-size:10px}
#hud-more-wrap{position:relative}
#hud-more-panel{
  position:absolute;right:0;top:calc(100% + 8px);min-width:160px;padding:8px;
  display:flex;flex-direction:column;gap:2px;z-index:40;
}
#hud-more-panel[hidden]{display:none !important}
#hud-more-panel button{
  text-align:left;padding:8px 10px;border-radius:8px;font-size:12px;color:var(--dim);
}
#hud-more-panel button:hover{background:rgba(255,255,255,.06);color:var(--paper)}
#dawn-banner{
  position:fixed;left:50%;top:72px;transform:translateX(-50%);
  width:min(420px,92vw);z-index:28;padding:14px 16px;display:none;flex-direction:column;gap:8px;
  border-color:rgba(255,192,105,.28);
}
#dawn-banner.show{display:flex}
#dawn-banner .dawn-k{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--firefly)}
#dawn-banner .dawn-t{font-family:var(--disp);font-size:18px;color:var(--paper)}
#dawn-banner .dawn-b{font-size:12.5px;color:var(--dim);line-height:1.45}
#dawn-banner .dawn-actions{display:flex;gap:10px;justify-content:flex-end;align-items:center}
#places-list{
  max-height:min(52vh,440px);overflow-y:auto;overflow-x:hidden;margin-top:6px;
  padding:2px 10px 6px 0;scrollbar-gutter:stable;scrollbar-width:thin;
}
#places-list .wrow{
  display:flex;align-items:center;gap:12px;padding:10px 4px 10px 0;
  cursor:pointer;border-radius:8px;
}
#places-list .wrow:hover{background:rgba(255,255,255,.04)}
#places-list .wrow .kind{
  flex:0 0 auto;font-size:10px;color:var(--teal);font-family:var(--mono);
  min-width:4.5em;margin-right:0;
}
#places-list .wrow .wname{flex:1;min-width:0;color:var(--paper)}
#places-list .wrow .wname small{display:block;font-size:10px;color:var(--dimmer);font-family:var(--mono)}
#places-list .place-go{
  flex:0 0 auto;font-size:11px;color:var(--firefly);
  background:rgba(255,192,105,.1);border:1px solid rgba(255,192,105,.3);
  border-radius:6px;padding:5px 12px;cursor:pointer;text-decoration:none;
}
#places-list .place-go:hover{background:rgba(255,192,105,.18)}
#veil-places .modal{overflow:hidden;display:flex;flex-direction:column}
#veil-places .modal > h2,#veil-places .modal .lede,#veil-places .modal > div:last-child{flex:0 0 auto}
#veil-places #places-list{flex:1 1 auto;min-height:0}
body.watching #dawn-banner,body.watching #hud-more-panel,body.watching #minimap,body.watching #pulse-bar{opacity:0;pointer-events:none}

/* ---------- dock ---------- */
#dock{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);display:flex;align-items:center;gap:4px;padding:8px;z-index:20;max-width:calc(100vw - 24px)}
.dockbtn{
  display:flex;flex-direction:column;align-items:center;gap:5px;
  min-width:74px;padding:9px 10px 8px;border-radius:var(--r-md);
  color:var(--dim);font-size:10.5px;font-weight:500;letter-spacing:.03em;
  transition:background .18s,color .18s,transform .12s;
}
.dockbtn svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.dockbtn:hover{background:rgba(255,255,255,.06);color:var(--paper)}
.dockbtn:active{transform:scale(.95)}
.dockbtn.on{background:rgba(255,192,105,.14);color:var(--firefly)}
.docksep{width:1px;height:34px;background:var(--edge);margin:0 4px}
#d-more{display:flex}
#d-more .more-chev{display:block;font-size:9px;line-height:1;opacity:.7;margin-top:-2px}
#dock .dock-secondary{display:none}
#dock.more-open .dock-secondary{display:flex}
#dock.more-open #d-more{background:rgba(255,192,105,.14);color:var(--firefly)}
#dock.more-open{
  flex-wrap:wrap;justify-content:center;max-width:min(560px,calc(100vw - 24px));
}

/* ---------- inspector drawer ---------- */
#drawer{
  position:fixed;top:16px;right:16px;bottom:16px;width:348px;max-width:calc(100vw - 32px);
  display:flex;flex-direction:column;z-index:30;
  transform:translateX(calc(100% + 24px));transition:transform .38s cubic-bezier(.32,.9,.3,1);
}
#drawer.open{transform:translateX(0)}
#drawer .inner{flex:1;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r-lg)}
#drawer-scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:0 20px 20px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}
#drawer-scroll::-webkit-scrollbar{width:4px}
#drawer-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px}
.dhead{display:flex;align-items:flex-start;gap:12px;padding:20px 20px 12px}

/* ---------- log panel — a quiet, collapsible feed of what just happened.
   The toggle lives inline in the header chip row (so it can never sit on top
   of the wordmark); the panel itself drops in below the header, opposite
   side from the bear-inspector drawer so the two never collide ---------- */
#log-toggle{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 13px;border-radius:999px;font-size:12px;font-weight:500;
  background:var(--glass-soft);border:1px solid var(--edge);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  color:var(--dim);cursor:pointer;transition:border-color .2s,background .2s,color .2s;
}
#log-toggle:hover{border-color:var(--edge-strong);background:rgba(20,26,52,.7);color:var(--paper)}
#log-toggle .dot{width:6px;height:6px;border-radius:50%;background:var(--firefly);box-shadow:0 0 8px var(--firefly);opacity:0;transition:opacity .2s}
#log-toggle .dot.show{opacity:1;animation:pulse 2s ease-in-out infinite}
#logpanel{
  position:fixed;top:84px;left:16px;bottom:16px;width:300px;max-width:calc(100vw - 32px);
  display:flex;flex-direction:column;z-index:30;pointer-events:none;
  transform:translateX(calc(-100% - 24px));transition:transform .38s cubic-bezier(.32,.9,.3,1);
}
#logpanel.open{transform:translateX(0);pointer-events:auto}
#logpanel .inner{flex:1;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r-lg)}
#log-scroll,#chron-scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:4px 18px 18px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}
#log-scroll::-webkit-scrollbar,#chron-scroll::-webkit-scrollbar{width:4px}
#log-scroll::-webkit-scrollbar-thumb,#chron-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px}
.loghead{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 8px}
.loghead span{font-size:10.5px;color:var(--dimmer)}
.logtabs{display:flex;gap:4px}
.logtab{padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:500;color:var(--dim);transition:background .18s,color .18s}
.logtab:hover{color:var(--paper)}
.logtab.on{background:rgba(255,192,105,.14);color:var(--firefly)}
@media (max-width:640px){
  #logpanel{top:auto;left:8px;right:8px;bottom:78px;width:auto;height:50vh;transform:translateY(calc(100% + 20px))}
  #logpanel.open{transform:none}
  #logpanel .inner{margin-top:0}
}
.dhead .names{flex:1;min-width:0}
.dhead h2{font-family:var(--disp);font-size:24px;font-weight:600;line-height:1.1}
.dhead .id{font-family:var(--mono);font-size:10.5px;color:var(--dimmer);margin-top:3px;letter-spacing:.02em}
.dhead .mood{font-size:12px;color:var(--firefly);margin-top:6px;font-style:italic;font-family:var(--disp)}
.xbtn{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:var(--dim);background:rgba(255,255,255,.05);transition:background .15s}
.xbtn:hover{background:rgba(255,255,255,.12);color:var(--paper)}
.sect{margin-top:18px}
.sect>h3{font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--dimmer);margin-bottom:9px;display:flex;align-items:center;gap:8px}
.sect>h3::after{content:'';flex:1;height:1px;background:var(--edge)}
#soulprint-wrap{position:relative;border-radius:var(--r-md);overflow:hidden;background:rgba(0,0,0,.28);border:1px solid var(--edge)}
#soulprint{display:block;width:100%;height:118px}
#soulprint-cap{position:absolute;left:10px;bottom:7px;font-size:9.5px;color:var(--dimmer);letter-spacing:.08em}
#decision{font-family:var(--mono);font-size:11.5px;color:var(--dim);margin-top:9px;line-height:1.6}
#decision b{color:var(--teal);font-weight:500}
#recentacts{letter-spacing:.35em;color:var(--dimmer)}
.trait{display:grid;grid-template-columns:78px 1fr 34px;align-items:center;gap:10px;margin-bottom:8px;font-size:11.5px}
.trait .lbl{color:var(--dim)}
.trait .bar{height:5px;border-radius:3px;background:rgba(255,255,255,.07);overflow:hidden}
.trait .fill{height:100%;border-radius:3px;background:linear-gradient(90deg,var(--teal),var(--firefly));transition:width .9s cubic-bezier(.3,.8,.3,1)}
.trait .val{font-family:var(--mono);font-size:10.5px;color:var(--dimmer);text-align:right}
#statehash{font-family:var(--mono);font-size:10px;color:var(--dimmer);word-break:break-all;line-height:1.55;padding:9px 11px;border-radius:var(--r-sm);background:rgba(0,0,0,.25);border:1px solid var(--edge)}
#statehash span{color:var(--teal)}
.rel{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:12px}
.rel .rname{width:86px;color:var(--paper)}
.rel .rbar{flex:1;height:4px;border-radius:2px;background:rgba(255,255,255,.07);overflow:hidden}
.rel .rfill{height:100%;background:var(--firefly);border-radius:2px;transition:width .6s}
.rel .rtier{font-size:10px;color:var(--dimmer);width:76px;text-align:right}
.mem{display:flex;gap:9px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:12px;line-height:1.45}
.mem:last-child{border-bottom:none}
.mem .mtick{font-family:var(--mono);font-size:9.5px;color:var(--dimmer);white-space:nowrap;padding-top:2px}
.mem .mtxt{color:var(--dim)}
.mem .mtxt b{color:var(--paper);font-weight:500}
.empty{font-size:12px;color:var(--dimmer);font-style:italic;padding:4px 0}
.btnrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.abtn{
  flex:1;min-width:96px;display:flex;align-items:center;justify-content:center;gap:7px;
  padding:10px 12px;border-radius:var(--r-md);font-size:12px;font-weight:600;
  background:rgba(255,255,255,.07);border:1px solid var(--edge);color:var(--paper);
  transition:background .16s,border-color .16s,transform .1s;
}
.abtn:hover{background:rgba(255,255,255,.12);border-color:var(--edge-strong)}
.abtn:active{transform:scale(.97)}
.abtn.amber{background:rgba(255,192,105,.14);border-color:rgba(255,192,105,.3);color:var(--firefly)}
.abtn.amber:hover{background:rgba(255,192,105,.22)}
.abtn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
/* converse */
#converse{margin-top:12px;display:none}
#converse.open{display:block}
#convo-log{max-height:170px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:4px 0 10px;scrollbar-width:thin}
.msg{max-width:88%;padding:8px 12px;border-radius:14px;font-size:12.5px;line-height:1.5}
.msg.you{align-self:flex-end;background:rgba(127,224,207,.14);border:1px solid rgba(127,224,207,.22);border-bottom-right-radius:4px}
.msg.bear{align-self:flex-start;background:rgba(255,255,255,.06);border:1px solid var(--edge);border-bottom-left-radius:4px;color:var(--dim)}
.msg.bear b{color:var(--firefly);font-weight:500}
#convo-form{display:flex;gap:7px}
#convo-input{flex:1;padding:10px 13px;border-radius:var(--r-md);background:rgba(0,0,0,.3);border:1px solid var(--edge);color:var(--paper);font-size:12.5px;outline:none;transition:border-color .15s}
#convo-input:focus{border-color:rgba(127,224,207,.45)}
#bearlang{display:none;margin-top:9px;padding:10px 12px;border-radius:var(--r-sm);background:rgba(0,0,0,.3);border:1px solid var(--edge);font-family:var(--mono);font-size:10.5px;line-height:1.8;color:var(--dim)}
#bearlang.open{display:block}
#bearlang .kw{color:var(--teal)}
#bearlang .num{color:var(--firefly)}
.tinylink{font-size:10.5px;color:var(--dimmer);text-decoration:underline;text-underline-offset:3px;cursor:pointer;background:none;border:none;padding:0}
.tinylink:hover{color:var(--dim)}

/* ---------- modals ---------- */
.veil{position:fixed;inset:0;background:rgba(5,8,20,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:50;display:none;align-items:center;justify-content:center;padding:20px}
.veil.open{display:flex;animation:fadein .25s ease}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.modal{width:520px;max-width:100%;max-height:86vh;overflow-y:auto;padding:28px;animation:rise .35s cubic-bezier(.3,.9,.3,1);scrollbar-width:thin}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.modal h2{font-family:var(--disp);font-size:23px;font-weight:600;margin-bottom:6px}
.modal .lede{font-size:13px;color:var(--dim);line-height:1.65;margin-bottom:18px}
.modal .lede b{color:var(--paper);font-weight:500}
.modal .lede em{color:var(--firefly);font-style:normal}

/* prove */
.provehash{font-family:var(--mono);font-size:10.5px;word-break:break-all;line-height:1.6;padding:10px 12px;border-radius:var(--r-sm);background:rgba(0,0,0,.3);border:1px solid var(--edge);margin-bottom:8px;color:var(--dim)}
.provehash .plabel{display:block;font-family:var(--ui);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--dimmer);margin-bottom:5px}
.provehash.match{border-color:rgba(142,240,176,.4);color:var(--verify)}
#prove-progress{height:4px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden;margin:14px 0}
#prove-progress .pfill{height:100%;width:0%;background:var(--teal);border-radius:2px;transition:width .12s linear}
#prove-verdict{display:none;align-items:center;gap:10px;padding:13px 15px;border-radius:var(--r-md);font-size:14px;font-weight:600;margin-top:6px}
#prove-verdict.ok{display:flex;background:rgba(142,240,176,.1);border:1px solid rgba(142,240,176,.35);color:var(--verify)}
#prove-verdict.bad{display:flex;background:rgba(240,146,142,.1);border:1px solid rgba(240,146,142,.35);color:var(--danger)}
.anchor{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05);font-family:var(--mono);font-size:10px;color:var(--dimmer)}
.anchor:last-child{border-bottom:none}
.anchor .aname{font-family:var(--ui);font-size:11.5px;color:var(--paper);width:70px}
.anchor .ahash{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.anchor .averify{font-family:var(--ui);font-size:10.5px;color:var(--teal);cursor:pointer;white-space:nowrap}
.anchor .averify:hover{text-decoration:underline}
.anchor.ok .averify{color:var(--verify);cursor:default;text-decoration:none}

/* herd */
#herd-canvas{display:block;width:100%;height:220px;border-radius:var(--r-md);background:rgba(0,0,0,.25);border:1px solid var(--edge);margin-bottom:14px}
.sliderrow{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--dim)}
.sliderrow input[type=range]{flex:1;accent-color:var(--firefly);height:4px}
.sliderrow .kval{font-family:var(--mono);font-size:11px;color:var(--firefly);width:44px;text-align:right}

/* birth */
#birth-form{display:flex;gap:8px;margin-top:6px}
#birth-input{flex:1;padding:12px 15px;border-radius:var(--r-md);background:rgba(0,0,0,.3);border:1px solid var(--edge);color:var(--paper);font-size:14px;outline:none;font-family:var(--disp)}
#birth-input:focus{border-color:rgba(255,192,105,.5)}
#birth-preview{margin-top:14px;font-family:var(--mono);font-size:10.5px;color:var(--dimmer);line-height:1.8;min-height:34px}
#birth-preview .g{color:var(--teal)}
.bigbtn{padding:12px 20px;border-radius:var(--r-md);font-size:13px;font-weight:600;background:linear-gradient(135deg,rgba(255,192,105,.25),rgba(255,192,105,.12));border:1px solid rgba(255,192,105,.4);color:var(--firefly);transition:filter .15s,transform .1s}
.bigbtn:hover{filter:brightness(1.15)}
.bigbtn:active{transform:scale(.97)}
.bigbtn:disabled{opacity:.4;cursor:default}

/* onboarding */
#onboard .kanji-hero{font-family:var(--disp);font-size:52px;font-weight:700;line-height:1;margin-bottom:4px}
#onboard .kanji-hero em{font-style:normal;color:var(--firefly)}
#onboard .romaji{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--dim);margin-bottom:20px}
#onboard .creed{font-family:var(--disp);font-size:16px;line-height:1.8;color:var(--paper);margin-bottom:16px}
#onboard .creed em{font-style:normal;color:var(--teal)}
.law{display:flex;gap:12px;padding:10px 0;border-top:1px solid rgba(255,255,255,.06);font-size:12.5px;line-height:1.6;color:var(--dim)}
.law .ln{font-family:var(--mono);font-size:10px;color:var(--firefly);padding-top:3px;white-space:nowrap}
.law b{color:var(--paper);font-weight:500}

/* toast + play result */
#toasts{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;z-index:60;pointer-events:none}
.toast{padding:10px 18px;border-radius:999px;font-size:12.5px;color:var(--paper);background:var(--glass);border:1px solid var(--edge);backdrop-filter:blur(14px);animation:toastin .3s ease, toastout .4s ease 3.4s forwards;box-shadow:0 8px 30px rgba(0,0,0,.4);pointer-events:auto}
.toast b{color:var(--firefly);font-weight:600}
@keyframes toastin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes toastout{to{opacity:0;transform:translateY(-8px)}}
.playrow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border-radius:var(--r-md);background:rgba(0,0,0,.25);border:1px solid var(--edge);margin-top:10px}
.playrow .pmove{text-align:center;font-size:13px}
.playrow .pmove .glyph{font-size:30px;display:block;margin-bottom:4px}
.playrow .vs{font-family:var(--disp);color:var(--dimmer);font-size:13px}
.pnote{font-size:11px;color:var(--dimmer);line-height:1.6;margin-top:10px}
.pnote code{font-family:var(--mono);font-size:10px;color:var(--teal)}
select.sel{padding:9px 12px;border-radius:var(--r-sm);background:rgba(0,0,0,.35);border:1px solid var(--edge);color:var(--paper);font-size:12.5px;outline:none}

.titles{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.titles span{font-size:9.5px;letter-spacing:.06em;padding:3px 8px;border-radius:999px;background:rgba(127,224,207,.1);border:1px solid rgba(127,224,207,.25);color:var(--teal)}
#attest{margin-top:10px;font-size:11px;color:var(--dimmer);line-height:1.55}
#attest .ok{color:var(--verify)}
#attest button{margin-left:4px}
#proof-ladder{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.pl-row{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:var(--r-sm);background:rgba(0,0,0,.22);border:1px solid var(--edge)}
.pl-n{font-family:var(--mono);font-size:10px;color:var(--firefly);min-width:14px;padding-top:1px}
.pl-body{flex:1;min-width:0}
.pl-title{font-size:12px;font-weight:500;color:var(--paper);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pl-detail{font-size:10.5px;color:var(--dimmer);margin-top:3px;line-height:1.5}
.pl-badge{font-size:9.5px;letter-spacing:.04em;padding:2px 7px;border-radius:999px;border:1px solid var(--edge);color:var(--dim)}
.pl-badge.ok{border-color:rgba(142,240,176,.35);color:var(--verify);background:rgba(142,240,176,.08)}
.pl-badge.wait{border-color:rgba(255,192,105,.3);color:var(--firefly);background:rgba(255,192,105,.08)}
.pl-badge.off{opacity:.7}
#share-preview{
  width:100%;max-height:42vh;object-fit:contain;border-radius:var(--r-md);
  background:rgba(0,0,0,.35);border:1px solid var(--edge);display:block;margin:4px 0 10px;
}
#share-card{
  font-family:var(--mono);font-size:11px;line-height:1.55;color:var(--dim);
  white-space:pre-wrap;padding:12px 14px;border-radius:var(--r-md);
  background:rgba(0,0,0,.28);border:1px solid var(--edge);margin:0 0 12px;
}
#share-card b{color:var(--firefly);font-weight:500}
#guide-coach{
  position:fixed;left:50%;bottom:160px;transform:translateX(-50%);
  width:min(420px,calc(100vw - 28px));z-index:55;display:none;
  padding:14px 16px;border-radius:var(--r-lg);gap:10px;flex-direction:column;
  background:var(--glass);border:1px solid var(--edge-strong);backdrop-filter:blur(18px);
  box-shadow:0 16px 50px rgba(0,0,0,.45);
}
#guide-coach.open{display:flex}
#guide-coach .g-kicker{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--firefly)}
#guide-coach .g-title{font-family:var(--disp);font-size:18px;font-weight:600;color:var(--paper)}
#guide-coach .g-body{font-size:12.5px;line-height:1.55;color:var(--dim)}
#guide-coach .g-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:2px}
#guide-coach .g-step{font-family:var(--mono);font-size:10px;color:var(--dimmer)}
.dockbtn.guide-pulse{animation:guidePulse 1.4s ease-in-out infinite;color:var(--firefly);background:rgba(255,192,105,.12)}
@keyframes guidePulse{0%,100%{box-shadow:0 0 0 0 rgba(255,192,105,.35)}50%{box-shadow:0 0 0 6px rgba(255,192,105,0)}}
@media (max-width:640px){
  #guide-coach{bottom:auto;top:72px}
  #dock{
    left:8px;right:8px;bottom:10px;width:auto;transform:none;
    flex-wrap:wrap;justify-content:center;gap:3px;padding:7px;
    row-gap:4px;
  }
  .dockbtn{min-width:64px;padding:8px 8px 7px;font-size:9.5px}
  #drawer{height:52vh}
  #chip-day #season-label{display:none}
  #chip-search b{display:none}
}
.chron{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:12.5px;line-height:1.5}
.chron:last-child{border-bottom:none}
.chron .ch{font-family:var(--mono);font-size:9.5px;color:var(--dimmer);white-space:nowrap;padding-top:2px}
.chron .ct{color:var(--dim)}
.chron .ct b{color:var(--paper);font-weight:500}
.wrow{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:13px}
.wrow:last-child{border-bottom:none}
.wrow .wname{flex:1;color:var(--paper)}
.wrow .wname small{display:block;font-size:10px;color:var(--dimmer);font-family:var(--mono)}
.wrow .cur{font-size:10px;color:var(--firefly);letter-spacing:.1em}
.wrow button{font-size:11px;color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.erow{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:12.5px}
.erow:last-child{border-bottom:none}
.erow .en{flex:1;color:var(--paper)}
.erow .en small{color:var(--dimmer);font-family:var(--mono);font-size:9.5px;margin-left:6px}
.erow .here{font-size:10px;color:var(--dimmer)}
.erow button{font-size:11px;color:var(--firefly);text-decoration:underline;text-underline-offset:3px}
#minimap{position:fixed;left:16px;bottom:16px;width:160px;height:92px;border-radius:12px;overflow:hidden;border:1px solid var(--edge);background:rgba(10,14,28,.55);backdrop-filter:blur(10px);z-index:19;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.35)}
#minimap canvas{width:100%;height:100%;display:block}

/* ---------- bear search — find a soul by name, then jump the camera to it ---------- */
#search-wrap{position:relative}
#search-panel{
  position:absolute;top:calc(100% + 8px);right:0;width:280px;max-width:calc(100vw - 32px);
  z-index:35;padding:10px;display:none;flex-direction:column;gap:8px;
}
#search-panel.open{display:flex}
#search-input{
  width:100%;padding:9px 12px;border-radius:var(--r-md);background:rgba(0,0,0,.3);
  border:1px solid var(--edge);color:var(--paper);font-size:13px;outline:none;font-family:var(--ui);
}
#search-input:focus{border-color:rgba(255,192,105,.5)}
#search-results{
  max-height:38vh;overflow-y:auto;display:flex;flex-direction:column;gap:2px;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent;
}
#search-results::-webkit-scrollbar{width:4px}
#search-results::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px}
#search-results .empty{padding:8px 4px;font-size:11.5px;color:var(--dimmer)}
.sres{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:var(--r-sm);cursor:pointer;transition:background .15s}
.sres:hover{background:rgba(255,255,255,.07)}
.sres .sname{font-weight:600;color:var(--paper);font-size:13px}
.sres .sbadge{font-size:10px;color:var(--dimmer);white-space:nowrap}
.sres .sbadge.onchain{color:var(--teal)}
.sres .sbadge.remote{color:var(--firefly)}
@media (max-width:640px){
  #minimap{display:none}
  #drawer{top:auto;right:8px;left:8px;bottom:78px;width:auto;height:52vh;transform:translateY(calc(100% + 20px))}
  #drawer.open{transform:none}
  #wordmark .sub{display:none}
  .dockbtn{min-width:58px;font-size:9.5px}
  #hud-top{flex-wrap:wrap;gap:6px}
  #search-panel{right:auto;left:0}
  #logpanel{bottom:78px}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* ---------- advanced life-sim chrome ---------- */
#season-camp{max-width:min(420px,42vw);overflow:hidden;text-overflow:ellipsis;font-size:11px;color:var(--dim)}
#season-camp b{color:var(--firefly);font-weight:600}
#season-camp .mono{color:var(--teal)}
#dispute-chip{display:none;max-width:min(360px,40vw);font-size:11px;border-color:rgba(255,192,105,.35)}
#dispute-chip.show{display:inline-flex}
#away-summary{
  position:fixed;left:50%;top:18%;transform:translateX(-50%);
  width:min(420px,92vw);padding:22px 24px;z-index:50;display:none;flex-direction:column;gap:10px;
}
#away-summary.open{display:flex}
#away-summary .away-kicker{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--teal)}
#away-summary .away-title{font-family:var(--disp);font-size:22px;color:var(--firefly)}
#away-summary .away-beat{font-size:13px;color:var(--dim);line-height:1.45}
#away-summary .away-beat .mono{color:var(--teal);font-size:11px;margin-right:6px}
#away-summary .away-actions{display:flex;gap:12px;align-items:center;justify-content:flex-end;margin-top:4px;flex-wrap:wrap}
#pulse-fanfare.relation-pop{border-color:rgba(127,224,207,.35)}
#pulse-fanfare.relation-pop .pf-title{color:var(--teal)}
#witness-bar{
  position:fixed;left:50%;top:64px;transform:translateX(-50%);
  z-index:32;display:none;align-items:center;gap:12px;flex-wrap:wrap;
  padding:8px 12px;max-width:min(520px,94vw);
  border-color:rgba(127,224,207,.35);
}
#witness-bar.show{display:flex}
#witness-bar .wb-k{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
#witness-bar .wb-t{font-size:12.5px;color:var(--dim);flex:1;min-width:10em}
#witness-bar .abtn{padding:6px 12px;font-size:12px}
#witness-bar.flash{animation:witnessFlash .7s ease}
@keyframes witnessFlash{0%,100%{box-shadow:none}40%{box-shadow:0 0 0 3px rgba(127,224,207,.45)}}
body.witness-mode #d-gift,
body.witness-mode #d-lantern,
body.witness-mode #d-fire,
body.witness-mode #d-birth{opacity:.4}
body.watching #witness-bar{opacity:0;pointer-events:none}
#forests-list{max-height:min(52vh,420px);overflow:auto;margin-top:4px}
.forests-sort{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 4px}
.forests-sort .fsort{
  padding:6px 10px;border-radius:8px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--dim);border:1px solid var(--edge);background:transparent;
}
.forests-sort .fsort.on,.forests-sort .fsort:hover{color:var(--firefly);border-color:rgba(255,192,105,.35);background:rgba(255,192,105,.08)}
#forests-list .badge-crown{font-size:10px;color:var(--firefly);margin-left:6px}
#forests-list .forest-open{
  font-size:11px;color:var(--firefly);background:rgba(255,192,105,.1);
  border:1px solid rgba(255,192,105,.3);border-radius:6px;padding:4px 10px;cursor:pointer;
}
#forests-list .forest-open:hover{background:rgba(255,192,105,.18)}
#forests-list .forest-open:disabled{opacity:.5;cursor:wait}

/* ---------- Forest Pulse — one tiny action chip, no rank billboard ---------- */
#pulse-bar{
  position:fixed;right:16px;bottom:88px;left:auto;transform:none;
  width:auto;max-width:min(240px,46vw);z-index:21;padding:0;display:none;
  border:none;background:transparent;box-shadow:none;backdrop-filter:none;
}
#pulse-bar.show{display:block}
.pulse-chip{
  display:inline-flex;align-items:center;gap:6px;max-width:100%;
  margin:0;padding:6px 10px;border-radius:999px;cursor:pointer;
  font:inherit;text-align:left;
  background:rgba(8,12,28,.78);border:1px solid rgba(255,192,105,.35);
  color:var(--paper);backdrop-filter:blur(10px);
}
.pulse-chip:hover{background:rgba(12,18,36,.9);border-color:rgba(255,192,105,.55)}
.pulse-chip.quiet{cursor:default;border-color:rgba(127,224,207,.28)}
.pulse-chip-k{
  flex-shrink:0;font-size:9px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--firefly);font-weight:600;
}
.pulse-chip-t{
  font-size:11.5px;font-weight:500;color:var(--paper);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;
}
#pulse-bar.seed-arrival .pulse-chip.seed-hot,
.pulse-chip.seed-hot{animation:seedPulse 1.6s ease-in-out 3;border-color:rgba(255,192,105,.6)}
@keyframes seedPulse{
  0%,100%{box-shadow:0 0 0 rgba(255,192,105,0)}
  50%{box-shadow:0 0 14px rgba(255,192,105,.25)}
}
#pulse-fanfare{
  position:fixed;left:50%;top:22%;transform:translateX(-50%);
  width:min(400px,92vw);padding:22px 24px;z-index:55;display:none;flex-direction:column;gap:12px;text-align:center;
}
#pulse-fanfare.open{display:flex}
#pulse-fanfare .pf-title{font-family:var(--disp);font-size:24px;color:var(--firefly)}
#pulse-fanfare .pf-body{font-size:13.5px;color:var(--dim);line-height:1.45}
.season-bar{display:inline-block;width:48px;height:4px;margin-left:6px;border-radius:2px;background:rgba(255,255,255,.12);vertical-align:middle;overflow:hidden}
.season-bar i{display:block;height:100%;background:var(--teal);border-radius:2px}
@media (max-width:900px){
  #season-camp{max-width:100%;order:5}
  #dispute-chip{max-width:100%}
  #hud-top{padding-bottom:8px}
  #pulse-bar{right:10px;bottom:78px;max-width:min(200px,55vw)}
  .pulse-chip{padding:5px 8px}
  .pulse-chip-t{font-size:11px}
}
@media (orientation:landscape) and (max-height:480px){
  #drawer{height:70vh;bottom:64px}
  #guide-coach{bottom:70px;font-size:12px}
}
body.watching #pulse-bar,body.watching #pulse-fanfare{opacity:0;pointer-events:none}

/* ---------- Shared-forest arrival funnel ---------- */
#pulse-fanfare.shared-welcome{top:16%;border-color:rgba(255,192,105,.35)}
#pulse-fanfare .pf-kicker{
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--teal);font-weight:600;
}
#pulse-fanfare .pf-invite{
  font-size:13.5px;color:var(--paper);line-height:1.4;
  padding:10px 12px;border-radius:var(--r-md);
  background:rgba(255,192,105,.1);border:1px solid rgba(255,192,105,.25);
}