/* ============================================================
   chito.fan — shared design system
   NSO / pastel webcore / old Windows UI / kawaii cyber shrine
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=DotGothic16&family=Press+Start+2P&family=VT323&family=Zen+Maru+Gothic:wght@400;500;700;900&display=swap');

:root{
  --sick-pink:#ff4f9e; --hot:#ff2e88; --bubble:#ff9ed1; --soft:#ffd4ea;
  --lav:#c2a3ff; --cyan:#7fe3ff; --cream:#fff2f9; --void:#1d1233; --void2:#2a1a4d;
  --toxic:#bff05e; --ink:#3a1f4d; --mut:#7a5a86;
  --disp:'DotGothic16','Zen Maru Gothic',monospace;
  --pixel:'Press Start 2P',monospace;
  --body:'Zen Maru Gothic','DotGothic16',sans-serif;
  --term:'VT323',monospace;

  /* per-room tokens (overridden by [data-room]) */
  --room-accent:var(--sick-pink);
  --room-accent2:var(--lav);
  --bg:
    radial-gradient(120% 90% at 80% -10%, rgba(127,227,255,.55), transparent 55%),
    radial-gradient(130% 100% at 10% 0%, rgba(194,163,255,.55), transparent 55%),
    radial-gradient(150% 120% at 50% 120%, rgba(255,46,136,.42), transparent 60%),
    linear-gradient(165deg,#ffe3f4 0%,#ffd0ec 35%,#e9caff 70%,#cfe9ff 100%);
  --wall:transparent;
  --bar-grad:linear-gradient(180deg,#ff8bc4,#ff4d9d 55%,#f0368c);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:var(--body);color:var(--ink);min-height:100vh;
  background:var(--bg);background-attachment:fixed;
  overflow-x:hidden;line-height:1.5;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}

/* faint wallpaper layer (rooms can set --wall to an image url) */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:var(--wall);background-size:cover;background-position:center;
  opacity:.16;filter:saturate(1.15) blur(1px);mix-blend-mode:luminosity;
}
/* scanlines + vignette */
body::after{
  content:"";position:fixed;inset:0;z-index:9000;pointer-events:none;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.045) 0 1px, transparent 1px 3px),
    radial-gradient(120% 120% at 50% 50%, transparent 60%, rgba(35,8,55,.30) 100%);
  mix-blend-mode:multiply;
}

/* ---------- layout ---------- */
.stage{position:relative;z-index:5;max-width:1180px;margin:0 auto;padding:46px 16px 90px;}
.row{display:grid;gap:18px;}
.row.two{grid-template-columns:1fr 1fr;}
.row.side{grid-template-columns:.82fr 1.18fr;}
.row.side-r{grid-template-columns:1.18fr .82fr;}
.row.three{grid-template-columns:repeat(3,1fr);}
.gap-sm{gap:12px;}
.mb{margin-bottom:18px;}
.mb-lg{margin-bottom:26px;}
.sectit{font-family:var(--pixel);font-size:9px;letter-spacing:1px;color:var(--room-accent);margin:0 2px 12px;display:flex;align-items:center;gap:8px;}
.sectit::after{content:"";flex:1;height:2px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--room-accent) 0 6px,transparent 6px 10px);opacity:.5;}

/* ---------- global taskbar ---------- */
.taskbar{
  position:fixed;top:0;left:0;right:0;z-index:8000;height:32px;
  display:flex;align-items:center;gap:10px;padding:0 10px;
  font-family:var(--term);font-size:18px;color:#fff;letter-spacing:.5px;
  background:linear-gradient(180deg,#ff7bbd,#ff3d92 60%,#e22a83);
  border-bottom:2px solid #8e1556;
  box-shadow:0 2px 0 rgba(255,255,255,.35) inset,0 5px 16px rgba(180,20,90,.3);
}
.tb-start{display:flex;align-items:center;gap:6px;font-family:var(--pixel);font-size:8px;color:#5a0d35;
  padding:5px 9px;border-radius:4px;background:linear-gradient(180deg,#fff,#ffd9ec);
  box-shadow:0 1px 0 #fff inset,0 -2px 0 #e69ac0 inset,0 2px 4px rgba(0,0,0,.18);white-space:nowrap;}
.tb-start .heart{color:var(--hot);}
.rec{display:flex;align-items:center;gap:5px;}
.rec b{font-family:var(--pixel);font-size:7px;}
.dot{width:8px;height:8px;border-radius:50%;background:#ff2b2b;box-shadow:0 0 6px #ff5a5a;animation:blink 1s steps(2) infinite;}
.tb-ticker{flex:1;overflow:hidden;white-space:nowrap;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.tb-ticker span{display:inline-block;padding-left:100%;animation:marquee 24s linear infinite;}
.tb-clock{font-variant-numeric:tabular-nums;text-shadow:0 1px 0 rgba(0,0,0,.3);white-space:nowrap;}

/* ---------- nav tab bar (window) ---------- */
.nav{margin-bottom:22px;}
.nav .win__bar .win__title .jp{font-family:var(--disp);font-size:13px;margin-right:6px;}
.tabs{display:flex;flex-wrap:wrap;gap:8px;padding:12px;}
.tab{
  display:flex;align-items:center;gap:7px;padding:8px 12px;border-radius:9px;
  font-family:var(--disp);font-size:15px;color:var(--ink);
  background:linear-gradient(180deg,#fff,#ffe9f5);border:2px solid #6b2350;
  box-shadow:0 3px 0 rgba(120,30,80,.18);transition:.12s;white-space:nowrap;
}
.tab .ico{font-size:14px;}
.tab .en{font-family:var(--pixel);font-size:7px;color:var(--mut);}
.tab:hover{transform:translateY(-2px);border-color:var(--sick-pink);box-shadow:0 5px 0 rgba(120,30,80,.18);}
.tab:active{transform:translateY(1px);box-shadow:0 2px 0 rgba(120,30,80,.18);}
.tab[aria-current="page"]{background:var(--bar-grad);color:#fff;border-color:#6b2350;}
.tab[aria-current="page"] .en{color:rgba(255,255,255,.85);}

/* ---------- window chrome ---------- */
.win{
  position:relative;background:linear-gradient(180deg,#fff7fc,#ffeaf6);
  border:2px solid #6b2350;border-radius:11px;
  box-shadow:0 0 0 2px #ffd0ea,7px 9px 0 rgba(120,30,80,.20),0 16px 38px rgba(150,20,90,.16);
  overflow:hidden;
}
.win__bar{
  display:flex;align-items:center;gap:8px;padding:7px 9px;color:#fff;user-select:none;cursor:default;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,.5) 0 1px,transparent 1px 2px),var(--bar-grad);
  border-bottom:2px solid #6b2350;
}
.win__title{font-family:var(--pixel);font-size:9.5px;letter-spacing:.4px;text-shadow:1px 1px 0 rgba(120,10,60,.6);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.win__title .jp{font-family:var(--disp);font-size:13px;margin-right:5px;}
.win__sp{flex:1;}
.dots{display:none;}
.dots i{width:15px;height:15px;border-radius:3px;display:grid;place-items:center;font-style:normal;
  font-family:var(--pixel);font-size:7px;color:#7a1148;background:linear-gradient(180deg,#fff,#ffd2e7);
  box-shadow:0 1px 0 #fff inset,0 -2px 0 #e191ba inset;}
.win__body{padding:18px;position:relative;}

/* night window variant (dark glassy, glowing) */
.win--night{
  background:linear-gradient(180deg,rgba(40,26,77,.92),rgba(24,15,46,.95));
  border-color:#5a3aa0;color:#ece3ff;
  box-shadow:0 0 0 2px rgba(127,227,255,.25),0 0 40px rgba(140,110,255,.35),7px 9px 0 rgba(20,8,40,.5);
  backdrop-filter:blur(2px);
}
.win--night .win__bar{background:linear-gradient(180deg,#6b53b8,#4a3690);border-bottom-color:#7a5ad0;}
.win--night .win__title{text-shadow:0 0 6px rgba(180,160,255,.6);}
.win--night .win__body{color:#ddd0ff;}
.win--night .dots i{color:#3a2a6a;background:linear-gradient(180deg,#cfc0ff,#a890ff);box-shadow:none;}

/* terminal window variant */
.win--term{background:#0c0a18;border-color:#2a6b6b;color:#bff0ff;
  box-shadow:0 0 0 2px rgba(127,227,255,.2),0 0 34px rgba(40,180,180,.25),7px 9px 0 rgba(0,0,0,.5);}
.win--term .win__bar{background:linear-gradient(180deg,#1d3a4a,#13252f);border-bottom-color:#2a6b6b;color:#9ff0ff;}
.win--term .win__title{text-shadow:0 0 6px rgba(120,240,255,.5);}
.win--term .win__body{font-family:var(--term);font-size:17px;color:#9bf0c4;}
.win--term .dots i{color:#0c0a18;background:linear-gradient(180deg,#9ff0ff,#5ec8c8);box-shadow:none;}

/* corner sticker-tag on a window */
.tag{position:absolute;z-index:6;top:-10px;right:14px;font-family:var(--pixel);font-size:8px;color:#fff;
  padding:5px 8px;border-radius:20px;transform:rotate(6deg);background:linear-gradient(180deg,#9b6bff,#7a3dff);
  border:2px solid #fff;box-shadow:0 4px 10px rgba(90,40,160,.4);}
.tag.pink{background:linear-gradient(180deg,#ff8bc4,#ff2e88);}
.tag.cyan{background:linear-gradient(180deg,#8fe6ff,#3fb6ff);}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:7px;font-family:var(--disp);font-size:15px;color:#fff;
  padding:9px 15px;border-radius:22px;border:2px solid #b1247a;
  background:linear-gradient(180deg,#ff6fb3,#ff2e88);box-shadow:0 3px 0 #b1247a;transition:.1s;}
.btn:hover{transform:translateY(-1px);} .btn:active{transform:translateY(2px);box-shadow:0 1px 0 #b1247a;}
.btn.lav{background:linear-gradient(180deg,#b48cff,#8a4dff);border-color:#5e2db1;box-shadow:0 3px 0 #5e2db1;}
.btn.cyan{background:linear-gradient(180deg,#7fe3ff,#3fb6ff);border-color:#1f86c8;box-shadow:0 3px 0 #1f86c8;color:#073449;}
.btn.ghost{background:linear-gradient(180deg,#fff,#ffe9f5);color:#7a1148;border-color:#6b2350;box-shadow:0 3px 0 rgba(120,30,80,.2);}
.btn.sm{font-size:13px;padding:6px 11px;border-radius:16px;}

/* ---------- chips / tags / badges ---------- */
.chip{font-family:var(--pixel);font-size:7.5px;color:#7a1148;padding:6px 9px;border-radius:20px;
  background:linear-gradient(180deg,#fff,#ffdcee);border:1.5px solid #ff9ccf;box-shadow:0 2px 0 rgba(180,40,110,.18);
  display:inline-flex;align-items:center;gap:5px;}
.htag{font-family:var(--body);font-weight:700;font-size:13px;color:var(--sick-pink);
  background:#fff;border:1.5px solid var(--bubble);border-radius:20px;padding:4px 11px;display:inline-block;transition:.12s;}
.htag:hover{background:var(--bubble);color:#fff;}
.badge{font-family:var(--pixel);font-size:7px;color:#fff;padding:4px 7px;border-radius:6px;letter-spacing:.5px;}
.badge.new{background:#2ecc5a;} .badge.fix{background:#3fb6ff;} .badge.art{background:#ff2e88;}
.badge.site{background:#9b6bff;} .badge.hot{background:#ff6a00;}

/* status lights */
.stat-lights{display:flex;flex-direction:column;gap:9px;}
.slight{display:flex;align-items:center;gap:9px;font-family:var(--term);font-size:17px;color:var(--ink);}
.slight .lt{width:11px;height:11px;border-radius:50%;flex:none;box-shadow:0 0 7px currentColor;}
.lt.on{background:#2ecc5a;color:#2ecc5a;} .lt.warm{background:#ffcf3f;color:#ffcf3f;}
.lt.off{background:#ff5a7a;color:#ff5a7a;} .lt.cool{background:#7fe3ff;color:#7fe3ff;}
.slight .vv{margin-left:auto;font-family:var(--pixel);font-size:7px;color:var(--mut);}

/* ---------- meters ---------- */
.meters{display:flex;flex-direction:column;gap:11px;}
.meter label{display:flex;justify-content:space-between;font-family:var(--pixel);font-size:7.5px;color:#6b2350;margin-bottom:4px;}
.meter label .v{color:var(--hot);}
.track{height:16px;border-radius:9px;overflow:hidden;position:relative;background:#f0d6e6;border:2px solid #6b2350;
  box-shadow:0 2px 0 rgba(255,255,255,.6) inset,0 -2px 4px rgba(120,30,80,.25) inset;}
.fill{height:100%;border-radius:7px 0 0 7px;position:relative;transition:width .7s cubic-bezier(.2,.9,.2,1);
  background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 4px,transparent 4px 8px),linear-gradient(90deg,var(--hot),var(--lav));}
.fill.cyan{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 4px,transparent 4px 8px),linear-gradient(90deg,var(--cyan),#5ec8ff);}
.fill.toxic{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 4px,transparent 4px 8px),linear-gradient(90deg,#a0e84f,#ffe14d);}
.fill::after{content:"";position:absolute;top:0;right:0;width:13px;height:100%;background:rgba(255,255,255,.55);filter:blur(3px);}

/* ---------- stickers + shelf ---------- */
.shelf{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end;}
.sticker{position:relative;border-radius:12px;overflow:hidden;border:3px solid #fff;
  outline:2px solid #6b2350;background:#2a1a4d;box-shadow:0 7px 16px rgba(120,30,90,.32);transition:transform .18s;}
.sticker img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;}
.sticker:hover{transform:translateY(-4px) rotate(-2deg);}
.sticker .cap{position:absolute;left:0;right:0;bottom:0;font-family:var(--pixel);font-size:6.5px;color:#fff;
  padding:7px 6px 6px;background:linear-gradient(0deg,rgba(20,6,40,.85),transparent);}
.sticker.s1{width:84px;height:84px;transform:rotate(-3deg);}
.sticker.s2{width:72px;height:96px;transform:rotate(2deg);}
.sticker.s3{width:96px;height:72px;transform:rotate(-1deg);}

/* floating PNG-style stickers (framed mini-cards) */
.float-sticker{position:fixed;z-index:7;pointer-events:none;border-radius:12px;overflow:hidden;
  border:3px solid #fff;outline:2px solid rgba(107,35,80,.5);background:#2a1a4d;
  filter:drop-shadow(3px 5px 5px rgba(120,30,90,.4));}
.float-sticker img{width:100%;image-rendering:pixelated;}
.emoji{position:fixed;z-index:6;pointer-events:none;font-size:22px;opacity:.85;text-shadow:0 2px 4px rgba(150,20,90,.3);}

/* ---------- toasts ---------- */
#toasts{position:fixed;right:14px;bottom:14px;z-index:9500;display:flex;flex-direction:column;gap:9px;align-items:flex-end;}
.toast{display:flex;align-items:center;gap:9px;font-family:var(--body);font-weight:700;font-size:13px;color:var(--ink);
  background:linear-gradient(180deg,#fff,#ffeaf6);border:2px solid #6b2350;border-radius:11px;padding:10px 13px;
  box-shadow:0 6px 0 rgba(120,30,80,.2),0 12px 26px rgba(150,20,90,.2);max-width:280px;
  animation:toastIn .3s ease, toastOut .4s ease 3.4s forwards;}
.toast .tic{width:24px;height:24px;border-radius:7px;flex:none;display:grid;place-items:center;color:#fff;
  font-family:var(--disp);font-size:14px;background:linear-gradient(160deg,var(--sick-pink),var(--lav));}

/* ---------- folders ---------- */
.folder{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 8px;border-radius:11px;cursor:pointer;
  background:linear-gradient(180deg,#fff,#fff1f8);border:2px solid #6b2350;box-shadow:0 4px 0 rgba(120,30,80,.18);transition:.12s;text-align:center;}
.folder:hover{transform:translateY(-3px);border-color:var(--sick-pink);}
.folder .fic{width:54px;height:42px;position:relative;}
.folder .fic::before{content:"";position:absolute;inset:0;border-radius:5px 8px 8px 8px;
  background:linear-gradient(180deg,#ffd166,#ff9f43);border:2px solid #b96a12;}
.folder .fic::after{content:"";position:absolute;top:-6px;left:4px;width:22px;height:10px;border-radius:5px 5px 0 0;
  background:#ffd166;border:2px solid #b96a12;border-bottom:none;}
.folder .fname{font-family:var(--pixel);font-size:7px;color:var(--ink);line-height:1.4;}
.folder .fcount{font-family:var(--term);font-size:14px;color:var(--mut);}

/* ---------- speech / chat bubbles ---------- */
.speech{display:flex;flex-direction:column;gap:10px;}
.bubble{position:relative;background:#fff;border:2px solid #ffb3da;color:#4a2a55;border-radius:14px;padding:11px 14px;
  font-size:14.5px;line-height:1.6;box-shadow:0 3px 0 rgba(255,140,200,.3);align-self:flex-start;max-width:92%;border-bottom-left-radius:4px;}
.bubble::before{content:"あめ ♡";position:absolute;top:-15px;left:6px;font-family:var(--pixel);font-size:6.5px;color:var(--sick-pink);}
.bubble.me{align-self:flex-end;color:#fff;border:none;border-bottom-right-radius:4px;border-bottom-left-radius:14px;
  background:linear-gradient(160deg,var(--sick-pink),var(--lav));box-shadow:0 3px 0 rgba(150,40,120,.3);}
.bubble.me::before{content:"P-chan";left:auto;right:8px;color:#ffe;}

/* scrollbox */
.scrollbox{max-height:260px;overflow-y:auto;padding-right:6px;scrollbar-width:thin;scrollbar-color:var(--bubble) transparent;}
.scrollbox::-webkit-scrollbar{width:10px;}
.scrollbox::-webkit-scrollbar-track{background:rgba(255,180,220,.18);border-radius:8px;}
.scrollbox::-webkit-scrollbar-thumb{background:var(--bubble);border-radius:8px;border:2px solid transparent;background-clip:padding-box;}

/* heart bullet list */
ul.hearts{list-style:none;display:flex;flex-direction:column;gap:8px;}
ul.hearts li{position:relative;padding-left:22px;font-size:14.5px;color:#5a3a66;}
ul.hearts li::before{content:"♡";position:absolute;left:0;top:0;color:var(--hot);}

/* checklist */
.tasklist{display:flex;flex-direction:column;gap:9px;}
.task{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:11px;cursor:pointer;
  background:linear-gradient(180deg,#fff,#fff1f8);border:2px solid #ffb3da;transition:.12s;user-select:none;}
.task:hover{border-color:var(--sick-pink);}
.task .box{width:22px;height:22px;flex:none;border-radius:6px;border:2px solid #6b2350;background:#fff;display:grid;place-items:center;
  font-family:var(--disp);font-size:15px;color:#fff;transition:.12s;}
.task .lbl{font-size:14.5px;color:#5a3a66;}
.task.done .box{background:linear-gradient(160deg,var(--sick-pink),var(--lav));}
.task.done .lbl{color:var(--mut);text-decoration:line-through;}

/* ============================================================
   HERO
   ============================================================ */
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;}
.hero__art{position:relative;min-height:330px;border-right:2px solid #6b2350;overflow:hidden;background:#22113f;}
.hero__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 36%;}
.hero__art::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 42%,rgba(255,46,136,.22));mix-blend-mode:screen;}
.live-badge{position:absolute;top:12px;left:12px;z-index:3;display:flex;align-items:center;gap:6px;
  font-family:var(--pixel);font-size:8px;color:#fff;background:rgba(20,6,40,.62);border:1px solid #ff6fb3;
  padding:6px 9px;border-radius:20px;backdrop-filter:blur(3px);}
.live-badge .dot{width:7px;height:7px;}
.view-count{position:absolute;bottom:12px;left:12px;z-index:3;font-family:var(--term);font-size:18px;color:#fff;
  background:rgba(20,6,40,.58);padding:3px 8px;border-radius:6px;border:1px solid rgba(255,255,255,.22);}
.view-count b{color:var(--cyan);}
.hero__panel{padding:26px 24px;display:flex;flex-direction:column;justify-content:center;gap:13px;background:linear-gradient(180deg,#fff7fc,#ffe6f4);}
.eyebrow{font-family:var(--pixel);font-size:8px;letter-spacing:2px;color:var(--room-accent);}
.title{font-family:var(--disp);font-size:clamp(32px,6vw,58px);line-height:.92;letter-spacing:1px;color:var(--void);}
.title .heart{color:var(--hot);font-size:.7em;vertical-align:.1em;}
.glitch{position:relative;display:inline-block;}
.glitch::before,.glitch::after{content:attr(data-t);position:absolute;left:0;top:0;width:100%;}
.glitch::before{color:var(--cyan);transform:translate(-2px,1px);mix-blend-mode:multiply;animation:g1 2.6s steps(2) infinite;}
.glitch::after{color:var(--hot);transform:translate(2px,-1px);mix-blend-mode:multiply;animation:g2 3.1s steps(2) infinite;}
.handle{font-family:var(--term);font-size:21px;color:var(--sick-pink);}
.handle b{color:var(--lav);}
.bio{font-size:15px;line-height:1.7;color:#5a3a66;max-width:44ch;}
.bio b{color:var(--hot);}
.sub-line{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px;}
/* collab credit + "presents" sub-brand line (index hero) */
.eyebrow--collab{font-family:var(--term);font-size:19px;letter-spacing:.4px;color:var(--sick-pink);text-transform:none;line-height:1;}
.eyebrow--collab b{color:var(--lav);font-weight:400;}
.eyebrow--collab .x{color:var(--mut);margin:0 3px;font-size:15px;}
.hero__presents{margin-top:5px;}
.hero__presents .pl{display:block;font-family:var(--pixel);font-size:8px;letter-spacing:1.5px;color:var(--mut);text-transform:uppercase;margin-bottom:4px;}
.hero__presents .star{color:var(--cyan);}
.hero__presents i{display:block;font-family:var(--disp);font-style:italic;font-size:clamp(22px,3.6vw,32px);line-height:1;color:var(--lav);letter-spacing:.5px;text-shadow:2px 2px 0 rgba(255,79,158,.16);white-space:nowrap;}
/* night hero panel */
.win--night .hero__panel{background:linear-gradient(180deg,rgba(40,26,77,.6),rgba(24,15,46,.7));}
.win--night .title{color:#fff;text-shadow:0 0 18px rgba(150,120,255,.5);}
.win--night .bio{color:#cdbdf0;} .win--night .eyebrow{color:var(--cyan);}
.win--night .hero__art{border-right-color:#5a3aa0;}

/* profile mini */
.ava-wrap{display:flex;gap:14px;align-items:center;margin-bottom:14px;}
.ava{width:78px;height:78px;flex:none;border-radius:14px;overflow:hidden;border:3px solid #fff;
  box-shadow:0 0 0 3px var(--sick-pink),0 6px 14px rgba(180,30,100,.3);background:#2a1a4d;}
.ava img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;object-position:top;}
.who h2{font-family:var(--disp);font-size:24px;color:var(--void);line-height:1;}
.who .st{font-family:var(--term);font-size:17px;color:var(--sick-pink);margin-top:2px;}
.who .on{display:inline-flex;align-items:center;gap:5px;font-family:var(--pixel);font-size:7px;color:#1f7a3a;margin-top:6px;
  background:#e7ffef;padding:4px 7px;border-radius:12px;border:1px solid #9be8ad;}
.who .on .dot{width:7px;height:7px;background:#2ecc5a;box-shadow:0 0 5px #4dff7a;}

/* now-playing mini player */
.player{display:flex;align-items:center;gap:12px;}
.player .disc{width:46px;height:46px;border-radius:50%;flex:none;background:
  radial-gradient(circle,#fff 18%,transparent 19%),conic-gradient(from 0deg,#ff6fb3,#b48cff,#7fe3ff,#ff6fb3);
  border:2px solid #6b2350;animation:spin 4s linear infinite;}
.player .pinfo{flex:1;min-width:0;}
.player .pnow{font-family:var(--pixel);font-size:7px;color:var(--mut);}
.player .ptitle{font-family:var(--disp);font-size:17px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.player .pbar{height:8px;border-radius:5px;background:#f0d6e6;border:1.5px solid #6b2350;overflow:hidden;margin-top:5px;}
.player .pbar i{display:block;height:100%;width:42%;background:linear-gradient(90deg,var(--hot),var(--lav));animation:prog 18s linear infinite;}
.player .pbtn{width:34px;height:34px;border-radius:50%;flex:none;border:2px solid #b1247a;color:#fff;font-size:14px;
  background:linear-gradient(180deg,#ff6fb3,#ff2e88);box-shadow:0 2px 0 #b1247a;}

/* shrine preview cards (index) */
.shrines{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.shrine{position:relative;border-radius:11px;overflow:hidden;border:2px solid #6b2350;background:#fff;
  box-shadow:0 5px 0 rgba(120,30,80,.18),0 12px 28px rgba(150,20,90,.14);transition:.15s;display:flex;flex-direction:column;}
.shrine:hover{transform:translateY(-4px);border-color:var(--sick-pink);}
.shrine__thumb{height:120px;position:relative;overflow:hidden;background:#2a1a4d;}
.shrine__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.shrine:hover .shrine__thumb img{transform:scale(1.07);}
.shrine__thumb .px{position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(20,6,40,.65));}
.shrine__thumb .en{position:absolute;left:9px;bottom:7px;font-family:var(--pixel);font-size:7px;color:#fff;}
.shrine__b{padding:12px;display:flex;flex-direction:column;gap:6px;flex:1;}
.shrine__b h3{font-family:var(--disp);font-size:19px;color:var(--void);line-height:1;}
.shrine__b p{font-size:12.5px;color:var(--mut);line-height:1.5;flex:1;}
.shrine__b .go{font-family:var(--pixel);font-size:7px;color:var(--sick-pink);align-self:flex-start;}

/* ============================================================
   GALLERY
   ============================================================ */
.gtabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.gtab{font-family:var(--pixel);font-size:8px;color:#7a1148;padding:8px 12px;border-radius:18px;
  background:#fff;border:2px solid #6b2350;box-shadow:0 3px 0 rgba(120,30,80,.15);transition:.12s;}
.gtab.active,.gtab:hover{background:var(--bar-grad);color:#fff;}
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.frame{position:relative;border-radius:8px;overflow:hidden;border:3px solid #fff;outline:2px solid #6b2350;
  box-shadow:0 7px 0 rgba(120,30,80,.16);background:#2a1a4d;aspect-ratio:1/1;cursor:pointer;transition:transform .18s;}
.frame img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;}
.frame:hover{transform:translateY(-4px) rotate(-1.5deg);}
.frame::after{content:attr(data-c);position:absolute;left:0;right:0;bottom:0;opacity:0;transition:.18s;
  font-family:var(--pixel);font-size:7px;color:#fff;padding:8px 7px 7px;background:linear-gradient(0deg,rgba(20,6,40,.85),transparent);}
.frame:hover::after{opacity:1;}
.frame::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:.18s;mix-blend-mode:screen;
  background:linear-gradient(180deg,rgba(127,227,255,.4),transparent 30%,rgba(255,46,136,.35));}
.frame:hover::before{opacity:1;}
.frame[hidden]{display:none;}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:9700;display:none;place-items:center;padding:24px;
  background:radial-gradient(circle,rgba(40,12,60,.7),rgba(15,5,30,.92));backdrop-filter:blur(4px);}
.lightbox.open{display:grid;}
.lightbox .lb-win{max-width:min(680px,92vw);width:auto;}
.lightbox .lb-win img{max-height:72vh;width:auto;margin:0 auto;border-radius:6px;image-rendering:pixelated;}
.lightbox .lb-body{padding:14px;text-align:center;}
.lightbox .lb-cap{font-family:var(--disp);font-size:18px;color:var(--void);margin-top:8px;}
.lb-close{cursor:pointer;}

/* ============================================================
   FORUM
   ============================================================ */
.boards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.board{display:flex;align-items:flex-start;gap:13px;padding:14px;border-radius:11px;cursor:pointer;
  background:linear-gradient(180deg,#fff,#fff1f8);border:2px solid #6b2350;box-shadow:0 4px 0 rgba(120,30,80,.18);transition:.12s;}
.board:hover{transform:translateY(-3px);border-color:var(--sick-pink);}
.board .bic{width:46px;height:46px;flex:none;border-radius:11px;display:grid;place-items:center;font-size:22px;color:#fff;
  background:linear-gradient(160deg,var(--sick-pink),var(--lav));box-shadow:0 3px 0 rgba(120,30,80,.25);}
.board h3{font-family:var(--disp);font-size:18px;color:var(--void);line-height:1.1;}
.board p{font-size:12.5px;color:var(--mut);margin-top:3px;line-height:1.45;}
.board .bmeta{display:flex;gap:12px;margin-top:7px;font-family:var(--term);font-size:14px;color:var(--sick-pink);}
.board .bmeta b{color:var(--lav);}

.threads{display:flex;flex-direction:column;gap:9px;}
.thread{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:11px;cursor:pointer;
  background:#fff;border:2px solid #ffb3da;transition:.12s;}
.thread:hover{border-color:var(--sick-pink);transform:translateX(3px);}
.thread .tav{width:38px;height:38px;flex:none;border-radius:9px;display:grid;place-items:center;color:#fff;font-family:var(--disp);font-size:16px;
  background:linear-gradient(160deg,var(--lav),var(--cyan));}
.thread .tmain{flex:1;min-width:0;}
.thread .ttitle{font-family:var(--disp);font-size:16px;color:var(--void);line-height:1.2;}
.thread .tsub{font-size:11.5px;color:var(--mut);margin-top:2px;}
.thread .treplies{text-align:center;font-family:var(--term);font-size:14px;color:var(--sick-pink);flex:none;}
.thread .treplies b{display:block;font-size:22px;color:var(--lav);line-height:1;}

/* ============================================================
   ACADEMY
   ============================================================ */
.board-bg{position:relative;background:linear-gradient(160deg,#15203a,#0e1830);border-color:#2a3f6b;color:#dfe9ff;overflow:hidden;}
.board-bg .win__bar{background:linear-gradient(180deg,#2a3f6b,#1a2747);border-bottom-color:#3a5490;color:#cfe0ff;}
.board-bg .win__title{text-shadow:0 0 6px rgba(140,200,255,.5);}
.board-bg .dots i{color:#15203a;background:linear-gradient(180deg,#cfe0ff,#9fc0ff);box-shadow:none;}
.formula-haze{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:.10;}
.formula-haze span{position:absolute;font-family:var(--disp);color:var(--cyan);white-space:nowrap;}
.daily{position:relative;z-index:1;display:flex;flex-direction:column;gap:10px;}
.daily .dprob{font-family:var(--disp);font-size:clamp(20px,3vw,30px);color:#fff;line-height:1.3;text-shadow:0 0 14px rgba(120,200,255,.4);}
.daily .dhint{font-size:13px;color:#9fb6e0;}
.formula-shelf{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:11px;}
.fcard{padding:14px;border-radius:11px;background:linear-gradient(180deg,#fff,#f3f7ff);border:2px solid #2a3f6b;
  box-shadow:0 4px 0 rgba(30,50,100,.18);transition:.12s;}
.fcard:hover{transform:translateY(-3px);border-color:var(--cyan);}
.fcard .feq{font-family:var(--disp);font-size:20px;color:#15203a;}
.fcard .fname{font-family:var(--pixel);font-size:7px;color:#4a6aa0;margin-top:6px;}
.topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.topic{position:relative;padding:16px 13px;border-radius:12px;text-align:center;cursor:pointer;color:#fff;overflow:hidden;
  border:2px solid #6b2350;box-shadow:0 5px 0 rgba(120,30,80,.18);transition:.14s;
  background:linear-gradient(160deg,var(--sick-pink),var(--lav));}
.topic:nth-child(2){background:linear-gradient(160deg,#7fe3ff,#5a8cff);}
.topic:nth-child(3){background:linear-gradient(160deg,#b48cff,#7a4dff);}
.topic:nth-child(4){background:linear-gradient(160deg,#ff9f43,#ff5a7a);}
.topic:nth-child(5){background:linear-gradient(160deg,#5ee0a0,#3fb6ff);}
.topic:nth-child(6){background:linear-gradient(160deg,#ff6fb3,#b48cff);}
.topic:hover{transform:translateY(-4px);}
.topic .tco{font-size:30px;}
.topic h4{font-family:var(--disp);font-size:18px;margin-top:6px;}
.topic .teq{font-family:var(--term);font-size:15px;opacity:.85;margin-top:3px;}
.roadmap{display:flex;flex-direction:column;gap:0;position:relative;padding-left:8px;}
.rstep{display:flex;gap:14px;padding:0 0 18px;position:relative;}
.rstep::before{content:"";position:absolute;left:13px;top:6px;bottom:-6px;width:3px;background:repeating-linear-gradient(180deg,var(--lav) 0 6px,transparent 6px 12px);}
.rstep:last-child::before{display:none;}
.rstep .rdot{width:28px;height:28px;flex:none;border-radius:50%;z-index:1;display:grid;place-items:center;color:#fff;
  font-family:var(--pixel);font-size:8px;background:linear-gradient(160deg,var(--sick-pink),var(--lav));border:2px solid #fff;box-shadow:0 0 0 2px #6b2350;}
.rstep .rtx b{font-family:var(--disp);font-size:17px;color:var(--void);display:block;}
.rstep .rtx span{font-size:12.5px;color:var(--mut);}

/* ============================================================
   NEWS / CHANGELOG
   ============================================================ */
.timeline{display:flex;flex-direction:column;gap:14px;}
.entry{display:flex;gap:13px;}
.entry .edate{flex:none;width:74px;text-align:right;font-family:var(--term);font-size:15px;color:var(--mut);padding-top:3px;}
.entry .ebody{flex:1;background:#fff;border:2px solid #ffb3da;border-radius:11px;padding:13px;box-shadow:0 3px 0 rgba(255,140,200,.25);}
.entry .ehead{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px;}
.entry .ehead b{font-family:var(--disp);font-size:17px;color:var(--void);}
.entry .ebody p{font-size:13.5px;color:#5a3a66;line-height:1.6;}
.entry .ebody ul.hearts li{font-size:13.5px;}
.next-card{text-align:center;}
.next-card .nbig{font-family:var(--disp);font-size:24px;color:var(--void);}
.sysmsg{font-family:var(--term);font-size:16px;color:#9bf0c4;line-height:1.7;}
.sysmsg .pp{color:#7fe3ff;} .sysmsg .ok{color:#5ee08a;} .sysmsg .wn{color:#ffcf6a;}

/* ============================================================
   BOT terminal
   ============================================================ */
.botgrid{display:grid;grid-template-columns:.78fr 1.22fr;gap:18px;}
.bot-ava{text-align:center;}
.bot-ava .face{width:128px;height:128px;margin:0 auto 12px;border-radius:16px;overflow:hidden;border:3px solid #7fe3ff;
  box-shadow:0 0 0 3px #2a6b6b,0 0 28px rgba(120,240,255,.4);background:#0c0a18;transition:transform .15s;cursor:pointer;}
.bot-ava .face img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;object-position:top;}
.bot-ava .face.excited{animation:wiggle .5s ease;box-shadow:0 0 0 3px #ff2e88,0 0 28px #ff2e88;}
.bot-ava .bname{font-family:var(--disp);font-size:22px;color:#bff0ff;}
.bot-ava .bstat{font-family:var(--term);font-size:16px;color:#5ee08a;}
.cmd-list{display:flex;flex-direction:column;gap:6px;margin-top:6px;}
.cmd{display:flex;justify-content:space-between;gap:8px;font-family:var(--term);font-size:15px;color:#bff0ff;
  padding:6px 9px;border-radius:7px;background:rgba(127,227,255,.07);border:1px solid rgba(127,227,255,.18);cursor:pointer;transition:.12s;}
.cmd:hover{background:rgba(127,227,255,.16);}
.cmd b{color:#7fe3ff;} .cmd span{color:#6fa0b0;}
.term-chat{display:flex;flex-direction:column;height:440px;}
.term-chat .clog{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:9px;
  background:repeating-linear-gradient(0deg,rgba(127,227,255,.03) 0 1px,transparent 1px 3px),#0a0814;
  scrollbar-width:thin;scrollbar-color:#2a6b6b transparent;}
.term-chat .clog::-webkit-scrollbar{width:9px;} .term-chat .clog::-webkit-scrollbar-thumb{background:#2a6b6b;border-radius:8px;}
.tmsg{max-width:86%;padding:9px 12px;font-size:14px;line-height:1.55;border-radius:12px;animation:pop .25s ease;word-wrap:break-word;}
.tmsg.ame{align-self:flex-start;background:rgba(127,227,255,.1);border:1px solid #2a6b6b;color:#cdf6ff;border-bottom-left-radius:4px;}
.tmsg.me{align-self:flex-end;background:linear-gradient(160deg,#ff2e88,#9b6bff);color:#fff;border-bottom-right-radius:4px;}
.tmsg.sys{align-self:center;font-family:var(--term);font-size:14px;color:#6fa0b0;background:none;padding:2px;}
.term-typing{align-self:flex-start;display:flex;gap:4px;padding:10px 13px;background:rgba(127,227,255,.1);border:1px solid #2a6b6b;border-radius:12px;}
.term-typing i{width:7px;height:7px;border-radius:50%;background:#7fe3ff;animation:bounce 1s infinite;}
.term-typing i:nth-child(2){animation-delay:.15s;} .term-typing i:nth-child(3){animation-delay:.3s;}
.term-suggest{display:flex;flex-wrap:wrap;gap:6px;padding:10px 14px 0;}
.tsug{font-family:var(--term);font-size:15px;color:#bff0ff;padding:5px 10px;border-radius:16px;cursor:pointer;
  background:rgba(127,227,255,.08);border:1px solid #2a6b6b;transition:.12s;}
.tsug:hover{background:rgba(127,227,255,.2);}
.term-composer{display:flex;gap:8px;padding:12px 14px;border-top:1px solid #2a6b6b;}
.term-composer input{flex:1;font-family:var(--term);font-size:17px;color:#cdf6ff;padding:9px 13px;border-radius:20px;
  background:rgba(127,227,255,.06);border:2px solid #2a6b6b;outline:none;}
.term-composer input::placeholder{color:#5a7a8a;}
.term-composer input:focus{border-color:#7fe3ff;box-shadow:0 0 0 3px rgba(127,227,255,.15);}
.emo-meter{margin-top:12px;}
.emo-meter .track{background:rgba(127,227,255,.12);border-color:#2a6b6b;}

/* ============================================================
   COZY room specifics
   ============================================================ */
.starfield{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden;}
.starfield i{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;box-shadow:0 0 5px #fff;animation:twinkle 3s ease-in-out infinite;}
.breathe{display:flex;flex-direction:column;align-items:center;gap:12px;padding:6px 0;}
.breathe .orb{width:120px;height:120px;border-radius:50%;display:grid;place-items:center;font-family:var(--disp);font-size:15px;color:#fff;
  background:radial-gradient(circle at 38% 35%,rgba(255,255,255,.5),rgba(180,140,255,.35) 45%,rgba(127,227,255,.25));
  box-shadow:0 0 40px rgba(160,130,255,.5),inset 0 0 30px rgba(255,255,255,.25);animation:breathe 8s ease-in-out infinite;}
.breathe .bhint{font-family:var(--term);font-size:16px;color:#cdbdf0;}
.note-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:13px;}
.note{padding:13px;border-radius:9px;font-size:13px;line-height:1.5;color:#4a2a55;min-height:84px;
  box-shadow:0 5px 12px rgba(40,12,60,.35);transform:rotate(-1.5deg);position:relative;}
.note:nth-child(even){transform:rotate(1.5deg);}
.note.y{background:linear-gradient(180deg,#fff6c9,#ffe79a);}
.note.p{background:linear-gradient(180deg,#ffd9ec,#ffbfe0);}
.note.b{background:linear-gradient(180deg,#cfe7ff,#a9d2ff);}
.note .nfrom{font-family:var(--pixel);font-size:6.5px;color:rgba(80,40,90,.7);margin-top:8px;display:block;}
.note::before{content:"";position:absolute;top:-7px;left:50%;transform:translateX(-50%);width:30px;height:13px;
  background:rgba(255,255,255,.55);border:1px solid rgba(120,30,90,.25);border-radius:3px;}

/* ============================================================
   FOOTER
   ============================================================ */
.foot{margin-top:30px;}
.foot__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding:16px 18px;}
.foot__cred{font-family:var(--term);font-size:17px;color:var(--mut);}
.foot__cred .big{font-family:var(--pixel);font-size:9px;color:var(--room-accent);display:block;margin-bottom:6px;letter-spacing:1px;}
.foot__cred a{color:var(--lav);border-bottom:1px dotted var(--lav);}
.foot__lights{display:flex;gap:14px;}
.foot__lights .fl{display:flex;align-items:center;gap:6px;font-family:var(--pixel);font-size:7px;color:var(--mut);}

/* ============================================================
   ROOM THEMES (background + accent)
   ============================================================ */
body[data-room="cozy"]{
  --room-accent:#b59cff;--room-accent2:#7fe3ff;
  --bg:
    radial-gradient(90% 70% at 50% -5%, rgba(127,227,255,.28), transparent 60%),
    radial-gradient(120% 90% at 50% 10%, rgba(150,120,255,.25), transparent 55%),
    radial-gradient(140% 120% at 80% 100%, rgba(255,90,170,.22), transparent 60%),
    linear-gradient(180deg,#1a1535 0%,#241a4d 40%,#2e1f55 70%,#3a2350 100%);
}
body[data-room="cozy"] .sectit{color:#c9bbff;}
body[data-room="cozy"] .tab{color:var(--ink);}
body[data-room="bot"]{
  --room-accent:#7fe3ff;--room-accent2:#5ee08a;
  --bg:
    radial-gradient(90% 70% at 80% -5%, rgba(127,227,255,.22), transparent 55%),
    radial-gradient(100% 80% at 10% 10%, rgba(94,224,138,.14), transparent 55%),
    linear-gradient(180deg,#0a0a16 0%,#0e1228 50%,#120a22 100%);
}
body[data-room="bot"] .sectit{color:#8ff0ff;}
body[data-room="academy"]{
  --room-accent:#7fe3ff;--room-accent2:#bff05e;
  --bg:
    radial-gradient(90% 70% at 20% -5%, rgba(127,227,255,.20), transparent 55%),
    radial-gradient(120% 90% at 90% 100%, rgba(191,240,94,.14), transparent 55%),
    linear-gradient(180deg,#0e1830 0%,#142142 55%,#1a1840 100%);
}
body[data-room="academy"] .sectit{color:#9fe0ff;}
body[data-room="news"]{
  --room-accent:#5ee08a;--room-accent2:#ff6fb3;
  --bg:
    radial-gradient(90% 70% at 80% -5%, rgba(94,224,138,.16), transparent 55%),
    radial-gradient(100% 80% at 10% 100%, rgba(255,110,180,.16), transparent 55%),
    linear-gradient(180deg,#0c1018 0%,#10161f 55%,#161018 100%);
}
body[data-room="news"] .sectit{color:#7ee0a0;}
body[data-room="gallery"]{
  --room-accent:#9b6bff;--room-accent2:#7fe3ff;
  --bg:
    radial-gradient(100% 80% at 80% -5%, rgba(127,227,255,.45), transparent 55%),
    radial-gradient(120% 90% at 10% 10%, rgba(180,140,255,.45), transparent 55%),
    linear-gradient(165deg,#efe6ff 0%,#e3d4ff 45%,#d4ecff 100%);
}
body[data-room="forum"]{
  --room-accent:#ff4f9e;
  --bg:
    radial-gradient(110% 80% at 85% -5%, rgba(255,200,230,.6), transparent 55%),
    radial-gradient(120% 90% at 10% 10%, rgba(255,170,210,.5), transparent 55%),
    linear-gradient(165deg,#fff0f6 0%,#ffe3f0 50%,#ffeaf6 100%);
}
/* on dark rooms, make footer/nav text legible by keeping windows light (default) */

/* ============================================================
   KEYFRAMES
   ============================================================ */
@keyframes blink{50%{opacity:.25;}}
@keyframes marquee{to{transform:translateX(-100%);}}
@keyframes g1{0%,92%,100%{clip-path:inset(0 0 100% 0);}93%{clip-path:inset(10% 0 60% 0);}96%{clip-path:inset(70% 0 8% 0);}}
@keyframes g2{0%,90%,100%{clip-path:inset(100% 0 0 0);}91%{clip-path:inset(40% 0 35% 0);}97%{clip-path:inset(5% 0 80% 0);}}
@keyframes wiggle{0%,100%{transform:rotate(0) scale(1);}25%{transform:rotate(-7deg) scale(1.08);}75%{transform:rotate(7deg) scale(1.08);}}
@keyframes pop{from{transform:scale(.85);opacity:0;}to{transform:scale(1);opacity:1;}}
@keyframes bounce{0%,60%,100%{transform:translateY(0);}30%{transform:translateY(-6px);}}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes prog{from{width:6%;}to{width:96%;}}
@keyframes twinkle{0%,100%{opacity:.2;transform:scale(.7);}50%{opacity:1;transform:scale(1.3);}}
@keyframes breathe{0%,100%{transform:scale(.82);}50%{transform:scale(1.12);}}
@keyframes float1{0%,100%{transform:translateY(0) rotate(-4deg);}50%{transform:translateY(-20px) rotate(4deg);}}
@keyframes float2{0%,100%{transform:translateY(0) rotate(3deg);}50%{transform:translateY(-24px) rotate(-3deg);}}
@keyframes floatS{0%,100%{transform:translateY(0);}50%{transform:translateY(-15px);}}
@keyframes rise{0%{transform:translateY(20px) rotate(0);opacity:0;}10%{opacity:.85;}90%{opacity:.85;}100%{transform:translateY(-80vh) rotate(40deg);opacity:0;}}
@keyframes toastIn{from{transform:translateX(40px);opacity:0;}to{transform:translateX(0);opacity:1;}}
@keyframes toastOut{to{transform:translateX(40px);opacity:0;height:0;margin:0;padding-top:0;padding-bottom:0;}}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px){
  .row.side,.row.side-r,.row.two,.row.three{grid-template-columns:1fr;}
  .botgrid{grid-template-columns:1fr;}
  .hero__grid{grid-template-columns:1fr;}
  .hero__art{border-right:none;border-bottom:2px solid #6b2350;min-height:230px;}
  .win--night .hero__art{border-right:none;border-bottom-color:#5a3aa0;}
  .shrines{grid-template-columns:repeat(2,1fr);}
  .gal-grid{grid-template-columns:repeat(3,1fr);}
  .boards{grid-template-columns:1fr;}
  .topic-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:560px){
  .stage{padding:42px 12px 80px;}
  .shrines{grid-template-columns:1fr;}
  .gal-grid{grid-template-columns:repeat(2,1fr);}
  .topic-grid{grid-template-columns:repeat(2,1fr);}
  .tb-start .lbl{display:none;}
  .entry .edate{width:58px;font-size:13px;}
  .float-sticker,.emoji{display:none;}
  .foot__in{flex-direction:column;align-items:flex-start;}
  .hero__panel{padding:20px 18px;}
}
@media (max-width:390px){
  .gal-grid{grid-template-columns:repeat(2,1fr);}
  .tabs{gap:6px;padding:10px;}
  .tab{padding:7px 9px;font-size:13px;}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;}
  .tb-ticker span{padding-left:0;}
}

/* dim / night veil (cozy) */
.nightveil{position:fixed;inset:0;z-index:8500;pointer-events:none;opacity:0;transition:opacity .6s;
  background:radial-gradient(120% 100% at 50% 120%, rgba(40,20,80,.2), rgba(8,4,20,.78));mix-blend-mode:multiply;}
body.dimmed .nightveil{opacity:1;}
/* tiny win-today card */
.tiny-win{display:flex;align-items:center;gap:13px;}
.tiny-win .tw-orb{width:48px;height:48px;flex:none;border-radius:12px;display:grid;place-items:center;font-size:24px;color:#fff;
  background:linear-gradient(160deg,#ffd166,#ff9f43);box-shadow:0 3px 0 rgba(180,100,20,.3);}
.lab-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:11px;}
.lab{padding:12px;border-radius:11px;text-align:center;background:linear-gradient(180deg,#fff,#f3f7ff);border:2px solid #2a3f6b;box-shadow:0 4px 0 rgba(30,50,100,.16);}
.lab .lco{font-size:26px;} .lab b{font-family:var(--disp);font-size:15px;color:#15203a;display:block;margin-top:5px;} .lab span{font-family:var(--term);font-size:14px;color:#4a6aa0;}

/* ============================================================
   ACADEMY POLISH — formula shrine interactions
   Added: collapsible hint + formula summon shelf
   ============================================================ */
.formula-shrine-window{box-shadow:0 0 0 2px rgba(127,227,255,.24),0 18px 40px rgba(0,0,0,.22),0 0 44px rgba(127,227,255,.15);}
.academy-sigil{position:absolute;z-index:0;pointer-events:none;font-family:var(--disp);font-size:92px;line-height:1;color:rgba(127,227,255,.11);filter:drop-shadow(0 0 18px rgba(127,227,255,.2));}
.academy-sigil--one{right:9%;top:56px;transform:rotate(-10deg);}
.academy-sigil--two{left:5%;bottom:24px;transform:rotate(12deg);color:rgba(191,240,94,.11);}
.hint-box{width:min(720px,100%);margin-top:2px;border-radius:13px;overflow:hidden;border:2px solid rgba(127,227,255,.42);background:linear-gradient(180deg,rgba(127,227,255,.08),rgba(255,111,179,.06));box-shadow:0 4px 0 rgba(0,0,0,.18),0 0 20px rgba(127,227,255,.10);}
.hint-row{appearance:none;width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;cursor:pointer;border:0;background:linear-gradient(90deg,rgba(22,35,68,.92),rgba(33,25,72,.90));font-family:var(--pixel);font-size:8px;line-height:1.4;color:#cfe9ff;text-align:left;letter-spacing:.4px;}
.hint-row:hover{background:linear-gradient(90deg,rgba(35,54,96,.96),rgba(55,35,100,.96));}
.hint-open{display:inline-flex;align-items:center;gap:7px;flex:none;color:#fff;padding:5px 9px;border-radius:999px;background:linear-gradient(160deg,var(--sick-pink),var(--lav));box-shadow:0 2px 0 rgba(0,0,0,.18);}
.hint-open b{font-style:normal;font-family:var(--pixel);font-size:9px;line-height:1;}
.hint-open em{font-style:normal;font-family:var(--pixel);font-size:7px;}
.hint-content{max-height:0;opacity:0;transform:translateY(-7px);overflow:hidden;transition:max-height .35s ease, opacity .24s ease, transform .24s ease;}
.hint-box.is-open .hint-content{max-height:260px;opacity:1;transform:translateY(0);}
.hint-box.is-open .hint-open{background:linear-gradient(160deg,#7fe3ff,#5a8cff);}
.hint-panel{position:relative;margin:0;padding:13px 14px 15px;background:radial-gradient(110% 130% at 90% 0%,rgba(255,111,179,.13),transparent 42%),linear-gradient(180deg,rgba(12,18,38,.92),rgba(8,12,28,.96));border-top:1px solid rgba(127,227,255,.28);color:#dfe9ff;}
.hint-panel::after{content:"♡ ✦ ♡";position:absolute;right:13px;top:10px;font-family:var(--pixel);font-size:7px;color:rgba(255,111,179,.85);}
.hint-terminal{display:inline-flex;margin-bottom:9px;padding:4px 7px;border-radius:8px;background:rgba(127,227,255,.12);border:1px solid rgba(127,227,255,.32);font-family:var(--pixel);font-size:7px;color:#9fe0ff;letter-spacing:.7px;}
.hint-eq{font-family:var(--disp);font-size:clamp(20px,3vw,30px);color:#fff;text-shadow:0 0 14px rgba(127,227,255,.35);}
.hint-answer{font-family:var(--term);font-size:18px;color:#bff05e;margin-top:4px;}
.hint-panel p{font-size:13.5px;line-height:1.65;color:#cbd8ff;margin-top:6px;max-width:620px;}
.hint-panel b{color:#fff;}
.shelf-sectit{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.formula-window .win__body{background:radial-gradient(120% 90% at 100% 0%,rgba(127,227,255,.18),transparent 38%),linear-gradient(180deg,#fff,#f4f8ff);}
.summoned-wrap{margin-bottom:14px;}
.summoned-wrap[hidden]{display:none;}
.summoned-card{position:relative;padding:15px 15px 14px;border-radius:14px;border:2px solid #2a3f6b;background:radial-gradient(120% 150% at 90% 0%,rgba(255,111,179,.26),transparent 42%),linear-gradient(180deg,#18264c,#101a36);box-shadow:0 6px 0 rgba(20,40,90,.25),0 0 24px rgba(127,227,255,.23);overflow:hidden;animation:summonPop .34s ease;}
.summoned-card::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px);}
.summoned-card::after{content:"✦";position:absolute;right:18px;bottom:10px;font-family:var(--disp);font-size:68px;color:rgba(127,227,255,.10);}
.summoned-top,.summoned-title,.summoned-formula,.summoned-note,.summoned-actions{position:relative;z-index:1;}
.summoned-top{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:9px;}
.sub-badge,.topic-badge,.rarity-badge{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;font-family:var(--pixel);font-size:7px;color:#fff;border:1px solid rgba(255,255,255,.45);box-shadow:0 2px 0 rgba(0,0,0,.18);}
.sub-badge{background:linear-gradient(160deg,var(--sick-pink),var(--lav));}
.topic-badge{background:rgba(127,227,255,.16);color:#cfe9ff;}
.rarity-badge{background:linear-gradient(160deg,#bff05e,#5ee0a0);color:#15203a;}
.summoned-title{font-family:var(--pixel);font-size:8px;color:#9fe0ff;letter-spacing:.6px;text-transform:uppercase;margin-bottom:6px;}
.summoned-formula{font-family:var(--disp);font-size:clamp(24px,4vw,38px);color:#fff;text-shadow:0 0 18px rgba(127,227,255,.45);line-height:1.25;}
.summoned-note{font-family:var(--term);font-size:18px;color:#cbd8ff;margin-top:5px;}
.summoned-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:13px;}
.formula-shelf{align-items:stretch;}
.fcard{position:relative;min-height:112px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;}
.fcard::after{content:"";position:absolute;inset:auto -25px -38px auto;width:92px;height:92px;border-radius:50%;background:rgba(127,227,255,.12);}
.fcard .ficon{position:absolute;right:9px;top:8px;font-family:var(--disp);font-size:20px;color:rgba(42,63,107,.32);z-index:1;}
.fcard .feq{position:relative;z-index:1;font-size:clamp(19px,2.3vw,24px);line-height:1.15;padding-right:20px;}
.fcard .fname{position:relative;z-index:1;line-height:1.45;text-transform:lowercase;}
.fcard.saved{animation:saveGlow .55s ease;}
.fcard.summoned-copy{border-color:var(--sick-pink);background:linear-gradient(180deg,#fff,#fff2fa);}
@keyframes summonPop{0%{opacity:0;transform:translateY(-10px) scale(.94);filter:brightness(1.4);}70%{opacity:1;transform:translateY(2px) scale(1.02);}100%{transform:translateY(0) scale(1);}}
@keyframes saveGlow{0%,100%{box-shadow:0 4px 0 rgba(30,50,100,.18);}50%{box-shadow:0 0 0 3px rgba(255,79,158,.22),0 0 24px rgba(255,79,158,.45),0 4px 0 rgba(30,50,100,.18);}}
@media (max-width:560px){
  .hint-row{align-items:flex-start;flex-direction:column;font-size:7.5px;}
  .hint-open{align-self:flex-start;}
  .summoned-actions{flex-direction:column;align-items:stretch;}
  .summoned-actions .btn{justify-content:center;}
  .formula-shelf{grid-template-columns:1fr;}
  .academy-sigil{display:none;}
}

/* ============================================================
   ACADEMY HARD MODE — real study terminal upgrade
   ============================================================ */
.academy-stage{max-width:1240px;}
.academy-hero .hero-hard-body{position:relative;z-index:1;display:grid;grid-template-columns:1.08fr .92fr;gap:18px;align-items:stretch;padding:24px;}
.academy-title{color:#fff;font-size:clamp(28px,5vw,50px);line-height:1;text-shadow:0 0 18px rgba(127,227,255,.45),0 0 30px rgba(255,79,158,.24);}
.academy-lead{max-width:680px;color:#cbd8ff;font-size:15px;line-height:1.7;margin-top:12px;}
.academy-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}
.hero-hard-left{min-width:0;}
.hero-hard-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;align-content:start;padding:14px;border-radius:16px;background:linear-gradient(180deg,rgba(7,14,32,.64),rgba(10,18,42,.88));border:2px solid rgba(127,227,255,.32);box-shadow:0 0 28px rgba(127,227,255,.12) inset,0 7px 0 rgba(0,0,0,.22);}
.hard-stat{min-height:78px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:10px 8px;border-radius:12px;background:radial-gradient(120% 140% at 50% 0%,rgba(255,111,179,.18),transparent 55%),linear-gradient(180deg,rgba(255,255,255,.06),rgba(127,227,255,.06));border:1.5px solid rgba(127,227,255,.28);}
.hard-stat b{font-family:var(--disp);font-size:clamp(22px,3vw,32px);line-height:1;color:#fff;text-shadow:0 0 14px rgba(127,227,255,.45);}
.hard-stat span{font-family:var(--pixel);font-size:6.5px;color:#9fe0ff;line-height:1.4;margin-top:6px;letter-spacing:.45px;}
.xp-track{grid-column:1/-1;height:14px;border-radius:9px;overflow:hidden;background:#090e22;border:1.5px solid rgba(127,227,255,.42);box-shadow:0 1px 0 rgba(255,255,255,.18) inset;}
.xp-track i{display:block;height:100%;width:0%;border-radius:9px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 4px,transparent 4px 8px),linear-gradient(90deg,var(--sick-pink),var(--cyan),var(--toxic));transition:.35s;}
.hero-mini-note{grid-column:1/-1;font-family:var(--term);font-size:15px;color:#b8caff;text-align:center;}

.academy-dashboard .win__body{background:radial-gradient(120% 90% at 100% 0%,rgba(127,227,255,.15),transparent 42%),linear-gradient(180deg,#fff,#f5f8ff);}
.dash-grid{display:grid;grid-template-columns:.92fr .8fr 1.28fr;gap:14px;}
.dash-card{position:relative;padding:14px;border-radius:13px;border:2px solid #2a3f6b;background:linear-gradient(180deg,#fff,#f4f8ff);box-shadow:0 5px 0 rgba(30,50,100,.15);overflow:hidden;}
.dash-card::after{content:"";position:absolute;right:-26px;bottom:-34px;width:95px;height:95px;border-radius:50%;background:rgba(127,227,255,.12);pointer-events:none;}
.dash-title{position:relative;z-index:1;font-family:var(--pixel);font-size:8px;letter-spacing:.7px;color:#244072;margin-bottom:10px;}
.ritual-meter{position:relative;height:22px;border-radius:13px;background:#101a36;border:2px solid #2a3f6b;overflow:hidden;margin-bottom:11px;box-shadow:0 2px 0 rgba(255,255,255,.28) inset;}
.ritual-meter i{display:block;height:100%;width:0%;background:repeating-linear-gradient(90deg,rgba(255,255,255,.38) 0 5px,transparent 5px 10px),linear-gradient(90deg,#ff2e88,#7fe3ff,#bff05e);transition:.32s;}
.ritual-meter span{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--pixel);font-size:7px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);}
.ritual-list{display:flex;flex-direction:column;gap:7px;position:relative;z-index:1;}
.ritual-item{display:grid;grid-template-columns:26px 1fr auto;gap:8px;align-items:center;padding:8px 9px;border-radius:10px;background:#fff;border:1.5px dashed #aac6ef;color:#244072;}
.ritual-item.done{border-style:solid;background:linear-gradient(180deg,#eafff3,#f4fff8);border-color:#67d58a;}
.ritual-item .rcheck{font-family:var(--pixel);font-size:9px;color:var(--sick-pink);}
.ritual-item b{font-family:var(--disp);font-size:15px;color:#15203a;line-height:1.1;}
.ritual-item em{font-family:var(--term);font-size:14px;color:#4a6aa0;font-style:normal;text-align:right;}
.focus-timer{font-family:var(--disp);font-size:clamp(38px,7vw,64px);line-height:1;color:#15203a;text-align:center;text-shadow:0 0 18px rgba(127,227,255,.25);margin:7px 0 9px;position:relative;z-index:1;}
.timer-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1;}
.timer-card p{font-family:var(--term);font-size:15px;color:#4a6aa0;margin-top:10px;text-align:center;position:relative;z-index:1;}
.filter-block{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:9px;position:relative;z-index:1;}
.filter-block:last-child{margin-bottom:0;}
.filter-block b{width:62px;flex:none;font-family:var(--pixel);font-size:7px;color:#244072;}
.filter-block button{font-family:var(--disp);font-size:14px;color:#25406f;background:#fff;border:1.5px solid #9fc0ff;border-radius:14px;padding:5px 9px;box-shadow:0 2px 0 rgba(30,50,100,.13);transition:.1s;}
.filter-block button:hover{transform:translateY(-2px);border-color:var(--cyan);}
.filter-block button.sel{background:linear-gradient(160deg,var(--cyan),#5a8cff);color:#fff;border-color:#2a3f6b;}

.academy-practice-row{grid-template-columns:1.25fr .75fr;}
.practice-terminal .win__body{background:radial-gradient(120% 100% at 100% 0%,rgba(255,111,179,.15),transparent 42%),linear-gradient(180deg,#101a36,#0b1128);color:#dfe9ff;}
.task-badges{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px;}
.task-badges span{font-family:var(--pixel);font-size:7px;color:#fff;border:1px solid rgba(255,255,255,.45);border-radius:999px;padding:5px 8px;background:rgba(127,227,255,.12);box-shadow:0 2px 0 rgba(0,0,0,.2);}
.task-badges span:nth-child(1){background:linear-gradient(160deg,var(--sick-pink),var(--lav));}
.task-badges span:nth-child(5){background:linear-gradient(160deg,#bff05e,#5ee0a0);color:#102036;}
.task-question{font-family:var(--disp);font-size:clamp(24px,4vw,42px);line-height:1.24;color:#fff;min-height:96px;display:flex;align-items:center;text-shadow:0 0 18px rgba(127,227,255,.42);margin:6px 0 14px;}
.answer-line{display:flex;gap:10px;align-items:center;}
.task-input{font-size:18px !important;background:#eaf6ff !important;border-color:#7fe3ff !important;color:#101a36 !important;}
.task-feedback{margin-top:12px;min-height:38px;padding:10px 12px;border-radius:11px;border:1.5px solid rgba(127,227,255,.25);background:rgba(127,227,255,.08);font-family:var(--term);font-size:18px;color:#cbd8ff;}
.task-feedback.good{border-color:#7ee0a0;background:rgba(126,224,160,.13);color:#bfffd1;box-shadow:0 0 18px rgba(126,224,160,.18);}
.task-feedback.bad{border-color:#ff5a8a;background:rgba(255,46,110,.13);color:#ffc6d5;box-shadow:0 0 18px rgba(255,46,110,.18);}
.task-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.micro-panel{display:none;margin-top:11px;padding:11px 12px;border-radius:11px;border:1.5px solid rgba(127,227,255,.32);background:rgba(127,227,255,.09);font-family:var(--term);font-size:18px;color:#cfe9ff;}
.micro-panel.show{display:block;animation:pop .18s ease;}
.micro-panel b{display:block;font-family:var(--pixel);font-size:7px;color:#9fe0ff;margin-bottom:5px;}
.micro-panel.solution{background:rgba(191,240,94,.08);border-color:rgba(191,240,94,.3);color:#eaffc0;}

.mistake-window .win__body{background:linear-gradient(180deg,#fff,#fff2fa);}
.bank-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;font-family:var(--term);font-size:16px;color:var(--mut);}
.bank-head b{font-family:var(--disp);font-size:16px;color:var(--void);}
.mistake-bank{display:flex;flex-direction:column;gap:9px;max-height:438px;overflow:auto;padding-right:4px;}
.empty-bank{font-family:var(--term);font-size:18px;color:var(--mut);padding:18px;border:2px dashed #ffc1dd;border-radius:12px;text-align:center;}
.mistake-item{display:flex;align-items:center;gap:10px;justify-content:space-between;padding:10px;border-radius:11px;background:#fff;border:2px solid #ffb3da;box-shadow:0 3px 0 rgba(120,30,80,.12);}
.mistake-item div{min-width:0;}
.mistake-item b{display:block;font-family:var(--pixel);font-size:7px;color:var(--sick-pink);letter-spacing:.4px;margin-bottom:3px;}
.mistake-item span{display:block;font-family:var(--disp);font-size:14px;color:var(--void);line-height:1.2;}
.mistake-item em{display:block;font-family:var(--term);font-size:14px;color:var(--mut);font-style:normal;margin-top:3px;}

.compact-daily .win__body{position:relative;z-index:1;padding:18px;}
.mastery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;}
.mastery-card{padding:11px;border-radius:12px;border:2px solid #2a3f6b;background:linear-gradient(180deg,#fff,#f4f8ff);box-shadow:0 4px 0 rgba(30,50,100,.14);}
.mc-top{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.mc-top b{font-family:var(--disp);font-size:16px;color:#15203a;}
.mc-top span{font-family:var(--pixel);font-size:6px;color:#4a6aa0;}
.mc-bar{height:12px;border-radius:8px;overflow:hidden;background:#e3ecff;border:1.5px solid #2a3f6b;margin-top:9px;}
.mc-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--sick-pink),var(--cyan));}
.mc-foot{font-family:var(--term);font-size:15px;color:#4a6aa0;margin-top:5px;}
.theory-stack{display:flex;flex-direction:column;gap:10px;}
.theory-card{position:relative;padding:12px;border-radius:12px;border:2px solid #6b2350;background:linear-gradient(180deg,#fff,#fff1f8);cursor:pointer;box-shadow:0 4px 0 rgba(120,30,80,.14);transition:.12s;}
.theory-card:hover{transform:translateY(-2px);border-color:var(--sick-pink);}
.theory-card b{font-family:var(--disp);font-size:17px;color:var(--void);display:block;}
.theory-card span{display:block;font-size:13px;color:var(--mut);margin-top:4px;}
.theory-card em{display:none;margin-top:8px;padding:8px;border-radius:9px;background:#111b38;color:#cfe9ff;font-family:var(--disp);font-size:17px;font-style:normal;}
.theory-card.open em{display:block;animation:pop .16s ease;}

.topic{border:2px solid #6b2350;font-family:inherit;}
.topic.sel{outline:3px solid #fff;box-shadow:0 0 0 4px var(--cyan),0 5px 0 rgba(120,30,80,.18);}
.modal.open{display:grid;}

@media (max-width:980px){
  .academy-hero .hero-hard-body,.dash-grid,.academy-practice-row{grid-template-columns:1fr;}
  .hero-hard-stats{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:620px){
  .academy-hero .hero-hard-body{padding:16px;}
  .hero-hard-stats{grid-template-columns:repeat(2,1fr);}
  .answer-line{flex-direction:column;align-items:stretch;}
  .answer-line .btn{justify-content:center;}
  .task-actions,.academy-actions,.timer-actions{flex-direction:column;align-items:stretch;}
  .task-actions .btn,.academy-actions .btn,.timer-actions .btn{justify-content:center;}
  .ritual-item{grid-template-columns:22px 1fr;}
  .ritual-item em{grid-column:2;text-align:left;}
  .filter-block b{width:100%;}
  .mastery-grid{grid-template-columns:1fr;}
  .task-question{min-height:auto;}
}


/* ============================================================
   USER UPLOAD ASSETS — extra KAngel avatars/decor
   ============================================================ */
.custom-float-kangel{
  position:fixed;z-index:2;pointer-events:none;
  filter:drop-shadow(0 8px 14px rgba(255,79,158,.35)) drop-shadow(0 0 10px rgba(127,227,255,.25));
}
.custom-float-kangel img{width:100%;height:auto;border-radius:18px;border:2px solid rgba(255,255,255,.75);background:rgba(255,255,255,.34);}

.academy-guardian-card{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:112px 1fr;
  gap:12px;
  align-items:center;
  min-height:118px;
  padding:10px;
  border-radius:15px;
  border:1.5px solid rgba(255,231,66,.78);
  background:
    radial-gradient(110% 140% at 10% 0%,rgba(255,231,66,.35),transparent 48%),
    linear-gradient(135deg,rgba(255,46,110,.20),rgba(127,227,255,.09));
  box-shadow:0 0 22px rgba(255,231,66,.14),0 5px 0 rgba(0,0,0,.16);
  overflow:hidden;
}
.academy-guardian-card img{
  width:112px;height:96px;object-fit:cover;object-position:center 18%;
  border-radius:12px;border:2px solid rgba(255,255,255,.85);
  box-shadow:0 0 0 2px rgba(255,46,110,.35),0 8px 18px rgba(0,0,0,.22);
}
.academy-guardian-card b{
  display:block;font-family:var(--pixel);font-size:8px;letter-spacing:.7px;color:#ffe742;
  text-shadow:0 0 12px rgba(255,231,66,.42);
}
.academy-guardian-card span{
  display:block;margin-top:6px;font-family:var(--term);font-size:17px;line-height:1.25;color:#dfe9ff;
}

.academy-art-strip{
  display:grid;
  grid-template-columns:1.1fr .9fr .82fr;
  gap:14px;
}
.art-relic{overflow:hidden;}
.art-relic .win__bar{border-bottom:2px solid #6b2350;}
.art-relic__img{
  height:230px;
  background:linear-gradient(180deg,#15102e,#241a4d);
  overflow:hidden;
}
.art-relic--wide .art-relic__img{height:300px;}
.art-relic__img img{width:100%;height:100%;object-fit:cover;display:block;}
.art-relic--wide .art-relic__img img{object-position:center 22%;}
.art-relic:nth-child(2) .art-relic__img img{object-position:center 25%;}
.art-relic__cap{
  padding:10px 12px;
  font-family:var(--term);
  font-size:16px;
  color:var(--mut);
  background:linear-gradient(180deg,#fff,#fff2fa);
  border-top:2px solid #ffc1dd;
}
.mini-avatar-stack .art-relic__img{height:auto;padding:14px;background:linear-gradient(180deg,#fff,#fff2fa);}
.mini-avatar-row{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
}
.mini-avatar-row img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:14px;
  border:2px solid #fff;
  outline:2px solid #6b2350;
  box-shadow:0 5px 0 rgba(120,30,80,.15);
  background:#241a4d;
}

.academy-float-kangel{
  position:fixed;
  right:18px;
  bottom:84px;
  width:82px;
  z-index:3;
  pointer-events:none;
  animation:float1 8s ease-in-out infinite;
  filter:drop-shadow(0 8px 12px rgba(0,0,0,.32)) drop-shadow(0 0 12px rgba(255,111,179,.45));
}
.academy-float-kangel img{
  width:100%;
  border-radius:18px;
  border:2px solid rgba(255,255,255,.75);
  background:rgba(255,255,255,.35);
}

.frame img[src*="user_uploads"], .frame img[src*="av1"]{
  image-rendering:auto;
}

@media (max-width:980px){
  .academy-art-strip{grid-template-columns:1fr;}
  .academy-guardian-card{grid-template-columns:86px 1fr;}
  .academy-guardian-card img{width:86px;height:86px;}
}
@media (max-width:560px){
  .academy-float-kangel,.custom-float-kangel{display:none;}
  .academy-guardian-card{grid-template-columns:1fr;text-align:center;}
  .academy-guardian-card img{width:100%;height:150px;}
  .art-relic__img,.art-relic--wide .art-relic__img{height:240px;}
}

/* ============================================================
   FIXES — overflow + floating cut-out stickers
   ============================================================ */
/* sticker "tag" used to be clipped by .win overflow:hidden — let it poke
   out again while keeping the window's rounded corners clean */
.win:has(> .tag){overflow:visible;}
.win:has(> .tag) > .win__bar{border-radius:9px 9px 0 0;}
.win:has(> .tag) > .win__body:last-child{border-radius:0 0 9px 9px;}
.win:has(> .tag) > .hero__grid{border-radius:0 0 9px 9px;overflow:hidden;}

/* transparent PNG cut-out decorations (profile) — were unstyled and
   dropped into normal flow at the bottom of the page */
.float-cut{position:fixed;z-index:6;pointer-events:none;
  filter:drop-shadow(3px 6px 6px rgba(120,30,90,.4));}
.float-cut img{width:100%;height:auto;image-rendering:auto;}
@media (max-width:560px){
  .float-cut{display:none;}
}