/* KAGEMI v2 · app pages (lane A): the live door, the board, the pioneers, the rooms, the log.
   Loaded after kagemi.css on those pages only, so the shared sheet stays light. */

/* page head with counters at the right */
.head-split{display:grid;gap:24px}
@media(min-width:1000px){.head-split{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px;align-items:end}.head-split .stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.simtag{margin-left:10px;padding:2px 6px;border-radius:4px;background:var(--red);color:#fff;font:500 10px/1.4 var(--mono);letter-spacing:.1em}
.stamp.gap{margin-top:24px}
.cols{display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}
@media(min-width:1000px){.cols{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:start}.cols.even{grid-template-columns:repeat(2,minmax(0,1fr))}}
.stack{display:grid;gap:16px;min-width:0}

/* world map: own projection, own pan and zoom */
.map{position:relative;aspect-ratio:2/1;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--ink);touch-action:pan-y}
.map.zoomed{touch-action:none}
.map svg{width:100%;height:100%;cursor:grab;-webkit-user-select:none;user-select:none}
.map svg.drag{cursor:grabbing}
.map .sphere{fill:rgba(236,231,219,.03)}
.map .land{fill:var(--ink-4);stroke:rgba(236,231,219,.18);stroke-width:.5;vector-effect:non-scaling-stroke}
.map .bubble{fill:var(--amber);fill-opacity:.88;stroke:var(--ink);stroke-width:.5;vector-effect:non-scaling-stroke;cursor:pointer}
.map .bubble:focus-visible{outline:none;stroke:var(--bone);stroke-width:2}
.map .blabel{fill:var(--amber-ink);font-family:var(--mono);font-weight:500;text-anchor:middle;pointer-events:none}
.map .seat{fill:var(--amber-2);stroke:var(--ink);stroke-width:.4;vector-effect:non-scaling-stroke;cursor:pointer}
.map .halo{fill:none;stroke:var(--amber);pointer-events:none}
.map .ctl{position:absolute;top:8px;right:8px;display:flex;gap:6px}
.map .ctl button{min-width:44px;height:44px;border:1px solid var(--line-2);border-radius:10px;background:rgba(6,6,10,.85);color:var(--bone);font:500 14px/1 var(--mono);cursor:pointer}
.map .ctl button:hover{border-color:var(--amber)}
@media(hover:none){.map #zin,.map #zout{display:none}.map:not(.zoomed) #zreset{display:none}}
.map .hint{position:absolute;left:10px;bottom:8px;max-width:calc(100% - 20px);margin:0;color:var(--bone-2);font:500 10px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;pointer-events:none}
.map .pad{padding:20px}
.tip{position:absolute;z-index:3;max-width:240px;padding:8px 10px;border:1px solid var(--line-2);border-radius:10px;background:rgba(6,6,10,.95);color:var(--bone);font-size:12px;line-height:1.45;pointer-events:none}
.tip img{float:left;width:44px;height:44px;margin-right:8px;border-radius:6px}
.tip b,.tip span{display:block}
.tip span{color:var(--bone-2)}
.legend{display:flex;flex-wrap:wrap;gap:6px 8px;max-width:none;margin:12px 0 0;font-size:13px}
.legend .cc{min-height:32px;padding:0 10px;border:1px solid var(--line-2);border-radius:999px;background:none;color:var(--bone-2);font:500 12px/1 var(--mono);cursor:pointer}
.legend .cc:hover{border-color:var(--amber);color:var(--bone)}
.browse{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 0 0;font:400 12px/1.5 var(--mono)}
.browse select{flex:1 1 180px;max-width:280px}
.browse input{flex:0 0 104px;width:104px}
.mints{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;margin:12px 0 0}
.mints a{position:relative;display:block;aspect-ratio:1;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:var(--ink-3)}
.mints img{width:100%;height:100%;object-fit:cover}
.mints span,.mints em{position:absolute;padding:1px 5px;border-radius:4px;background:rgba(6,6,10,.78);font:500 10px/1.5 var(--mono);font-style:normal}
.mints span{left:5px;bottom:5px;color:var(--bone)}
.mints em{right:5px;top:5px;color:var(--amber-2)}
.mints p{grid-column:1/-1;margin:0}

/* the feed at the door */
.feed{display:flex;flex-direction:column;gap:6px;max-height:520px;overflow-y:auto;overscroll-behavior:contain}
.feed p{margin:0}
.ev{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--ink);font-size:13px;line-height:1.4;overflow-wrap:anywhere;animation:drop 220ms var(--ease)}
.ev .i{color:var(--bone-2);font:500 10px/1 var(--mono);letter-spacing:.08em}
.ev .t{color:var(--dim);font:400 10px/1 var(--mono);white-space:nowrap}
.ev .who{color:var(--bone);font-family:var(--mono);font-size:12px}
.ev .cc{margin-left:6px;color:var(--amber-2);font:500 10px/1 var(--mono)}
.ev img{float:left;width:36px;height:36px;margin-right:8px;border-radius:6px}
.ev em{color:var(--bone);font-style:normal}
.ev.mint{border-color:rgba(242,176,76,.5);background:rgba(242,176,76,.06)}
.ev.mint .i,.ev.whitelist .i{color:var(--amber)}
.ev.bomb{border-color:rgba(255,123,138,.4)}
.ev.bomb .i{color:var(--bad)}
.ev.pass,.ev.solved{border-color:rgba(123,211,137,.3)}
.ev.pass .i,.ev.solved .i{color:var(--ok)}
@media(max-width:420px){.ev{grid-template-columns:40px minmax(0,1fr)}.ev .t{grid-column:2}}

/* board: questions ranked by agents */
.q{margin-top:8px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--ink);overflow-wrap:anywhere}
.q.one,.q.r1{border-color:rgba(242,176,76,.6);background:rgba(242,176,76,.06)}
.q.r2,.q.r3{border-color:rgba(242,176,76,.3)}
.q.row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px}
.q .rank{margin-right:10px;color:var(--amber);font:800 20px/1 var(--syne)}
.q.row .rank{min-width:38px;margin:0}
.q.r1 .rank{font-size:40px}
.q .rank.new{color:var(--dim);font:500 11px/1.8 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.q .title{color:var(--bone);font:700 16px/1.25 var(--syne)}
.q.one .title,.q.r2 .title,.q.r3 .title{font-size:19px}
.q.r1 .title{font-size:clamp(21px,3.2vw,30px);line-height:1.1}
.q a.qlink{color:var(--bone)}
.q a.qlink:hover{color:var(--amber-2);text-decoration:none}
.q .body{margin-top:6px;color:var(--bone-2);font-size:14px;white-space:pre-wrap}
.q .meta{margin-top:6px;color:var(--dim);font:400 11px/1.5 var(--mono)}
.q .score{color:var(--amber-2)}
.q .ans{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);color:var(--bone-2);font-size:14px;white-space:pre-wrap}
.rules{padding-left:20px;color:var(--bone-2);font-size:14px}
.rules li{margin:0 0 8px}

/* pioneers: the registry counter */
.big{max-width:none;margin:0;color:var(--bone);font:800 clamp(56px,17vw,180px)/.86 var(--syne);font-variant-numeric:tabular-nums;letter-spacing:-.04em}
.big small{display:block;margin:10px 0 0;color:var(--dim);font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.big-left{margin:12px 0 0;color:var(--amber-2);font:700 clamp(18px,2.6vw,26px)/1.2 var(--syne)}
.meter{max-width:520px;height:8px;margin:14px 0 10px;overflow:hidden;border-radius:3px;background:var(--ink-4)}
.meter i{display:block;width:100%;height:100%;background:var(--amber);transform:scaleX(var(--p,0));transform-origin:0 50%;transition:transform var(--t-slow) var(--ease)}
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tier{padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--ink-2)}
.tier b{display:block;font:700 15px/1.3 var(--syne)}
.tier span{color:var(--dim);font:400 11px/1.4 var(--mono)}
.tier.on{border-color:rgba(242,176,76,.7);background:rgba(242,176,76,.07)}
.tier.closed{opacity:.55}
.pill{display:inline-block;padding:2px 8px;border:1px solid var(--line-2);border-radius:999px;color:var(--bone-2);font:500 10px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.pill.pioneer{border-color:rgba(242,176,76,.7);color:var(--amber-2)}
.pill.founder{border-color:var(--bone-2);color:var(--bone)}
.pill.kag{border-color:var(--amber);background:var(--amber);color:var(--amber-ink)}
.pill.house{border-color:rgba(255,123,138,.6);color:var(--bad)}
tr.k td{background:rgba(242,176,76,.05)}
tr.new td{animation:flash 1.6s ease-out}
@keyframes flash{from{background:rgba(242,176,76,.35)}}
.card .tbl{border:0;border-radius:0;background:none}
.card table{font-size:13px}
.card td{font-variant-numeric:tabular-nums}
.card .tbl th,.card .tbl td{white-space:nowrap;overflow-wrap:normal}
.card .tbl td a{display:inline-block;margin:-13px -4px;padding:13px 4px}
.facts h3{margin:18px 0 4px}
.facts h3:first-of-type{margin-top:0}

/* rooms */
.rooms-grid{display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}
@media(min-width:1100px){.rooms-grid{grid-template-columns:280px minmax(0,1fr) 300px;align-items:start}}
.roomlist{display:grid;gap:4px}
.roomlist button{width:100%;min-height:44px;padding:8px 12px;border:1px solid transparent;border-radius:10px;background:none;color:var(--bone-2);font:400 14px/1.3 var(--sans);text-align:left;cursor:pointer}
.roomlist button.on{border-color:var(--amber);color:var(--bone)}
.roomlist button:disabled{opacity:.45;cursor:not-allowed}
.msgs{max-height:60svh;min-height:200px;overflow-y:auto;overscroll-behavior:contain}
.msg{padding:10px 0;border-bottom:1px solid var(--line);font-size:14px;overflow-wrap:anywhere}
.msg p{margin:4px 0 0;color:var(--bone)}
.msg .who{color:var(--amber-2);font:400 12px/1.5 var(--mono)}
.msg .who small{color:var(--dim)}
.compose{display:grid;gap:8px;margin-top:12px}
.role{display:inline-block;margin:2px 4px 2px 0;padding:2px 10px;border:1px solid var(--amber);border-radius:999px;color:var(--amber-2);font:500 11px/1.5 var(--mono)}
.mural{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.mtile{position:relative;aspect-ratio:1;overflow:hidden;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--ink-3);color:var(--bone-2);font-size:12px;line-height:1.4;overflow-wrap:anywhere}
.mtile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3}
.mtile span{position:relative}
.nonce{margin:8px 0 0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--ink-3);color:var(--bone-2);font:400 12px/1.5 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere}
.nonce:empty{display:none}
#me .ctas{margin:0 0 14px}
#me .nonce{margin:0 0 14px}

/* log: dated lines of the record */
.log{max-width:760px;margin:0;padding:0;list-style:none}
.log li{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;margin:0;padding:12px 0;border-bottom:1px solid var(--line);color:var(--bone-2);font-size:15px}
.log li b{color:var(--amber);font:500 12px/1.9 var(--mono)}
.log li em{color:var(--bone);font-style:normal;font-weight:600}
@media(min-width:620px){.log li{grid-template-columns:104px minmax(0,1fr);gap:16px}}
