/* MEKANEKO additions: header links, boot CA, VOLT intro, museum agent profiles. Script: mekaneko-ui.js */
:root{--mk:#14c9ff;--mk-ink:#03141b;--mk-card:#08080aa8;--mk-hair:#f4f2ee24;--mk-paper:#f4f2ee;--mk-mute:#f4f2ee9e}

/* ---- header: BUY NOW · DASHBOARD · Telegram · X · CA (placeholders until mekaneko-config.js has links) */
.mk-links{display:contents}
.ui-btn.mk-btn--buy{gap:.36em;background:var(--mk);border-color:var(--mk);color:var(--mk-ink);font-family:var(--label);font-weight:800;letter-spacing:.06em}
@media (hover:hover){.ui-btn.mk-btn--buy:hover{background:var(--paper);border-color:var(--paper);color:#0b0b0b}}
.ui-btn.mk-btn--dash{font-family:var(--label);letter-spacing:.06em;font-size:11px;font-weight:700;gap:7px}
.ui-btn.mk-btn--dash svg{width:13px;height:13px;display:block;fill:none;stroke:currentColor;stroke-width:1.5}
.ui-btn.mk-btn--icon{width:var(--btn-h);padding:0}
.ui-btn.mk-btn--icon svg{width:14px;height:14px;display:block;fill:currentColor}
.ui-btn.mk-btn--ca{font-family:var(--label);letter-spacing:.04em;font-size:11px;gap:6px}
.ui-btn.mk-btn--ca svg{width:12px;height:12px;display:block;fill:none;stroke:currentColor;stroke-width:1.6}
@media (max-width:899px){.ui-btn.mk-btn--dash .mk-dash-label{display:none}.ui-btn.mk-btn--dash{width:var(--btn-h);padding:0}}
@media (max-width:719px){.ui-btn.mk-btn--ca .mk-ca-label{display:none}.ui-btn.mk-btn--ca{width:var(--btn-h);padding:0}}
@media (max-width:519px){.ui-actions{gap:5px}.ui-btn.mk-btn--buy{padding:0 9px;letter-spacing:.02em}.ui-btn.mk-btn--buy .mk-buy-long{display:none}.ui-btn.mk-btn--icon,.ui-btn.mk-btn--ca,.ui-btn.mk-btn--dash{width:28px}}
@media (max-width:419px){.ui-actions{gap:4px}.ui-btn.mk-btn--buy{padding:0 7px}.ui-btn.mk-btn--icon,.ui-btn.mk-btn--ca,.ui-btn.mk-btn--dash{width:26px}.ui-btn.ui-btn--lang{padding:0 6px}}
@media (max-width:379px){.ui-btn.mk-btn--tg,.ui-btn.mk-btn--x{display:none}}

/* ---- toast */
.mk-toast{position:fixed;left:50%;bottom:max(28px,env(safe-area-inset-bottom));z-index:60;transform:translate(-50%,12px);opacity:0;pointer-events:none;background:#08080ad9;color:var(--mk-paper);border:1px solid var(--mk-hair);border-radius:2px;padding:10px 16px;font:600 13px/1.3 var(--label);letter-spacing:.04em;transition:opacity .25s,transform .35s var(--ease-snap);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.mk-toast.is-on{opacity:1;transform:translate(-50%,0)}
.mk-toast b{color:var(--mk)}

/* ---- BOOT: the CA line under ENTER (terminal style, same phosphor) */
.bt .mk-ca{position:absolute;left:50%;top:calc(var(--stage-top) + 812 * var(--u));transform:translate(-50%);display:flex;align-items:center;gap:14px;max-width:calc(100vw - 32px);padding:8px 14px;border:1px dashed color-mix(in srgb,var(--ph) 55%,transparent);color:var(--ph);font-family:VT323,ui-monospace,monospace;font-size:max(15px,calc(30 * var(--u)));line-height:1;text-shadow:0 0 10px var(--glow2);opacity:0;transition:opacity .4s ease-out .15s;cursor:copy;pointer-events:auto;white-space:nowrap}
.bt[data-state=ready] .mk-ca{opacity:.9}
.bt .mk-ca:hover{opacity:1;border-style:solid}
.bt .mk-ca__k{opacity:.6}
.bt .mk-ca__v{overflow:hidden;text-overflow:ellipsis;min-width:0}
.bt .mk-ca__copy{border:1.5px solid;border-bottom-width:3px;border-radius:4px;padding:2px .4em 0;font-size:.8em}
.bt.is-portrait .mk-ca{top:calc(var(--stage-top) + 1230 * var(--u));font-size:max(14px,calc(34 * var(--u)))}

/* ---- BOOT wireframe scene: who is Meka-kun (hint-card look: ink, hairline, blur) */
.mk-intro{position:fixed;z-index:15;left:max(var(--m),env(safe-area-inset-left));top:50%;width:min(344px,calc(100vw - 2 * var(--m)));transform:translate(-14px,-50%);opacity:0;visibility:hidden;transition:opacity .6s var(--ease-snap),transform .8s var(--ease-snap),visibility 0s linear .6s;background:var(--mk-card);border:1px solid var(--mk-hair);border-radius:2px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:var(--mk-paper);padding:22px 24px 20px;font-family:var(--jp);pointer-events:auto}
.mk-intro.is-on{opacity:1;visibility:visible;transform:translate(0,-50%);transition:opacity .6s var(--ease-snap),transform .8s var(--ease-snap),visibility 0s}
.mk-intro__eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 14px;font:600 11px/1 var(--label);letter-spacing:.16em;color:var(--mk-mute)}
.mk-intro__eyebrow:after{content:"";flex:1;height:1px;background:var(--mk-hair)}
.mk-intro h2{margin:0;font:800 26px/1 var(--display);letter-spacing:.01em}
.mk-intro h2 span{color:var(--mk)}
.mk-intro p{margin:10px 0 0;font-size:13.5px;line-height:1.62;color:#f4f2eed9;letter-spacing:.02em}
.mk-intro:lang(en) p{letter-spacing:0}
.mk-intro hr{border:0;height:1px;background:var(--mk-hair);margin:18px 0 16px}
.mk-intro__tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.mk-intro__tags i{font:600 10.5px/1 var(--label);letter-spacing:.1em;font-style:normal;padding:6px 8px;border:1px solid var(--mk-hair);border-radius:2px;color:var(--mk-mute)}
.mk-intro__close{position:absolute;top:10px;right:10px;width:28px;height:28px;display:grid;place-items:center;color:var(--mk-mute);font:400 15px/1 var(--label)}
.mk-intro__close:hover{color:var(--mk-paper)}
.mk-intro.is-right{left:auto;right:max(var(--m),env(safe-area-inset-right))}
.mk-intro.is-on.is-yield{opacity:0;pointer-events:none;transition:opacity .22s linear}
:root[data-tier=low] .mk-intro{-webkit-backdrop-filter:none;backdrop-filter:none;background:#08080ad1}
/* small screens: a chip at the bottom left that opens the full card */
.mk-intro__chip{display:none}
@media (max-width:899px),(max-height:560px){
 .mk-intro{top:auto;bottom:max(16px,env(safe-area-inset-bottom));transform:translate(0,14px);padding:16px 18px 14px;max-height:min(62vh,520px);overflow:auto;z-index:21}
 .mk-intro.is-on{transform:none}
 .mk-intro h2{font-size:20px}.mk-intro p{font-size:12.5px;line-height:1.55}.mk-intro hr{margin:12px 0 10px}.mk-intro__tags{display:none}
 .mk-intro:not(.is-open){width:auto;padding:0;overflow:visible;background:none;border:0;-webkit-backdrop-filter:none;backdrop-filter:none}
 .mk-intro:not(.is-open)>:not(.mk-intro__chip){display:none}
 .mk-intro:not(.is-open) .mk-intro__chip{display:flex}
 .mk-intro__chip{align-items:center;gap:8px;height:34px;padding:0 14px;background:var(--mk-card);border:1px solid #14c9ff73;border-radius:2px;color:var(--mk-paper);font:700 11px/1 var(--label);letter-spacing:.12em;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
 .mk-intro__chip i{width:6px;height:6px;border-radius:50%;background:var(--mk);box-shadow:0 0 8px var(--mk)}
}

/* ---- MUSEUM: "Click to get to know me" (re-uses the site's .lb hint card) */
.mk-lb{position:fixed;inset:0;z-index:19;pointer-events:none}
.mk-lb .lb-hcard,.mk-lb .lb-hdot{opacity:1}
.mk-lb .lb-hcard{border-color:#14c9ff73}
.mk-lb .lb-hcard .lb-htext b{color:var(--mk);font-weight:700}
html.mk-plaque-hover #gl{cursor:pointer!important}

/* ---- MUSEUM: agent profile */
.mk-prof{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:max(18px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom));visibility:hidden;opacity:0;transition:opacity .45s var(--ease-snap),visibility 0s linear .45s;font-family:var(--jp);color:var(--mk-paper)}
.mk-prof.is-on{visibility:visible;opacity:1;transition:opacity .45s var(--ease-snap),visibility 0s}
.mk-prof__veil{position:absolute;inset:0;background:#050506a6;-webkit-backdrop-filter:blur(18px) saturate(.9);backdrop-filter:blur(18px) saturate(.9)}
.mk-prof__panel{--ac:var(--mk);position:relative;width:min(1180px,100%);height:min(760px,100%);display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);background:#0a0a0cd1;border:1px solid var(--mk-hair);border-radius:2px;overflow:hidden;transform:translateY(18px) scale(.985);transition:transform .7s var(--ease-snap);box-shadow:0 40px 120px #0009}
.mk-prof.is-on .mk-prof__panel{transform:none}
.mk-prof__panel:focus{outline:none}
.mk-prof__panel:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 70% at 78% 42%,color-mix(in srgb,var(--ac) 22%,transparent),transparent 70%)}
.mk-prof__corner{position:absolute;width:14px;height:14px;border:1px solid var(--ac);pointer-events:none}
.mk-prof__corner.tl{left:10px;top:10px;border-right:0;border-bottom:0}.mk-prof__corner.tr{right:10px;top:10px;border-left:0;border-bottom:0}.mk-prof__corner.bl{left:10px;bottom:10px;border-right:0;border-top:0}.mk-prof__corner.br{right:10px;bottom:10px;border-left:0;border-top:0}
.mk-prof__close{position:absolute;z-index:3;top:18px;right:18px;height:32px;padding:0 12px;display:flex;align-items:center;gap:8px;border:1px solid var(--mk-hair);background:#08080a8c;color:var(--mk-paper);font:600 11px/1 var(--label);letter-spacing:.12em;border-radius:2px}
.mk-prof__close:hover{border-color:var(--mk-paper)}
.mk-prof__close kbd{font:inherit;opacity:.55}
.mk-prof__text{position:relative;z-index:1;overflow-y:auto;overscroll-behavior:contain;padding:56px 56px 64px;scrollbar-width:thin;scrollbar-color:#f4f2ee33 transparent}
.mk-prof__eyebrow{display:flex;align-items:center;gap:12px;margin:0;font:600 11.5px/1 var(--label);letter-spacing:.18em;color:var(--mk-mute)}
.mk-prof__eyebrow:after{content:"";flex:1;height:1px;background:var(--mk-hair)}
.mk-prof__eyebrow b{color:var(--ac);font-weight:700}
.mk-prof__name{margin:22px 0 0;display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 18px}
.mk-prof__name b{font:800 clamp(52px,7.2vw,96px)/.86 var(--display);letter-spacing:.005em}
.mk-prof__name b{display:block;min-width:0;max-width:100%;overflow:hidden;white-space:nowrap}
.mk-prof__track{display:inline-flex}
.mk-prof__track>span{flex:none}
.mk-prof__name b.is-run{-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 90%,transparent)}
.mk-prof__name b.is-run .mk-prof__track>span{padding-right:.45em}
.mk-prof__name b.is-run .mk-prof__track{animation:mk-marq var(--dur,9s) linear infinite}
.mk-prof__name b.is-fit{font-size:clamp(34px,4.6vw,60px)}
@keyframes mk-marq{to{transform:translateX(-50%)}}
.mk-prof__name>span{font:800 clamp(20px,2.2vw,30px)/1 var(--ja);color:var(--ac)}
.mk-prof__role{display:inline-flex;align-items:center;gap:10px;margin-top:20px;padding:8px 12px;border:1px solid color-mix(in srgb,var(--ac) 55%,transparent);border-radius:2px;font:700 12px/1 var(--label);letter-spacing:.14em}
.mk-prof__role i{width:7px;height:7px;border-radius:50%;background:var(--ac);box-shadow:0 0 10px var(--ac)}
.mk-prof__role em{font-style:normal;font-family:var(--ja);opacity:.7;letter-spacing:.06em}
.mk-prof__sec{margin-top:40px}
.mk-prof__sec h3{margin:0 0 14px;display:flex;align-items:center;gap:10px;font:700 11.5px/1 var(--label);letter-spacing:.18em;color:var(--mk-mute)}
.mk-prof__sec h3 i{font-style:normal;color:var(--ac)}
.mk-prof__lore{margin:0;font-size:clamp(16px,1.35vw,19px);line-height:1.72;letter-spacing:.02em;color:#f4f2eee6}
.mk-prof:lang(en) .mk-prof__lore{letter-spacing:0}
.mk-prof__does{list-style:none;margin:0;padding:0;border-top:1px solid var(--mk-hair)}
.mk-prof__does li{display:grid;grid-template-columns:44px 1fr;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--mk-hair);font-size:16px;line-height:1.5}
.mk-prof__does li b{font:700 12px/1 var(--label);letter-spacing:.1em;color:var(--ac)}
.mk-prof__chips{display:flex;flex-wrap:wrap;gap:8px}
.mk-prof__chips span{padding:8px 12px;border:1px solid var(--mk-hair);border-radius:2px;font:600 12px/1 var(--label);letter-spacing:.08em;color:#f4f2eed9}
.mk-prof__team{display:flex;flex-wrap:wrap;gap:10px}
.mk-prof__mate{display:flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;border:1px solid var(--mk-hair);border-radius:2px;font:700 12.5px/1 var(--label);letter-spacing:.08em;background:#ffffff06}
.mk-prof__mate img{width:38px;height:38px;object-fit:contain}
.mk-prof__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--mk-hair)}
.mk-prof__stats div{padding:14px 16px;border-right:1px solid var(--mk-hair)}
.mk-prof__stats div:last-child{border-right:0}
.mk-prof__stats small{display:block;font:600 10.5px/1 var(--label);letter-spacing:.16em;color:var(--mk-mute)}
.mk-prof__stats b{display:block;margin-top:8px;font:800 18px/1 var(--display);letter-spacing:.02em}
.mk-prof__stats .on{color:#5cff8a}
.mk-prof__cta{margin-top:44px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.mk-prof__go{display:inline-flex;align-items:center;gap:14px;height:56px;padding:0 26px;background:var(--ac);color:#08080a;border:0;border-radius:2px;font:800 15px/1 var(--display);letter-spacing:.06em;transition:transform .3s var(--ease-snap),filter .2s}
.mk-prof__go:hover{transform:translateX(4px);filter:brightness(1.08)}
.mk-prof__go svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.mk-prof__cta small{font:500 12px/1.4 var(--label);letter-spacing:.06em;color:var(--mk-mute)}
.mk-prof__scroll{position:sticky;bottom:-64px;margin:28px -56px -64px;padding:18px 56px 22px;display:flex;align-items:center;gap:10px;font:600 10.5px/1 var(--label);letter-spacing:.2em;color:var(--mk-mute);background:linear-gradient(transparent,#0a0a0c 55%);transition:opacity .3s}
.mk-prof__scroll i{width:1px;height:18px;background:var(--mk-mute);animation:mk-scroll 1.6s var(--ease-swift) infinite;transform-origin:top}
.mk-prof__text.is-end .mk-prof__scroll{opacity:0}
@keyframes mk-scroll{0%{transform:scaleY(0)}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}to{transform:scaleY(0);transform-origin:bottom}}
.mk-prof__stage{position:relative;z-index:1;display:grid;place-items:center;border-left:1px solid var(--mk-hair);overflow:hidden}
.mk-prof__ring{position:absolute;width:min(78%,520px);aspect-ratio:1;border-radius:50%;border:1px dashed color-mix(in srgb,var(--ac) 40%,transparent);animation:mk-spin 24s linear infinite}
.mk-prof__ring:after{content:"";position:absolute;inset:9%;border-radius:50%;border:1px solid var(--mk-hair)}
@keyframes mk-spin{to{transform:rotate(360deg)}}
.mk-prof__turn{position:relative;width:min(88%,560px);aspect-ratio:1;animation:mk-bob 3.2s ease-in-out infinite}
.mk-prof__turn img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .32s linear;filter:drop-shadow(0 30px 40px #000a)}
.mk-prof__turn img.on{opacity:1}
.mk-prof__turn img.flip{transform:scaleX(-1)}
@keyframes mk-bob{50%{transform:translateY(-12px)}}
.mk-prof__shadow{position:absolute;bottom:13%;width:34%;height:22px;border-radius:50%;background:radial-gradient(#000c,transparent 70%);animation:mk-shadow 3.2s ease-in-out infinite}
@keyframes mk-shadow{50%{transform:scaleX(.86);opacity:.7}}
.mk-prof__kana{position:absolute;right:26px;top:50%;transform:translateY(-50%);writing-mode:vertical-rl;font:800 15px/1 var(--ja);letter-spacing:.5em;color:#f4f2ee2e}
.mk-prof__no{position:absolute;left:26px;bottom:24px;font:800 64px/1 var(--display);color:transparent;-webkit-text-stroke:1px #f4f2ee33}
@media (max-width:860px){
 .mk-prof{padding:10px}
 .mk-prof__panel{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;height:100%;overflow-y:auto;overscroll-behavior:contain}
 .mk-prof__stage{order:-1;border-left:0;border-bottom:1px solid var(--mk-hair);height:min(44vh,360px)}
 .mk-prof__turn{width:auto;height:92%}
 .mk-prof__text{overflow:visible;padding:30px 22px 40px}
 .mk-prof__scroll{display:none}
 .mk-prof__name b{font-size:clamp(44px,13vw,64px)}
 .mk-prof__sec{margin-top:30px}
 .mk-prof__stats b{font-size:15px}
 .mk-prof__no{font-size:44px;left:16px;bottom:12px}
 .mk-prof__close{position:fixed;top:max(16px,calc(env(safe-area-inset-top) + 8px));right:16px}
 .mk-prof__corner{display:none}
}
@media (prefers-reduced-motion:reduce){.mk-prof__turn,.mk-prof__ring,.mk-prof__shadow,.mk-prof__scroll i{animation:none}}
:root[data-tier=low] .mk-prof__veil{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
