/* ===== GRAY AREAS: PROJECT SHENZHEN — cyberpunk sketch aesthetic ===== */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800;900&display=swap');

:root{
  --void:#0b0714;
  --base:#140b22;
  --panel: rgba(24,14,40,0.62);
  --panel-solid:#1b1030;
  --border-glass: rgba(210,180,255,0.16);
  --sketch: rgba(243,236,251,0.35);

  --neon-pink:#ff4fd8;
  --neon-magenta:#e94ff5;
  --neon-purple:#9b5cff;
  --neon-violet:#7c4dff;
  --neon-blue:#4fa3ff;
  --neon-sky:#38bdf8;
  --neon-cyan:#3ad6e0;

  --text-hi:#f3ecfb;
  --text-mid:#b8a9d6;
  --text-low:#79688f;

  --font-main:'Orbitron', system-ui, sans-serif;
  --font-display:var(--font-main);
  --font-body:var(--font-main);
  --font-data:var(--font-main);
  --font-voice:var(--font-main);
  --font-sketch:var(--font-main);

  --radius-card:4px;
  --radius-pill:999px;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--void);
  color:var(--text-hi);
  font-family:var(--font-main);
  font-weight:500;
  letter-spacing:0.04em;
  line-height:1.5;
  min-height:100vh;
  overflow-x:hidden;
}

.hidden{display:none !important;}

/* ===== Backdrop & skyline ===== */
#backdrop{position:fixed;inset:0;z-index:0;pointer-events:none;}
#backdrop .glow{position:absolute;inset:0;}
#backdrop .glow.a{background:radial-gradient(circle at 12% 8%,rgba(233,79,245,0.18),transparent 48%);}
#backdrop .glow.b{background:radial-gradient(circle at 88% 5%,rgba(79,163,255,0.14),transparent 45%);}
#backdrop .glow.c{background:radial-gradient(circle at 50% 100%,rgba(155,92,255,0.2),transparent 58%);}
#backdrop .grain{
  position:absolute;inset:0;opacity:0.06;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
#backdrop .rain{
  position:absolute;inset:0;opacity:0.04;
  background:repeating-linear-gradient(115deg,transparent,transparent 80px,rgba(79,163,255,0.15) 81px,transparent 82px);
  animation:rainDrift 8s linear infinite;
}
@keyframes rainDrift{from{background-position:0 0;}to{background-position:-120px 400px;}}

#skyline{
  position:absolute;bottom:0;left:0;width:100%;height:72vh;min-height:420px;
  opacity:0.88;
}
#skyline .bld{fill:#141018;}
#skyline .bld-alt{fill:#0f0a16;}
#skyline .win{opacity:0.35;}
#skyline .neon-sign{
  font-family:var(--font-data);font-size:7px;letter-spacing:0.08em;
  filter:drop-shadow(0 0 4px currentColor);
}
#skyline .neon-bar{filter:drop-shadow(0 0 6px currentColor);}

/* ===== Loading — UK → Shenzhen → Gray Areas ===== */
#loading{
  position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;
  background:#06040c;transition:opacity 0.7s ease;overflow:hidden;
}
#loading.is-dismissed{opacity:0;pointer-events:none;}

.intro-journey{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:22px;padding:24px;transition:opacity 0.7s ease, transform 0.7s ease;
}
.intro-journey.out{opacity:0;transform:scale(0.98);pointer-events:none;}

.intro-places{
  position:relative;width:min(90vw,480px);min-height:3.2em;
  display:flex;align-items:center;justify-content:center;
}

.intro-place{
  position:absolute;left:0;right:0;margin:0;font-family:var(--font-display);
  font-size:clamp(24px,5.5vw,44px);font-weight:800;letter-spacing:0.16em;
  text-transform:uppercase;text-align:center;
  transition:opacity 0.55s ease, transform 0.55s ease;
}
.intro-place-uk{
  color:#e8e4e0;opacity:1;transform:translateY(0);
}
.intro-place-uk.out{opacity:0;transform:translateY(-18px);}
.intro-place-sz{
  color:var(--neon-cyan);opacity:0;transform:translateY(18px);
  text-shadow:0 0 28px rgba(58,214,224,0.45);
}
.intro-place-sz.in{opacity:1;transform:translateY(0);}

.intro-travel{
  width:min(72vw,340px);height:28px;position:relative;opacity:0;
  transition:opacity 0.35s ease;
}
.intro-travel.active{opacity:1;}
.intro-travel-track{
  position:absolute;left:0;right:0;top:50%;height:2px;transform:translateY(-50%);
  background:linear-gradient(90deg,rgba(232,228,224,0.15),rgba(58,214,224,0.35));
  border-radius:2px;
}
.intro-travel-marker{
  position:absolute;top:50%;left:0;width:10px;height:10px;border-radius:50%;
  transform:translate(-50%,-50%);background:var(--neon-cyan);
  box-shadow:0 0 16px rgba(58,214,224,0.8);
  opacity:0;
}
.intro-travel.active .intro-travel-marker{
  opacity:1;
  animation:introTravelMarker 1.15s cubic-bezier(0.45,0,0.2,1) forwards;
}
@keyframes introTravelMarker{
  from{left:0;}
  to{left:100%;}
}

.loading-brand{
  text-align:center;padding:24px;opacity:0;transform:scale(0.92);
  transition:opacity 0.85s ease, transform 0.85s ease;
}
.loading-brand.in{opacity:1;transform:scale(1);}
.loading-title{
  margin:0;font-family:var(--font-main);font-size:clamp(32px,7vw,56px);font-weight:800;
  letter-spacing:0.12em;color:var(--neon-pink);
  text-shadow:0 0 28px rgba(255,79,216,0.45);
}
.loading-sub{
  margin:10px 0 0;font-size:11px;letter-spacing:0.28em;text-transform:uppercase;
  color:var(--neon-cyan);opacity:0.85;
}
.loading-url{
  margin:8px 0 0;font-size:10px;letter-spacing:0.04em;text-transform:none;opacity:0;
  transition:opacity 0.5s ease;
}
.loading-url a{color:var(--neon-cyan);text-decoration:none;border-bottom:1px dashed rgba(58,214,224,0.35);}
.loading-brand.in .loading-url{opacity:0.75;}
.intro-enter-btn{
  margin-top:18px;letter-spacing:0.14em;text-transform:uppercase;font-size:12px;
  opacity:0;pointer-events:none;transition:opacity 0.4s ease;
}
.loading-brand.in .intro-enter-btn{
  opacity:1;pointer-events:auto;
}

.boot-error{
  position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  padding:24px;text-align:center;background:rgba(11,7,20,0.94);
  font-size:14px;line-height:1.6;color:var(--text-hi);
}
.boot-error.hidden{display:none !important;}
.boot-error-inner{max-width:420px;display:flex;flex-direction:column;gap:16px;align-items:center;}
.boot-error a{color:var(--neon-cyan);}
body:not(.is-editing) .edit-when-editing{display:none !important;}
body.is-editing .edit-when-editing.card-edit-front,
body.is-editing .card-edit-front.edit-when-editing{display:inline-block !important;}

.intro-vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 100px rgba(0,0,0,0.45);z-index:6;}

.intro-text-wrap{
  position:absolute;left:50%;top:18%;transform:translateX(-50%);
  z-index:7;display:flex;flex-direction:column;align-items:center;
}

.intro-place-name{
  font-family:var(--font-display);font-size:clamp(28px,6vw,48px);font-weight:800;
  letter-spacing:0.14em;text-transform:uppercase;color:#f0e8e4;
  text-shadow:0 2px 30px rgba(0,0,0,0.6);
  transition:opacity 0.4s ease,transform 0.4s ease;
}
.intro-place-name.fade{opacity:0;transform:translateY(10px);}
#loading.phase-sz .intro-place-name{color:var(--neon-cyan);text-shadow:0 0 30px rgba(58,214,224,0.5);}

.intro-brand{
  font-family:var(--font-display);font-size:clamp(24px,5vw,40px);font-weight:800;
  margin-top:8px;
  background:linear-gradient(90deg,var(--neon-pink),var(--neon-cyan));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:brandReveal 0.8s ease forwards;
}
.intro-brand.hidden{display:none;}
@keyframes brandReveal{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}

.skip-btn{
  position:absolute;top:20px;right:20px;z-index:8;
  background:rgba(0,0,0,0.35);border:1px solid rgba(255,255,255,0.15);
  color:var(--text-mid);font-size:22px;line-height:1;
  width:40px;height:40px;padding:0;border-radius:50%;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.skip-btn:hover{border-color:var(--neon-cyan);color:var(--neon-cyan);}

/* ===== App shell ===== */
#app{
  position:relative;z-index:1;max-width:1180px;margin:0 auto;
  padding:26px 20px 110px;display:flex;gap:28px;
}

.sidebar{width:230px;flex-shrink:0;}
.brand{margin-bottom:22px;}
.brand .name{
  font-family:var(--font-display);font-size:clamp(28px,4vw,36px);font-weight:800;
  background:linear-gradient(90deg,var(--neon-pink),var(--neon-blue));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  cursor:default;user-select:none;letter-spacing:0.06em;line-height:1.1;
}

.edit-toast{
  position:fixed;bottom:28px;left:50%;transform:translateX(-50%);
  z-index:80;padding:10px 22px;font-family:var(--font-data);font-size:12px;
  letter-spacing:0.12em;text-transform:uppercase;color:var(--neon-cyan);
  border:1px solid var(--neon-cyan);background:rgba(11,7,20,0.92);
  box-shadow:0 0 24px rgba(58,214,224,0.25);
  animation:toastIn 0.35s ease;
}
@keyframes toastIn{
  from{opacity:0;transform:translateX(-50%) translateY(10px);}
  to{opacity:1;transform:translateX(-50%) translateY(0);}
}
.brand .sub{font-size:10px;color:var(--text-low);font-family:var(--font-data);letter-spacing:0.14em;margin-top:2px;}

/* ===== Sketch title treatment ===== */
.sketch-title{
  position:relative;display:inline-block;
  font-family:var(--font-display);
}
.sketch-title::after{
  content:'';position:absolute;left:-4px;right:-6px;bottom:2px;height:8px;
  background:linear-gradient(90deg,rgba(255,79,216,0.25),rgba(79,163,255,0.2));
  transform:skewX(-8deg) rotate(-0.5deg);z-index:-1;
}

/* ===== Node nav ===== */
.node-nav{position:relative;display:flex;flex-direction:column;padding-left:2px;}
.node-nav::before{
  content:'';position:absolute;left:9px;top:20px;bottom:20px;width:2px;
  background:linear-gradient(180deg,var(--neon-pink),var(--neon-purple),var(--neon-blue),var(--neon-cyan));
  opacity:0.35;
}
.node-btn{
  position:relative;display:flex;align-items:center;gap:12px;
  background:none;border:none;cursor:pointer;text-align:left;
  padding:10px 6px;font-family:var(--font-body);color:var(--text-mid);font-size:13px;
  transform:rotate(-0.3deg);transition:transform 0.15s ease,color 0.15s;
}
.node-btn:nth-child(even){transform:rotate(0.4deg);}
.node-dot{
  width:11px;height:11px;border-radius:50%;background:var(--nc,var(--neon-cyan));
  box-shadow:0 0 8px var(--nc,var(--neon-cyan));flex-shrink:0;z-index:1;
  transition:transform 0.2s ease;
}
.node-btn:hover{transform:rotate(0deg) translateX(3px);color:var(--text-hi);}
.node-btn:hover .node-dot{transform:scale(1.3);}
.node-btn.active{color:var(--text-hi);font-weight:600;}
.node-btn.active .node-dot{
  transform:scale(1.4);
  box-shadow:0 0 14px var(--nc,var(--neon-cyan)),0 0 24px color-mix(in srgb,var(--nc) 50%,transparent);
}

.admin-badge{
  margin-top:16px;font-family:var(--font-data);font-size:10px;letter-spacing:0.1em;
  color:var(--neon-cyan);text-transform:uppercase;padding:6px 10px;
  border:1px dashed var(--neon-cyan);border-radius:4px;
}
.admin-bar{
  margin-top:16px;padding:10px 12px;border:1px solid var(--neon-cyan);
  border-radius:4px;background:rgba(58,214,224,0.08);
  display:flex;flex-direction:column;gap:8px;
}
.admin-bar-dot{width:8px;height:8px;border-radius:50%;background:var(--neon-cyan);box-shadow:0 0 8px var(--neon-cyan);animation:adminPulse 2s ease infinite;flex-shrink:0;}
@keyframes adminPulse{0%,100%{opacity:1;}50%{opacity:0.4;}}
.admin-bar-top{display:flex;align-items:center;gap:8px;}
.admin-bar-label{font-family:var(--font-data);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--neon-cyan);}
.sync-status{font-family:var(--font-data);font-size:9px;letter-spacing:0.06em;min-height:12px;color:var(--text-dim,#888);}
.sync-status--pending{color:#e8c547;}
.sync-status--busy{color:var(--neon-cyan);}
.sync-status--ok{color:#6ee7a0;}
.sync-status--err{color:var(--neon-pink);}
.admin-exit{width:100%;border-color:var(--neon-pink)!important;color:var(--neon-pink)!important;font-size:12px!important;}
.admin-exit:hover{background:rgba(255,79,216,0.12)!important;}
body.is-editing .main-col{outline:1px dashed rgba(58,214,224,0.12);outline-offset:4px;border-radius:4px;}
.admin-delete{border-color:rgba(255,79,216,0.5)!important;color:var(--neon-pink)!important;margin-right:auto;}
.content-edit-modal{
  max-width:560px;max-height:92vh;display:flex;flex-direction:column;overflow:hidden;padding-bottom:12px;
}
.content-edit-scroll{
  flex:1;overflow-y:auto;min-height:0;padding-right:6px;margin-bottom:8px;
}
.content-edit-modal .modal-actions{flex-shrink:0;margin-top:0;padding-top:12px;border-top:1px solid var(--border-glass);}
.content-edit-modal h3{flex-shrink:0;}
.content-edit-modal .modal-close{flex-shrink:0;}
#ce_card_blob{font-family:var(--font-main);font-size:11px;line-height:1.45;min-height:200px;}
.gen-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.upload-btn{cursor:pointer;margin:0;}
.flip-admin-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.flip-admin-row .btn{font-size:10px;padding:5px 10px;}

/* About — full-screen player card */
.about-root{display:flex;flex-direction:column;gap:28px;min-height:calc(100vh - 140px);}
.about-stage{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:min(72vh,720px);padding:12px 0 8px;position:relative;
}
.about-stage .player-card-hero.poke-flip,
.about-stage .player-card-hero{
  width:min(460px,94vw);
  max-width:min(460px,94vw);
}
.about-stage .player-card-hero .poke-flip-inner,
.about-stage .player-card-hero .poke-flip-front{
  height:min(78vh,640px);
  min-height:520px;
  max-height:min(78vh,640px);
}
.about-stage .player-card-hero .pc-front,
.about-stage .player-card-hero .pc-front-hero{
  height:100%;
  min-height:0;
  max-height:100%;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  padding:14px 14px 26px;
}
.about-stage .player-card-hero .pc-back{
  height:100%;
  min-height:0;
  max-height:100%;
}
.about-stage .player-card-hero .pc-head{flex-shrink:0;margin-bottom:10px;}
.about-stage .player-card-hero .pc-art{
  flex:1 1 auto;
  min-height:0;
  width:100%;
  position:relative;
  margin-bottom:8px;
}
.about-stage .player-card-hero .card-photo-frame{
  width:100%;
  height:100%;
  max-height:min(54vh,460px);
  min-height:280px;
  aspect-ratio:unset;
  margin:0;
}
.about-stage .player-card-hero .card-photo-frame img{
  object-fit:cover;
  object-position:center top;
}
.about-stage .player-card-hero .pc-spirit-sticker{
  width:72px;
  height:72px;
  bottom:12px;
  right:12px;
  border-width:3px;
  transform:rotate(6deg);
  box-shadow:0 0 14px var(--pc-accent),0 4px 10px rgba(0,0,0,0.45);
}
.about-stage .player-card-hero .pc-spirit-sticker img{
  object-fit:contain;
  object-position:center;
  background:radial-gradient(circle at 50% 45%,rgba(255,255,255,0.08),transparent 70%);
}
.about-stage .player-card-hero .pc-blurb{
  flex-shrink:0;
  margin-top:auto;
  font-size:13px;
  -webkit-line-clamp:3;
}
.about-stage .player-card-hero .flip-hint-front{
  flex-shrink:0;
  margin-top:6px;
  font-size:10px;
}
.about-stage .player-card-hero .pc-name{font-size:clamp(22px,3.2vw,28px);}
.about-stage .player-card-hero .pc-lv{font-size:15px;}
.about-meta{font-size:10px;color:var(--text-low);letter-spacing:0.14em;text-transform:uppercase;margin:10px 0 0;text-align:center;}
.about-edit-btn{margin-top:12px;}
.about-pin-wall{
  columns:2 240px;column-gap:18px;padding-bottom:20px;
}
@media(min-width:900px){.about-pin-wall{columns:3 220px;}}
.about-pin{
  break-inside:avoid;display:inline-block;width:100%;margin-bottom:16px;padding:14px 16px;
  background:var(--panel);border:2px solid var(--border-glass);
  border-top:3px solid var(--pmc,var(--neon-cyan));
  transform:rotate(var(--prot,0deg));cursor:pointer;transition:transform 0.2s,box-shadow 0.2s;
}
.about-pin:hover{transform:rotate(0deg) scale(1.02);box-shadow:0 0 22px color-mix(in srgb,var(--pmc) 30%,transparent);}
.about-pin-label{font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:var(--pmc);margin-bottom:8px;}
.about-pin-text{font-size:11px;line-height:1.45;color:var(--text-mid);margin:0;font-weight:500;}

/* Player card faces */
.pc-front,.pc-back{
  position:relative;display:flex;flex-direction:column;
  background:linear-gradient(165deg,#1f1235 0%,#0e0818 50%,#1a0e28 100%);
  border:3px solid var(--pc-accent,var(--neon-pink));
  box-shadow:inset 0 0 36px color-mix(in srgb,var(--pc-accent) 10%,transparent);
  min-height:420px;padding:14px 14px 28px;
}
.pc-front-hero{min-height:420px;}
.pc-frame-glow{position:absolute;inset:0;background:linear-gradient(125deg,transparent 35%,rgba(255,255,255,0.06) 50%,transparent 65%);pointer-events:none;}
.pc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:10px;}
.pc-head-simple{align-items:center;margin-bottom:8px;}
.pc-names{display:flex;flex-direction:column;gap:2px;min-width:0;}
.pc-name{font-size:clamp(16px,2.5vw,20px);font-weight:700;text-shadow:0 0 10px color-mix(in srgb,var(--pc-accent) 45%,transparent);line-height:1.1;}
.pc-sub{font-size:10px;color:var(--pc-accent);letter-spacing:0.06em;line-height:1.25;}
.pc-lv{font-size:13px;font-weight:700;color:var(--pc-accent);flex-shrink:0;}
.pc-blurb{
  font-size:11px;line-height:1.4;color:var(--text-mid);margin:10px 0 0;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.pc-art{
  position:relative;flex:0 0 auto;width:100%;margin-bottom:0;
}
.card-photo-frame{
  width:100%;aspect-ratio:3/4;overflow:hidden;position:relative;
  border:2px solid color-mix(in srgb,var(--pc-accent) 40%,transparent);
  background:#0a0610;border-radius:2px;
}
.card-photo-frame img{
  width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block;
}
.card-photo-frame .pc-art-ph{
  width:100%;height:100%;min-height:0;display:flex;align-items:center;justify-content:center;
  font-size:40px;color:var(--text-low);opacity:0.45;
}
.pc-spirit-sticker{
  position:absolute;bottom:6px;right:6px;width:62px;height:62px;
  border-radius:50%;border:3px solid var(--pc-accent);
  overflow:hidden;z-index:6;pointer-events:none;
  transform:rotate(8deg);
  box-shadow:0 0 12px var(--pc-accent),0 4px 10px rgba(0,0,0,0.5);
  background:var(--void);
}
.pc-spirit-sticker img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;}
.pc-back{overflow-y:auto;font-size:10px;line-height:1.4;padding-bottom:28px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
.pc-admin-row{
  position:sticky;bottom:0;margin-top:auto;padding-top:10px;
  background:linear-gradient(180deg,transparent,rgba(14,8,24,0.92) 35%);
  display:flex;gap:8px;flex-wrap:wrap;z-index:4;
}
.pc-admin-row .btn{font-size:10px;padding:5px 10px;}
.card-edit-front{
  position:absolute;top:8px;right:8px;z-index:12;
  font-size:10px;padding:5px 10px;line-height:1.2;
  background:rgba(8,4,16,0.88);border:1px solid var(--neon-cyan);
  color:var(--neon-cyan);border-radius:3px;cursor:pointer;
  box-shadow:0 0 12px rgba(58,214,224,0.25);
}
.card-edit-front:hover{background:rgba(58,214,224,0.15);}
.photo-flip-front{position:relative;}
.photo-flip-front .card-edit-front{top:6px;right:6px;}
.pc-back-title{font-size:14px;font-weight:700;color:var(--pc-accent);margin-bottom:8px;}
.pc-row{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px dashed rgba(255,255,255,0.08);font-size:10px;}
.pc-row span:first-child{color:var(--text-low);text-transform:uppercase;font-size:8px;letter-spacing:0.08em;}
.pc-block{margin:8px 0;padding:6px 0;border-bottom:1px dashed color-mix(in srgb,var(--pc-accent) 20%,transparent);}
.pc-block-title{font-size:9px;color:var(--pc-accent);margin-bottom:3px;letter-spacing:0.06em;}
.pc-block p{margin:0;color:var(--text-mid);font-size:9px;line-height:1.4;}
.pc-quote{margin-top:10px;padding-top:8px;border-top:1px dashed color-mix(in srgb,var(--pc-accent) 25%,transparent);font-size:9px;font-style:italic;color:var(--text-mid);line-height:1.45;}
.pc-spirit-row{display:flex;align-items:center;gap:10px;margin:8px 0;}
.pc-spirit-row img{width:40px;height:40px;border-radius:50%;border:2px solid var(--pc-accent);object-fit:cover;}
.pc-locked{text-align:center;padding:40px;color:var(--text-low);}

.player-card-hero .poke-flip-scene{
  padding:6px;border-color:var(--pc-accent,#ff4fd8);
  box-shadow:0 0 28px color-mix(in srgb,var(--pc-accent,#ff4fd8) 55%,transparent),0 8px 32px rgba(0,0,0,0.45);
}
.player-card-hero{transform:none!important;}
.player-card-hero.is-flipped{transform:scale(1.02)!important;}
.player-card-hero .pc-front,.player-card-hero .pc-back{
  border-color:var(--pc-accent,#ff4fd8);
  box-shadow:inset 0 0 48px color-mix(in srgb,var(--pc-accent,#ff4fd8) 14%,transparent),0 0 24px color-mix(in srgb,var(--pc-accent,#ff4fd8) 25%,transparent);
}

.poke-flip-inner{min-height:420px;}
.poke-flip-scene{
  border-radius:8px;padding:4px;background:rgba(0,0,0,0.35);
  border:2px solid color-mix(in srgb,var(--pc-accent,var(--neon-pink)) 55%,var(--border-glass));
  box-shadow:0 0 18px color-mix(in srgb,var(--pc-accent,var(--neon-pink)) 22%,transparent),0 8px 32px rgba(0,0,0,0.45);
}
.field-preview img{max-height:80px;margin-top:8px;border-radius:3px;}
.field-check label{display:flex;align-items:center;gap:8px;cursor:pointer;}
.panel-edit-hint{font-family:var(--font-data);font-size:9px;color:var(--neon-cyan);opacity:0.7;margin-top:8px;display:block;}
.card-admin-actions{margin-top:16px;padding-top:12px;border-top:1px dashed var(--border-glass);}

.char-gen-block{
  margin-bottom:18px;padding:14px;border:1px solid rgba(255,79,216,0.35);
  border-radius:4px;background:rgba(255,79,216,0.06);
}
.char-gen-block label{color:var(--neon-pink);}
.char-gen-preview{
  margin-top:12px;border-radius:4px;overflow:hidden;border:2px solid var(--border-glass);
  background:#0a0610;min-height:80px;position:relative;
}
.char-gen-preview img{width:100%;display:block;aspect-ratio:3/4;object-fit:cover;object-position:center top;}
.char-gen-preview .gen-tag{
  position:absolute;top:8px;right:8px;font-family:var(--font-data);font-size:9px;
  letter-spacing:0.08em;text-transform:uppercase;color:var(--neon-cyan);
  background:rgba(11,7,20,0.85);padding:4px 8px;border:1px solid var(--neon-cyan);
}
.image-gen-block{
  margin:14px 0 18px;padding:14px;border:1px solid rgba(255,79,216,0.28);
  border-radius:4px;background:rgba(255,79,216,0.05);
}
.image-gen-block .ig-ref-field{position:relative;}
.ig-ref-preview{display:flex;align-items:center;gap:10px;margin-top:8px;}
.ig-ref-thumb{width:56px;height:56px;object-fit:cover;border-radius:4px;border:1px solid var(--border-glass);}
.ig-ref-tag{font-size:11px;color:var(--neon-cyan);}
.ig-file-input{position:absolute;width:0;height:0;opacity:0;pointer-events:none;overflow:hidden;}
.ig-framing{margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,0.1);}
.ig-frame-preview{max-width:200px;margin:8px 0 12px;}
.ig-focus-sliders{display:flex;flex-direction:column;gap:10px;max-width:320px;}
.ig-focus-row{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--text-mid);}
.ig-focus-row span{min-width:88px;text-transform:uppercase;letter-spacing:0.06em;font-size:10px;}
.ig-focus-row input[type=range]{flex:1;}
.player-color-row{display:flex;align-items:center;gap:12px;margin-top:6px;}
.player-color-row input[type=color]{width:48px;height:36px;padding:2px;border:1px solid var(--border-glass);background:transparent;cursor:pointer;}
.player-color-swatch{
  width:36px;height:36px;border-radius:50%;
  background:var(--swatch,#ff4fd8);
  box-shadow:0 0 16px var(--swatch,#ff4fd8),0 0 32px color-mix(in srgb,var(--swatch,#ff4fd8) 40%,transparent);
}
.gen-loading,.gen-error{display:block;padding:24px;text-align:center;font-size:13px;color:var(--text-mid);}
.gen-error{color:var(--neon-pink);}
.pin-delete{background:none;border:none;color:var(--neon-pink);font-size:18px;cursor:pointer;line-height:1;padding:0 4px;}
.admin-unlock{
  margin-top:14px;background:none;border:none;
  color:var(--text-low);font-size:18px;padding:4px;cursor:pointer;
  opacity:0.25;line-height:1;
}
.admin-unlock:hover{opacity:0.7;color:var(--neon-cyan);}

/* ===== Main column ===== */
.main-col{flex:1;min-width:0;}
section.view{display:none;animation:fadein 0.45s ease;}
section.view.active{display:block;}
@keyframes fadein{from{opacity:0;transform:translateY(8px) rotate(0.3deg);}to{opacity:1;transform:none;}}

.view-title{font-size:24px;margin:0 0 18px;}
.view-sub{display:none;}
.view-hint{color:var(--text-low);font-size:12px;margin-top:12px;font-style:italic;}

/* ===== Section neon accents ===== */
.neon-section{
  position:relative;padding-top:4px;
}
.neon-section::before{
  content:'';position:absolute;top:0;left:0;width:72%;max-width:420px;height:2px;
  background:linear-gradient(90deg,var(--sec-neon,var(--neon-pink)),transparent);
  box-shadow:0 0 14px var(--sec-neon,var(--neon-pink)),0 0 28px color-mix(in srgb,var(--sec-neon) 35%,transparent);
}
.neon-section::after{
  content:'';position:absolute;top:8px;left:0;width:3px;height:48px;
  background:linear-gradient(180deg,var(--sec-neon,var(--neon-pink)),transparent);
  box-shadow:0 0 10px var(--sec-neon,var(--neon-pink));
  opacity:0.85;
}
.neon-section.active .sketch-title{
  text-shadow:0 0 20px color-mix(in srgb,var(--sec-neon) 45%,transparent);
}
.neon-section.active .sketch-title::after{
  background:linear-gradient(90deg,color-mix(in srgb,var(--sec-neon) 40%,transparent),rgba(79,163,255,0.15));
}
.neon-section .sketch-card,
.neon-section .card{
  border-color:color-mix(in srgb,var(--sec-neon) 22%,var(--border-glass));
}
.neon-section .sketch-card:hover,
.neon-section .card:hover{
  box-shadow:0 0 32px color-mix(in srgb,var(--sec-neon) 18%,transparent);
}
#view-profile .view-title{margin-bottom:8px;}
#view-profile.active{padding-bottom:0;}
.gallery-hint{
  font-family:var(--font-main);font-size:10px;letter-spacing:0.1em;
  color:var(--sec-neon,var(--neon-purple));margin:-8px 0 16px;opacity:0.85;
}

/* ===== Sketch cards (less boxy) ===== */
.card,.sketch-card{
  background:var(--panel);border:2px solid var(--border-glass);
  border-radius:var(--radius-card);padding:20px;backdrop-filter:blur(14px);
  box-shadow:0 0 40px rgba(120,60,200,0.08);
  position:relative;
}
.sketch-card::before{
  content:'';position:absolute;inset:-1px;border:1px solid var(--sketch);
  border-radius:var(--radius-card);pointer-events:none;
  transform:rotate(0.4deg);opacity:0.5;
}
.card h3{margin-top:0;font-size:14px;font-family:var(--font-display);}

.grid-2col{display:grid;grid-template-columns:1.3fr 1fr;gap:18px;}
@media(max-width:760px){.grid-2col{grid-template-columns:1fr;}}

/* ===== Vitals ===== */
.ticker-row{
  display:flex;align-items:center;gap:12px;padding:10px 0;
  border-bottom:1px solid var(--border-glass);font-size:14px;
}
.ticker-row:last-child{border-bottom:none;}
.ticker-row .dot{width:6px;height:6px;border-radius:50%;background:var(--neon-cyan);flex-shrink:0;box-shadow:0 0 6px var(--neon-cyan);}
.ticker-row .when{margin-left:auto;color:var(--text-low);font-family:var(--font-data);font-size:11px;}

.vital{margin-bottom:16px;}
.vital-label{display:flex;justify-content:space-between;font-size:13px;color:var(--text-mid);margin-bottom:6px;}
.vital-bar{height:8px;border-radius:2px;background:rgba(255,255,255,0.06);overflow:hidden;transform:skewX(-4deg);}
.vital-fill{height:100%;background:linear-gradient(90deg,var(--neon-pink),var(--neon-blue));transition:width 0.5s ease;}

.bell{
  display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:4px;
  background:rgba(79,163,255,0.08);border:1px solid rgba(79,163,255,0.3);font-size:13px;margin-top:14px;
}

/* ===== Profile ===== */
.profile-hero{display:flex;gap:22px;align-items:flex-start;flex-wrap:wrap;}
.profile-avatar{
  width:120px;height:140px;flex-shrink:0;
  background:linear-gradient(160deg,rgba(233,79,245,0.2),rgba(79,163,255,0.15));
  border:2px solid var(--border-glass);border-radius:4px;
  display:flex;align-items:center;justify-content:center;
  transform:rotate(-2deg);overflow:hidden;
  box-shadow:0 0 24px rgba(233,79,245,0.25);
}
.profile-avatar img{width:100%;height:100%;object-fit:cover;}
.avatar-svg{width:80%;height:auto;}
.profile-info{flex:1;min-width:200px;}
.profile-name{font-family:var(--font-display);font-size:26px;}
.profile-class{font-family:var(--font-data);font-size:11px;color:var(--neon-cyan);letter-spacing:0.06em;text-transform:uppercase;margin-top:2px;}
.profile-rank{font-size:13px;color:var(--text-mid);margin-top:8px;}
.profile-bio-text{font-size:14px;line-height:1.6;color:var(--text-mid);margin-top:14px;white-space:pre-wrap;}
.profile-bio{
  width:100%;min-height:80px;background:rgba(255,255,255,0.04);border:1px solid var(--border-glass);
  border-radius:4px;padding:12px;color:var(--text-hi);font-size:14px;margin-top:14px;resize:vertical;
}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-top:20px;}
.highlight-chip{
  padding:14px 12px;border:2px solid var(--border-glass);border-radius:4px;
  transform:rotate(var(--hr,0deg));background:rgba(255,255,255,0.03);
  border-left:3px solid var(--hc,var(--neon-pink));
}
.highlight-chip:nth-child(odd){transform:rotate(-0.8deg);}
.highlight-chip:nth-child(even){transform:rotate(0.6deg);}
.hc-label{display:block;font-family:var(--font-data);font-size:9px;color:var(--text-low);letter-spacing:0.08em;text-transform:uppercase;}
.hc-val{display:block;font-family:var(--font-display);font-size:15px;margin-top:4px;color:var(--text-hi);}

/* ===== Calendar ===== */
.month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}
.day-node{
  aspect-ratio:1;border-radius:3px;background:rgba(255,255,255,0.04);
  border:1px solid var(--border-glass);display:flex;align-items:center;justify-content:center;
  font-family:var(--font-data);font-size:12px;color:var(--text-low);cursor:pointer;
  transition:all 0.2s ease;transform:rotate(0deg);
}
.day-node:nth-child(odd){transform:rotate(-0.5deg);}
.day-node:hover{border-color:var(--neon-cyan);color:var(--text-hi);}
.day-node.logged{
  background:linear-gradient(135deg,rgba(233,79,245,0.3),rgba(58,214,224,0.25));
  border-color:var(--neon-pink);color:var(--text-hi);font-weight:600;
}
.day-node.empty{visibility:hidden;pointer-events:none;}
.messy-grid .day-node.logged.messy-1{transform:rotate(-1.2deg) scale(1.05);}
.messy-grid .day-node.logged.messy-2{transform:rotate(0.9deg) scale(0.95);}
.messy-grid .day-node.logged.messy-3{transform:rotate(-0.5deg) scale(1.08);}
.messy-grid .day-node.logged.messy-4{transform:rotate(1.4deg);}
.messy-grid .day-node.logged[class*="m9"],.messy-grid .day-node.logged[class*="m8"]{border-color:var(--neon-cyan);box-shadow:0 0 8px rgba(58,214,224,0.2);}
.messy-grid .day-node.logged[class*="m3"],.messy-grid .day-node.logged[class*="m4"]{border-color:var(--neon-pink);}

/* ===== Daily log scrapbook ===== */
.log-scrapbook{
  display:flex;flex-wrap:wrap;gap:14px;margin-bottom:20px;align-items:flex-start;
}
.log-scrap{
  flex:1 1 200px;max-width:280px;padding:14px 16px 16px;
  background:rgba(24,14,40,0.75);border:2px solid var(--border-glass);
  border-top:3px solid var(--mood-c,var(--neon-purple));
  transform:rotate(var(--lsr,0deg));cursor:pointer;
  transition:transform 0.2s ease,box-shadow 0.2s;
}
.log-scrap:hover{transform:rotate(0deg) scale(1.02);box-shadow:0 6px 24px rgba(233,79,245,0.15);z-index:2;}
.log-scrap-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;}
.log-scrap-day{font-family:var(--font-sketch);font-size:18px;color:var(--text-hi);}
.log-scrap-mood{font-family:var(--font-data);font-size:11px;color:var(--mood-c);}
.log-scrap-note{font-size:13px;color:var(--text-mid);line-height:1.45;margin:0 0 10px;font-style:italic;}
.log-scrap-tags{display:flex;flex-wrap:wrap;gap:5px;}
.log-scrap-tags span{
  font-family:var(--font-data);font-size:9px;padding:3px 7px;
  background:rgba(255,255,255,0.05);border:1px solid var(--border-glass);border-radius:2px;
  transform:rotate(-0.5deg);
}
.log-scrap-steps{font-family:var(--font-data);font-size:10px;color:var(--text-low);margin-top:10px;}

.day-readonly .day-ro-row{
  display:flex;justify-content:space-between;padding:10px 0;
  border-bottom:1px dashed var(--border-glass);font-size:14px;
}
.day-readonly .day-ro-row span:first-child{color:var(--text-low);}
.day-readonly .day-ro-row span:last-child{color:var(--text-hi);text-align:right;max-width:65%;}

/* ===== Home Check-In spread ===== */
.home-hero .home-stat-row{
  display:flex;flex-wrap:wrap;gap:16px;margin-top:16px;
}
.home-stat{text-align:center;min-width:70px;}
.hs-num{display:block;font-family:var(--font-display);font-size:28px;font-weight:700;color:var(--neon-cyan);}
.hs-lbl{display:block;font-family:var(--font-data);font-size:9px;color:var(--text-low);letter-spacing:0.06em;text-transform:uppercase;margin-top:2px;}
.home-note-text{font-family:var(--font-sketch);font-size:20px;line-height:1.35;}
.home-drama-row{margin-bottom:14px;}
.home-drama-title{display:block;font-weight:600;font-size:14px;}
.home-drama-ep{font-family:var(--font-data);font-size:10px;color:var(--neon-pink);}
.home-drama-bar{height:4px;background:rgba(255,255,255,0.08);border-radius:2px;margin-top:6px;overflow:hidden;}
.home-drama-bar div{height:100%;background:linear-gradient(90deg,var(--neon-pink),var(--neon-purple));border-radius:2px;}
.home-scrap-wrap{display:flex;flex-wrap:wrap;gap:8px;}
.home-scrap{
  flex:1 1 140px;padding:8px 10px;background:rgba(0,0,0,0.2);
  border:1px dashed var(--border-glass);transform:rotate(var(--sr,0deg));
}
.home-scrap-date{font-family:var(--font-data);font-size:9px;color:var(--neon-cyan);display:block;}
.home-scrap-text{font-size:12px;color:var(--text-mid);}
.tier-progress{height:6px;background:rgba(255,255,255,0.06);border-radius:2px;margin:10px 0 6px;overflow:hidden;}
.tier-progress div{height:100%;border-radius:2px;transition:width 0.5s ease;}

/* ===== Pokémon-style cards ===== */
.gen-note{font-size:11px;color:var(--text-low);margin:6px 0 0;}
.gen-loading{display:block;padding:24px;text-align:center;font-family:var(--font-data);font-size:11px;color:var(--neon-cyan);}
.gen-error{color:var(--neon-pink);}
.spirit-gen-block{border-color:rgba(232,168,124,0.4)!important;background:rgba(232,168,124,0.06)!important;}
.spirit-preview img{aspect-ratio:1/1;object-fit:cover;}
.poke-editor-section{margin-top:16px;padding-top:14px;border-top:1px dashed var(--border-glass);}
.poke-editor-section h4{margin:0 0 12px;font-family:var(--font-display);color:var(--neon-pink);}
.poke-editor-sub{margin-bottom:14px;padding:10px;background:rgba(0,0,0,0.15);border-radius:3px;border-left:3px solid var(--neon-purple);}
.poke-editor-sub strong{font-family:var(--font-data);font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-low);}

/* ===== Flip Pokémon cards ===== */
.card-deck{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start;}

.poke-flip{
  width:260px;max-width:260px;flex-shrink:0;perspective:1400px;
  transform:rotate(var(--tilt,0deg));
  transition:transform 0.35s ease;cursor:pointer;
}
.place-flip{width:260px;max-width:260px;}
.place-flip .poke-flip-inner{min-height:380px;max-height:380px;}
.place-flip .pc-front{min-height:380px;max-height:380px;display:flex;flex-direction:column;}
.poke-flip:hover:not(.is-flipped){transform:rotate(0deg) translateY(-6px) scale(1.02);z-index:4;}
.poke-flip.is-flipped{transform:rotate(0deg) scale(1.04);z-index:6;}
.poke-flip.locked{filter:grayscale(0.5) brightness(0.75);}
.poke-flip.about-poke-flip{width:min(100%,300px);margin:0 auto;}

.poke-flip-inner{position:relative;transform-style:preserve-3d;transition:transform 0.75s cubic-bezier(0.4,0.2,0.2,1);min-height:380px;}
.poke-flip.is-flipped .poke-flip-inner{transform:rotateY(180deg);}
.poke-flip-face{backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:6px;overflow:hidden;}
.poke-flip-front{transform:rotateY(0deg);}
.poke-flip-back{position:absolute;inset:0;transform:rotateY(180deg);display:flex;flex-direction:column;overflow:hidden;height:100%;}
.poke-flip-back .pc-back{flex:1 1 auto;min-height:0;max-height:100%;}
.player-card-hero .poke-flip-back .pc-back{height:100%;}

/* TCG front */
.ptcg-front{
  position:relative;min-height:380px;padding:12px 12px 36px;
  background:linear-gradient(165deg,#1f1235 0%,#120a1e 45%,#1a0e28 100%);
  border:3px solid var(--ptcg-accent,var(--neon-pink));
  box-shadow:inset 0 0 40px color-mix(in srgb,var(--ptcg-accent) 12%,transparent);
}
.ptcg-frame-glow{position:absolute;inset:0;background:linear-gradient(125deg,transparent 35%,rgba(255,255,255,0.07) 50%,transparent 65%);pointer-events:none;}
.ptcg-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;}
.ptcg-name{font-family:var(--font-display);font-weight:700;font-size:18px;text-shadow:0 0 12px color-mix(in srgb,var(--ptcg-accent) 50%,transparent);}
.ptcg-lvl{font-family:var(--font-data);font-size:11px;color:var(--ptcg-accent);}
.ptcg-art-wrap{
  position:relative;aspect-ratio:4/3;border:2px solid color-mix(in srgb,var(--ptcg-accent) 40%,transparent);
  background:linear-gradient(180deg,rgba(79,163,255,0.1),rgba(233,79,245,0.08));overflow:hidden;margin-bottom:8px;
}
.ptcg-art-wrap img{width:100%;height:100%;object-fit:cover;}
.ptcg-art-ph{font-family:var(--font-sketch);font-size:48px;color:var(--text-low);display:flex;align-items:center;justify-content:center;height:100%;opacity:0.5;}
.ptcg-spirit-badge{
  position:absolute;bottom:6px;right:6px;width:44px;height:44px;border-radius:50%;
  border:2px solid var(--ptcg-accent);overflow:hidden;background:#0a0610;
  box-shadow:0 0 12px var(--ptcg-accent);
}
.ptcg-spirit-badge img{width:100%;height:100%;object-fit:cover;}
.ptcg-spirit-empty{display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--ptcg-accent);opacity:0.6;}
.ptcg-mid{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px;}
.ptcg-type{font-family:var(--font-data);font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ptcg-accent);padding:2px 8px;border:1px solid color-mix(in srgb,var(--ptcg-accent) 50%,transparent);}
.ptcg-sub{font-size:10px;color:var(--text-mid);}
.ptcg-vibe{font-family:var(--font-sketch);font-size:15px;color:var(--text-hi);line-height:1.25;margin-bottom:4px;}
.ptcg-mbti,.ptcg-palette{font-family:var(--font-data);font-size:9px;color:var(--text-low);letter-spacing:0.06em;}
.ptcg-quote{font-family:var(--font-sketch);font-size:14px;color:var(--text-mid);font-style:italic;margin-top:8px;line-height:1.3;min-height:2.6em;}

/* TCG back */
.ptcg-back{
  min-height:380px;padding:12px 12px 32px;overflow-y:auto;
  background:linear-gradient(160deg,#140c22,#0a0612);
  border:3px solid var(--ptcg-accent);
  font-size:11px;line-height:1.45;
}
.ptcg-back-head{display:flex;justify-content:space-between;font-family:var(--font-display);font-weight:700;margin-bottom:8px;color:var(--ptcg-accent);}
.ptcg-back-spirit{width:56px;height:56px;border-radius:50%;border:2px solid var(--ptcg-accent);overflow:hidden;margin-bottom:8px;}
.ptcg-back-spirit img{width:100%;height:100%;object-fit:cover;}
.ptcg-stat-block{margin-bottom:8px;padding-bottom:8px;border-bottom:1px dashed color-mix(in srgb,var(--ptcg-accent) 25%,transparent);}
.ptcg-stat-block.move{border-left:2px solid var(--ptcg-accent);padding-left:8px;}
.ptcg-stat-label{font-family:var(--font-data);font-size:8px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ptcg-accent);display:block;margin-bottom:2px;}
.ptcg-stat-block p{margin:0;color:var(--text-mid);}
.ptcg-wrr{display:flex;flex-direction:column;gap:6px;margin:10px 0;}
.ptcg-wrr-item{padding:6px;background:rgba(0,0,0,0.2);border-radius:3px;}
.ptcg-wrr-item span{font-family:var(--font-data);font-size:8px;text-transform:uppercase;color:var(--text-low);}
.ptcg-wrr-item.weak{border-left:3px solid #f87171;}
.ptcg-wrr-item.res{border-left:3px solid var(--neon-cyan);}
.ptcg-wrr-item p{margin:4px 0 0;font-size:10px;color:var(--text-mid);}
.ptcg-narr{margin-top:8px;}
.ptcg-narr h5{margin:0 0 4px;font-size:10px;text-transform:uppercase;color:var(--text-low);font-family:var(--font-data);}
.ptcg-narr p{margin:0;color:var(--text-mid);font-size:11px;}
.ptcg-locked-msg{text-align:center;padding:40px 16px;font-style:italic;color:var(--text-low);}

/* About profile */
.about-profile-wrap{display:grid;grid-template-columns:1fr 1.2fr;gap:20px;margin-bottom:20px;}
@media(max-width:820px){.about-profile-wrap{grid-template-columns:1fr;}}
.about-portrait-col{display:flex;flex-direction:column;align-items:center;text-align:center;}
.about-portrait-frame{
  width:100%;max-width:220px;aspect-ratio:3/4;border:3px solid var(--neon-pink);
  overflow:hidden;margin:12px 0;background:rgba(233,79,245,0.08);
  box-shadow:0 0 32px rgba(255,79,216,0.2);transform:rotate(-1deg);
}
.about-portrait-frame img{width:100%;height:100%;object-fit:cover;}
.about-bio-short{font-size:13px;color:var(--text-mid);line-height:1.55;margin:0 0 12px;}
.about-card-col{display:flex;flex-direction:column;align-items:center;}
.about-flip-hint{text-align:center;margin-top:8px;}
.about-recents-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;}
.about-recent{cursor:pointer;transition:box-shadow 0.2s,border-color 0.2s;}
.about-recent:hover{box-shadow:0 0 24px rgba(255,79,216,0.15);border-color:rgba(255,79,216,0.35);}

/* Skill journey skyscraper */
.skill-journey-modal{max-width:720px;}
.sjs-title{margin:0 0 4px;font-family:var(--font-display);}
.sjs-sub{font-family:var(--font-data);font-size:11px;color:var(--text-low);margin:0 0 20px;}
.skill-journey-layout{display:grid;grid-template-columns:180px 1fr;gap:20px;align-items:end;min-height:320px;}
@media(max-width:560px){.skill-journey-layout{grid-template-columns:1fr;}}
.sjs-building{
  position:relative;display:flex;flex-direction:column;align-items:center;
  padding-bottom:8px;
}
.sjs-antenna{width:4px;height:24px;background:var(--skill-color);box-shadow:0 0 8px var(--skill-color);margin-bottom:2px;}
.sjs-antenna::after{content:'';display:block;width:8px;height:8px;border-radius:50%;background:var(--skill-color);margin-left:-2px;box-shadow:0 0 12px var(--skill-color);}
.sjs-floors{display:flex;flex-direction:column-reverse;width:100%;gap:3px;}
.sjs-floor{
  width:100%;min-height:var(--floor-h,52px);border:none;cursor:pointer;padding:6px 8px;
  background:linear-gradient(90deg,#1a1028,#120a18);border:1px solid rgba(255,255,255,0.06);
  text-align:left;position:relative;overflow:hidden;
  animation:sjsReveal 0.5s ease backwards;animation-delay:var(--delay,0s);
}
@keyframes sjsReveal{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
.sjs-floor.lit{
  background:linear-gradient(90deg,color-mix(in srgb,var(--skill-color) 25%,#1a1028),#120a18);
  border-color:color-mix(in srgb,var(--skill-color) 45%,transparent);
  box-shadow:inset 0 0 20px color-mix(in srgb,var(--skill-color) 15%,transparent);
}
.sjs-windows{
  position:absolute;right:8px;top:50%;transform:translateY(-50%);
  width:40px;height:70%;background:repeating-linear-gradient(180deg,transparent,transparent 6px,rgba(255,255,255,0.08) 7px,transparent 8px);
  opacity:0.5;
}
.sjs-floor.lit .sjs-windows{background:repeating-linear-gradient(180deg,transparent,transparent 6px,color-mix(in srgb,var(--skill-color) 60%,transparent) 7px,transparent 8px);opacity:0.9;}
.sjs-floor-meta{display:flex;flex-direction:column;gap:2px;position:relative;z-index:1;}
.sjs-floor-date{font-family:var(--font-data);font-size:8px;color:var(--text-low);}
.sjs-floor-title{font-family:var(--font-display);font-size:11px;font-weight:600;color:var(--text-hi);}
.sjs-floor-hrs{font-family:var(--font-data);font-size:8px;color:var(--skill-color);}
.sjs-ground-line{width:120%;height:4px;background:linear-gradient(90deg,transparent,var(--skill-color),transparent);margin-top:4px;box-shadow:0 0 12px var(--skill-color);}
.sjs-detail{min-height:200px;}
.sjs-detail-placeholder{font-size:13px;color:var(--text-low);font-style:italic;}
.sjs-detail-card h3{margin:8px 0;font-family:var(--font-display);font-size:18px;}
.sjs-detail-card p{font-size:14px;line-height:1.55;color:var(--text-mid);}
.sjs-detail-date{font-family:var(--font-data);font-size:10px;color:var(--neon-cyan);}
.sjs-empty-floor{padding:24px;text-align:center;font-size:12px;color:var(--text-low);}
.sjs-admin{margin-top:20px;}
.skill-tower{cursor:pointer;}


.poke-card{
  width:220px;flex-shrink:0;cursor:pointer;
  transform:rotate(var(--tilt,0deg));
  transition:transform 0.25s ease,box-shadow 0.25s ease;
  position:relative;
}
.poke-card:hover{
  transform:rotate(0deg) translateY(-8px) scale(1.03);
  z-index:5;
  filter:drop-shadow(0 0 12px var(--card-accent,var(--neon-pink)));
}

.poke-card-inner{
  border-radius:6px;overflow:hidden;
  border:3px solid var(--card-accent,var(--neon-pink));
  background:linear-gradient(165deg,#1a0e2e 0%,#0f0818 40%,#1a1030 100%);
  box-shadow:
    0 0 24px color-mix(in srgb,var(--card-accent) 35%,transparent),
    inset 0 0 30px rgba(255,255,255,0.03);
  position:relative;
}
.poke-card-inner::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,transparent,var(--card-accent),transparent);
  opacity:0.7;box-shadow:0 0 8px var(--card-accent);
}
.poke-card-inner::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(125deg,transparent 30%,rgba(255,255,255,0.06) 50%,transparent 70%);
  pointer-events:none;
}

.poke-card.place-card{--card-accent:var(--neon-blue);}
.poke-card.locked .poke-card-inner{filter:grayscale(0.8) brightness(0.5);}

.poke-header{
  display:flex;justify-content:space-between;align-items:center;
  padding:8px 12px;background:rgba(0,0,0,0.35);
  border-bottom:2px solid var(--card-accent);
}
.poke-type{
  font-family:var(--font-data);font-size:9px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--card-accent);
}
.poke-id{font-family:var(--font-data);font-size:9px;color:var(--text-low);}

.poke-art{
  aspect-ratio:4/3;background:linear-gradient(180deg,rgba(79,163,255,0.12),rgba(233,79,245,0.08));
  display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;
}
.poke-art img{width:100%;height:100%;object-fit:cover;}
.poke-art-placeholder{
  font-family:var(--font-sketch);font-size:42px;color:var(--text-low);opacity:0.5;
}

.poke-body{padding:10px 12px 12px;}
.poke-name{font-family:var(--font-display);font-size:16px;font-weight:700;margin:0;}
.poke-subtype{font-family:var(--font-data);font-size:9px;color:var(--text-mid);margin-top:2px;text-transform:uppercase;}
.poke-quote{
  font-family:var(--font-sketch);font-size:15px;color:var(--text-mid);
  margin-top:8px;line-height:1.3;font-style:italic;
}
.poke-stats{
  display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:10px;
  font-size:10px;font-family:var(--font-data);
}
.poke-stat-label{color:var(--text-low);}
.poke-stat-val{color:var(--neon-cyan);}

.poke-holo{
  position:absolute;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(135deg,rgba(255,79,216,0.15),rgba(79,163,255,0.15),rgba(58,214,224,0.15));
  transition:opacity 0.3s;
}
.poke-card:hover .poke-holo{opacity:1;}

.add-card-tile{
  width:220px;min-height:280px;border:2px dashed var(--border-glass);border-radius:6px;
  display:flex;align-items:center;justify-content:center;color:var(--text-low);
  cursor:pointer;font-size:13px;transform:rotate(1deg);
}
.add-card-tile:hover{border-color:var(--neon-cyan);color:var(--neon-cyan);}

/* Card detail modal */
.card-modal{max-width:520px;}
.card-detail-art{
  width:100%;aspect-ratio:16/10;border-radius:4px;overflow:hidden;margin-bottom:16px;
  background:linear-gradient(135deg,rgba(233,79,245,0.2),rgba(79,163,255,0.2));
  transform:rotate(-0.5deg);
}
.card-detail-art img{width:100%;height:100%;object-fit:cover;}
.card-detail-name{font-family:var(--font-display);font-size:22px;margin:0;}
.card-detail-type{font-family:var(--font-data);font-size:11px;color:var(--neon-cyan);margin-top:4px;}
.card-detail-section{margin-top:14px;}
.card-detail-section h4{font-family:var(--font-sketch);font-size:18px;margin:0 0 4px;color:var(--neon-pink);}
.card-detail-section p{font-size:14px;color:var(--text-mid);margin:0;line-height:1.5;}

/* ===== Skill skyline towers ===== */
.skill-skyline-wrap{
  position:relative;padding:20px 10px 0;min-height:360px;
  background:linear-gradient(180deg,transparent,rgba(20,11,34,0.6));
  border:2px solid var(--border-glass);border-radius:4px;overflow:hidden;
}
.skill-skyline{
  display:flex;align-items:flex-end;justify-content:center;gap:8px;
  height:300px;padding:0 10px;
}
.skill-tower{
  flex:1;max-width:90px;min-width:48px;position:relative;
  cursor:default;transition:transform 0.3s ease;
}
.skill-tower:hover{transform:translateY(-6px);filter:drop-shadow(0 0 14px var(--tower-color,var(--neon-cyan)));}

.skill-tower-bar{
  width:100%;border-radius:2px 2px 0 0;position:relative;overflow:hidden;
  background:linear-gradient(180deg,#1a1028,#0a0610);
  border:1px solid rgba(255,255,255,0.08);
  border-bottom:none;
  transition:height 0.8s cubic-bezier(0.34,1.2,0.64,1);
}
.skill-tower-bar::before{
  content:'';position:absolute;inset:0;
  background:repeating-linear-gradient(0deg,transparent,transparent 8px,rgba(255,255,255,0.03) 9px);
}

.skill-light{
  position:absolute;width:4px;height:4px;border-radius:1px;
  animation:lightFlicker var(--flicker,2s) ease-in-out infinite;
  box-shadow:0 0 4px currentColor;
}
@keyframes lightFlicker{
  0%,100%{opacity:var(--lo,0.6);}
  50%{opacity:1;}
}

.skill-neon-top{
  position:absolute;top:-2px;left:10%;right:10%;height:3px;
  background:var(--tower-color);box-shadow:0 0 12px var(--tower-color);
  border-radius:2px;
}

.skill-label{
  text-align:center;margin-top:8px;font-family:var(--font-data);
  font-size:9px;color:var(--text-mid);letter-spacing:0.04em;
  transform:rotate(-1deg);
}
.skill-level{
  text-align:center;font-family:var(--font-display);font-size:12px;
  color:var(--tower-color);margin-top:2px;font-weight:600;
}
.skill-hours{
  text-align:center;font-family:var(--font-data);font-size:8px;
  color:var(--text-low);margin-top:3px;line-height:1.3;
}
.skill-tier-badge{
  position:absolute;top:8px;right:4px;font-family:var(--font-data);
  font-size:9px;color:var(--tower-color);opacity:0.85;
  text-shadow:0 0 6px var(--tower-color);
}
.tier-legend{
  display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;
}
.tier-chip{
  font-family:var(--font-data);font-size:8px;padding:4px 7px;
  border:1px solid var(--border-glass);border-radius:2px;color:var(--text-low);
  transform:rotate(-0.3deg);
}
.tier-chip:nth-child(even){transform:rotate(0.5deg);}

.skill-ground{
  height:4px;background:linear-gradient(90deg,var(--neon-pink),var(--neon-purple),var(--neon-blue));
  opacity:0.4;margin-top:0;
}

.skill-control-row{
  display:flex;align-items:center;gap:8px;padding:8px 0;
  border-bottom:1px solid var(--border-glass);font-size:13px;flex-wrap:wrap;
}
.skill-control-row:last-child{border-bottom:none;}
.skill-control-row .skill-control-meta{flex:1;min-width:140px;}
.skill-control-row .skill-control-actions{display:flex;gap:6px;flex-wrap:wrap;}
.skill-control-row button{padding:4px 12px;font-size:12px;}
.skill-control-row .skill-control-hours{display:flex;gap:6px;}

/* ===== Manga / newspaper press ===== */
.manga-spread{
  display:grid;grid-template-columns:repeat(12,1fr);gap:14px;align-items:start;
}
.manga-panel{
  background:var(--panel);border:2px solid color-mix(in srgb,var(--panel-neon,var(--border-glass)) 45%,var(--border-glass));
  padding:16px;position:relative;cursor:pointer;
  transition:transform 0.2s ease,box-shadow 0.2s;
  box-shadow:0 0 16px color-mix(in srgb,var(--panel-neon,transparent) 12%,transparent);
}
.manga-panel:hover{
  transform:rotate(0deg) scale(1.01);
  box-shadow:0 0 32px color-mix(in srgb,var(--panel-neon,var(--neon-pink)) 28%,transparent);
  border-color:color-mix(in srgb,var(--panel-neon,var(--neon-pink)) 55%,var(--border-glass));
}
.manga-panel::after{
  content:'';position:absolute;inset:3px;border:1px dashed var(--sketch);
  pointer-events:none;opacity:0.4;
}

.manga-panel.hero{grid-column:span 8;grid-row:span 2;transform:rotate(-0.8deg);}
.manga-panel.wide{grid-column:span 7;transform:rotate(0.5deg);}
.manga-panel.tall{grid-column:span 4;grid-row:span 2;transform:rotate(-1.2deg);}
.manga-panel.note{grid-column:span 5;transform:rotate(0.8deg);background:rgba(255,79,216,0.06);}

.manga-section{
  font-family:var(--font-data);font-size:9px;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--neon-pink);margin-bottom:6px;
}
.manga-headline{
  font-family:var(--font-voice);font-size:clamp(18px,3vw,28px);
  font-weight:900;line-height:1.15;margin:0 0 8px;
}
.manga-panel.note .manga-headline{font-size:20px;}
.manga-date{font-family:var(--font-data);font-size:10px;color:var(--text-low);margin-bottom:10px;}
.manga-excerpt{font-size:14px;color:var(--text-mid);line-height:1.55;}
.manga-panel-image{
  width:100%;aspect-ratio:16/9;margin-bottom:12px;overflow:hidden;
  border:1px solid var(--border-glass);transform:rotate(0.6deg);
}
.manga-panel-image img{width:100%;height:100%;object-fit:cover;filter:contrast(1.05) saturate(0.9);}

.article-modal{max-width:640px;}
.article-full-headline{font-family:var(--font-voice);font-size:28px;font-weight:900;margin:0 0 8px;}
.article-full-body{font-size:15px;line-height:1.7;color:var(--text-mid);white-space:pre-wrap;}

/* ===== Photo wall — flip cards (2–3 per row grid) ===== */
.photo-wall{
  display:grid;grid-template-columns:repeat(6,1fr);
  gap:10px;padding:12px 4px;align-items:start;
}
@media(max-width:720px){
  .photo-wall{grid-template-columns:repeat(4,1fr);gap:8px;}
}

.photo-flip{
  grid-column:span 2;
  width:100%!important;min-width:0!important;max-width:none!important;flex:none!important;
  break-inside:avoid;margin-bottom:0;
  transform:rotate(var(--rot,0deg)) translate(var(--shift-x,0px), var(--shift-y,0px));
  transition:transform 0.35s ease,z-index 0s;
  position:relative;cursor:pointer;
  perspective:1200px;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,0.28));
}
.photo-flip.layout-wide{grid-column:span 3;}
@media(max-width:720px){
  .photo-flip,.photo-flip.layout-wide{grid-column:span 2;}
}
.photo-flip:hover:not(.is-flipped){
  transform:rotate(calc(var(--rot,0deg) * 0.5)) translate(var(--shift-x,0px), calc(var(--shift-y,0px) - 4px));z-index:4;
}
.photo-flip.has-story .photo-flip-front{
  box-shadow:0 0 0 1px color-mix(in srgb,var(--flip-neon) 35%,transparent),
    0 0 20px color-mix(in srgb,var(--flip-neon) 15%,transparent);
}
.photo-flip.is-flipped{
  transform:rotate(0deg) scale(1.05);z-index:6;
}

.photo-flip-scene{
  padding:10px 10px 12px;
  background:rgba(24,14,40,0.75);
  border:2px solid color-mix(in srgb,var(--flip-neon) 30%,var(--border-glass));
  box-shadow:0 4px 24px rgba(0,0,0,0.35);
  position:relative;
}
.photo-flip-scene::before{
  content:'';position:absolute;top:5px;left:5px;right:5px;bottom:5px;
  border:1px dashed color-mix(in srgb,var(--flip-neon) 25%,transparent);
  pointer-events:none;z-index:2;
}

.photo-flip-inner{
  position:relative;width:100%;
  transform-style:preserve-3d;
  transition:transform 0.75s cubic-bezier(0.4,0.2,0.2,1);
}
.photo-flip.is-flipped .photo-flip-inner{transform:rotateY(180deg);}

.photo-flip-face{
  backface-visibility:hidden;-webkit-backface-visibility:hidden;
  border-radius:2px;overflow:hidden;
}
.photo-flip-front{position:relative;transform:rotateY(0deg);}
.photo-flip-back{
  position:absolute;inset:0;
  transform:rotateY(180deg);
  background:linear-gradient(160deg,rgba(20,10,32,0.98),rgba(12,8,22,0.99));
  border:1px solid color-mix(in srgb,var(--flip-neon) 45%,transparent);
  box-shadow:inset 0 0 40px color-mix(in srgb,var(--flip-neon) 8%,transparent);
  overflow:hidden;
}

.photo-flip.size-lg .photo-frame{aspect-ratio:3/4;}
.photo-flip.size-md .photo-frame{aspect-ratio:4/3;}
.photo-flip.size-sm .photo-frame{aspect-ratio:1/1;}

.photo-frame{
  width:100%;overflow:hidden;background:#0a0610;
  filter:contrast(1.08) saturate(0.9);
}
.photo-frame img{width:100%;height:100%;object-fit:cover;display:block;}
.photo-placeholder{
  width:100%;height:100%;min-height:120px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-sketch);font-size:28px;color:var(--flip-neon,var(--text-low));opacity:0.55;
  background:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(255,255,255,0.02) 11px);
}
.photo-caption{
  font-family:var(--font-sketch);font-size:16px;color:var(--text-mid);
  margin-top:8px;text-align:center;line-height:1.2;padding:0 4px;
}
.flip-hint-front{
  position:absolute;bottom:36px;right:8px;
  font-family:var(--font-data);font-size:9px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--flip-neon,var(--neon-cyan));
  background:rgba(11,7,20,0.82);padding:3px 7px;border:1px solid color-mix(in srgb,var(--flip-neon) 50%,transparent);
  opacity:0;transition:opacity 0.2s;pointer-events:none;
}
.photo-flip:hover .flip-hint-front{opacity:1;}

.flip-back-inner{
  height:100%;padding:14px 12px 28px;overflow-y:auto;
  display:flex;flex-direction:column;gap:8px;
}
.flip-caption{
  font-family:var(--font-sketch);font-size:20px;margin:0;line-height:1.15;
  color:var(--text-hi);text-shadow:0 0 12px color-mix(in srgb,var(--flip-neon) 40%,transparent);
}
.flip-place{
  font-family:var(--font-display);font-size:12px;font-weight:600;
  color:var(--flip-neon,var(--neon-cyan));margin:0;letter-spacing:0.04em;
}
.flip-details{display:flex;flex-direction:column;gap:6px;margin:2px 0;}
.flip-row{
  display:flex;flex-direction:column;gap:2px;
  font-size:11px;line-height:1.35;padding-bottom:6px;
  border-bottom:1px dashed color-mix(in srgb,var(--flip-neon) 20%,transparent);
}
.flip-label{
  font-family:var(--font-data);font-size:9px;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--text-low);
}
.flip-row span:last-child{color:var(--text-mid);}
.flip-desc{
  font-size:12px;line-height:1.55;color:var(--text-mid);margin:0;
}
.flip-story{
  font-family:var(--font-sketch);font-size:15px;line-height:1.45;
  color:var(--text-hi);margin:4px 0 0;padding:8px 0 0;
  border-top:1px solid color-mix(in srgb,var(--flip-neon) 30%,transparent);
  font-style:italic;
}
.flip-empty{font-size:12px;color:var(--text-low);font-style:italic;margin:8px 0;}
.flip-edit-btn{margin-top:auto;font-size:11px;padding:6px 12px;align-self:flex-start;}
.flip-hint-back{
  position:absolute;bottom:8px;right:10px;
  font-family:var(--font-data);font-size:8px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--text-low);opacity:0.6;
}

/* ===== Wire / contact ===== */
.terminal{
  background:#0d0716;border:1px solid rgba(79,163,255,0.3);border-radius:4px;padding:16px;
  font-family:var(--font-data);font-size:13px;color:var(--neon-blue);
  max-height:280px;overflow-y:auto;margin-bottom:12px;
}
.terminal .line{margin-bottom:8px;opacity:0.9;}
.terminal .line .who{color:var(--neon-pink);}
.comm-input{display:flex;flex-wrap:wrap;gap:8px;}
.comm-input input{
  flex:1;min-width:140px;background:rgba(255,255,255,0.05);border:1px solid var(--border-glass);
  border-radius:4px;padding:10px 12px;color:var(--text-hi);font-family:var(--font-data);
}

/* ===== Modals ===== */
.modal-back{
  position:fixed;inset:0;background:rgba(6,3,12,0.82);z-index:60;
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.modal-back.hidden{display:none;}
.modal{
  width:100%;max-width:480px;max-height:88vh;overflow-y:auto;
  background:var(--panel-solid);border:2px solid var(--border-glass);
  border-radius:4px;padding:24px;position:relative;
}
.modal h3{font-family:var(--font-display);margin:0 0 14px;}
.modal-close{
  position:absolute;top:10px;right:14px;background:none;border:none;
  color:var(--text-mid);font-size:24px;cursor:pointer;line-height:1;
}
.modal-close:hover{color:var(--neon-pink);}

.field{margin-bottom:14px;}
.field label{display:block;font-size:12px;color:var(--text-mid);margin-bottom:6px;}
.field input,.field textarea,.field select{
  width:100%;background:rgba(255,255,255,0.05);border:1px solid var(--border-glass);
  border-radius:4px;padding:9px 11px;color:var(--text-hi);font-size:14px;
}
.field textarea{min-height:70px;resize:vertical;}
.field-row{display:flex;gap:10px;}
.field-row .field{flex:1;}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;}

button.btn{
  font-size:13px;padding:9px 18px;border-radius:4px;
  border:1px solid var(--border-glass);background:none;color:var(--text-mid);cursor:pointer;
  transform:rotate(-0.3deg);
}
button.btn.primary{background:var(--neon-pink);border-color:var(--neon-pink);color:#2a0a20;font-weight:600;}
button.btn:hover{border-color:var(--neon-cyan);color:var(--text-hi);}
button.btn.primary:hover{opacity:0.9;color:#2a0a20;}

.empty-hint{color:var(--text-low);font-size:13px;padding:20px 0;text-align:center;font-style:italic;}

/* ===== CDrama deck ===== */
.drama-deck{
  display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start;
}
.drama-card{
  width:280px;flex-shrink:0;transform:rotate(var(--drot,0deg));
  border:2px solid color-mix(in srgb,var(--media-neon,var(--border-glass)) 45%,var(--border-glass));
  border-radius:6px;overflow:hidden;
  background:linear-gradient(165deg,#1a0e2e,#0f0818);
  transition:transform 0.25s ease,box-shadow 0.25s;
  box-shadow:0 0 14px color-mix(in srgb,var(--media-neon,transparent) 12%,transparent);
}
.drama-card:hover{
  transform:rotate(0deg) translateY(-6px);
  box-shadow:0 0 32px color-mix(in srgb,var(--media-neon,var(--neon-pink)) 28%,transparent);
  border-color:color-mix(in srgb,var(--media-neon,var(--neon-pink)) 55%,var(--border-glass));
}
.drama-card.status-watching{border-top:3px solid var(--media-neon,var(--neon-pink));}
.drama-card.status-completed{border-top:3px solid var(--neon-cyan);}
.home-drama-type{font-size:9px;color:var(--text-low);letter-spacing:0.06em;text-transform:uppercase;display:block;margin-top:2px;}
.drama-card-art{
  aspect-ratio:16/10;background:linear-gradient(135deg,rgba(244,63,142,0.15),rgba(79,163,255,0.1));
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.drama-card-art img{width:100%;height:100%;object-fit:cover;}
.drama-art-ph{font-family:var(--font-sketch);font-size:48px;color:var(--text-low);opacity:0.4;}
.drama-card-body{padding:14px 16px 16px;}
.drama-card-top{display:flex;justify-content:space-between;margin-bottom:6px;}
.drama-status{font-family:var(--font-data);font-size:9px;letter-spacing:0.08em;text-transform:uppercase;color:var(--neon-pink);}
.drama-rating{font-family:var(--font-data);font-size:11px;color:var(--neon-cyan);}
.drama-card-title{font-family:var(--font-display);font-size:16px;margin:0 0 4px;}
.drama-card-genre{font-size:11px;color:var(--text-low);margin-bottom:12px;}
.drama-ep-label{font-family:var(--font-data);font-size:10px;color:var(--text-mid);}
.drama-ep-bar{height:5px;background:rgba(255,255,255,0.07);border-radius:2px;margin-top:6px;overflow:hidden;}
.drama-ep-bar div{height:100%;background:linear-gradient(90deg,var(--neon-pink),var(--neon-violet));border-radius:2px;}
.drama-card-notes{font-size:12px;color:var(--text-mid);margin:10px 0 0;font-style:italic;line-height:1.4;}
.drama-ep-controls{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap;}
.drama-ep-controls .btn{padding:5px 10px;font-size:11px;}

/* ===== Player Profile ===== */
.about-bio{line-height:1.65;font-size:15px;}
.about-stats-row{display:flex;flex-wrap:wrap;gap:16px;font-size:14px;color:var(--text-mid);}
.about-stats-row strong{color:var(--neon-cyan);font-family:var(--font-display);font-size:18px;}
.about-avatar-panel{display:flex;align-items:center;justify-content:center;}
.about-avatar{width:100px;height:120px;border:2px solid var(--border-glass);transform:rotate(-2deg);overflow:hidden;display:flex;align-items:center;justify-content:center;background:rgba(233,79,245,0.1);}
.about-avatar img{width:100%;height:100%;object-fit:cover;}
.avatar-initial{font-family:var(--font-display);font-size:40px;color:var(--neon-pink);}

/* ===== Today hero (Daily Log) ===== */
.today-hero{
  position:relative;padding:28px 24px 24px;margin-bottom:24px;
  border:2px solid var(--today-neon,var(--neon-pink));border-radius:6px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--today-neon,var(--neon-pink)) 12%,transparent),rgba(79,163,255,0.08),rgba(24,14,40,0.9));
  overflow:hidden;cursor:pointer;transform:rotate(-0.4deg);
  box-shadow:0 0 40px color-mix(in srgb,var(--today-neon,var(--neon-pink)) 18%,transparent), inset 0 0 60px color-mix(in srgb,var(--today-neon) 5%,transparent);
}
.today-hero.today-empty{border-color:var(--border-glass);box-shadow:none;background:var(--panel);}
.today-glow{
  position:absolute;top:-40%;right:-10%;width:200px;height:200px;
  background:radial-gradient(circle,rgba(255,79,216,0.2),transparent 70%);pointer-events:none;
}
.today-label{
  font-family:var(--font-data);font-size:11px;letter-spacing:0.2em;color:var(--neon-pink);
  text-shadow:0 0 12px var(--neon-pink);
}
.today-date{font-family:var(--font-voice);font-size:22px;font-weight:700;margin:6px 0 14px;}
.today-mood-ring{
  display:inline-flex;align-items:center;justify-content:center;
  width:52px;height:52px;border-radius:50%;border:3px solid var(--mc);
  font-family:var(--font-display);font-size:20px;font-weight:700;color:var(--mc);
  box-shadow:0 0 16px color-mix(in srgb,var(--mc) 40%,transparent);margin-bottom:12px;
}
.today-quick-stats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px;}
.today-quick-stats span{
  font-family:var(--font-data);font-size:11px;padding:4px 10px;
  background:rgba(0,0,0,0.25);border:1px solid var(--border-glass);border-radius:2px;
}
.today-diary-snippet{font-size:14px;color:var(--text-mid);line-height:1.5;font-style:italic;margin:0 0 12px;}
.today-photo-strip{display:flex;gap:8px;overflow-x:auto;margin-bottom:12px;}
.today-photo-strip img{height:64px;border-radius:3px;border:1px solid var(--border-glass);object-fit:cover;}
.today-empty-msg{color:var(--text-low);font-style:italic;margin:0 0 12px;}
.today-edit-btn{position:relative;z-index:2;}

.log-month-label{
  font-family:var(--font-voice);font-size:18px;color:var(--text-mid);
  margin-bottom:14px;transform:rotate(-0.3deg);
}

/* ===== Past day cards ===== */
.past-days-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;
}
.past-day-card{
  padding:16px;border:2px solid color-mix(in srgb,var(--day-neon,var(--border-glass)) 40%,var(--border-glass));
  border-left:4px solid var(--day-neon,var(--mc,var(--neon-purple)));
  background:var(--panel);transform:rotate(var(--rot,0deg));cursor:pointer;
  transition:transform 0.2s,box-shadow 0.2s;
  box-shadow:0 0 12px color-mix(in srgb,var(--day-neon,transparent) 10%,transparent);
}
.past-day-card:hover{
  transform:rotate(0deg) translateY(-4px);
  box-shadow:0 8px 28px color-mix(in srgb,var(--day-neon,var(--mc,var(--neon-purple))) 22%,transparent);
  border-color:color-mix(in srgb,var(--day-neon,var(--mc)) 50%,var(--border-glass));
}
.pdc-date{font-family:var(--font-sketch);font-size:17px;color:var(--text-hi);}
.pdc-mood{font-family:var(--font-data);font-size:11px;color:var(--mc);float:right;}
.pdc-stats{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0;font-family:var(--font-data);font-size:10px;color:var(--text-mid);}
.pdc-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px;}
.pdc-tags span{font-size:9px;padding:2px 6px;background:rgba(255,255,255,0.04);border:1px solid var(--border-glass);}
.pdc-hobby{font-size:11px;color:var(--neon-cyan);margin-bottom:6px;}
.pdc-diary{font-size:12px;color:var(--text-mid);font-style:italic;line-height:1.4;margin:0;}
.pdc-photos{display:flex;gap:6px;margin-top:10px;}
.pdc-photos img{height:48px;border-radius:2px;object-fit:cover;}

/* ===== Day modal detail ===== */
.day-modal-wide{max-width:620px;}
.day-detail-header{margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid var(--mc,var(--neon-purple));}
.day-detail-date{font-family:var(--font-voice);font-size:20px;display:block;}
.day-detail-mood{font-family:var(--font-data);font-size:12px;color:var(--mc);}
.day-stat-blocks{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px;}
.day-stat-block{text-align:center;padding:10px 14px;background:rgba(0,0,0,0.2);border:1px solid var(--border-glass);transform:rotate(-0.5deg);}
.dsb-num{display:block;font-family:var(--font-display);font-size:22px;color:var(--neon-cyan);}
.dsb-lbl{font-family:var(--font-data);font-size:9px;color:var(--text-low);text-transform:uppercase;}
.day-detail-section{margin-top:14px;}
.day-detail-section h4{font-family:var(--font-sketch);font-size:18px;color:var(--neon-pink);margin:0 0 6px;}
.day-tags{display:flex;flex-wrap:wrap;gap:6px;}
.day-tags span{font-size:11px;padding:4px 8px;border:1px dashed var(--border-glass);transform:rotate(-0.3deg);}
.day-diary{font-size:14px;line-height:1.65;color:var(--text-mid);white-space:pre-wrap;margin:0;}
.day-photo-grid{display:flex;flex-wrap:wrap;gap:8px;}
.day-photo-grid img{max-height:100px;border-radius:3px;border:1px solid var(--border-glass);}
.day-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
@media(max-width:520px){.day-form-grid{grid-template-columns:1fr;}}
.field-hint{font-weight:normal;color:var(--text-low);font-size:10px;}
.range-val{font-family:var(--font-data);color:var(--neon-cyan);margin-left:8px;}
.day-photo-preview{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.day-preview-thumb{position:relative;}
.day-preview-thumb img{height:60px;border-radius:3px;}
.day-preview-thumb .remove-photo{
  position:absolute;top:-4px;right:-4px;background:var(--neon-pink);border:none;color:#000;
  width:18px;height:18px;border-radius:50%;cursor:pointer;font-size:12px;line-height:1;
}

/* ===== Drama detail ===== */
.drama-detail-modal{max-width:720px;max-height:90vh;}
.drama-detail-title{font-family:var(--font-voice);font-size:26px;margin:0 0 8px;}
.drama-detail-meta{font-size:13px;color:var(--text-mid);margin-bottom:16px;}
.drama-admin-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.ep-grid-label{font-family:var(--font-sketch);font-size:18px;color:var(--neon-pink);margin:16px 0 10px;}
.ep-grid{display:flex;flex-wrap:wrap;gap:6px;max-height:240px;overflow-y:auto;padding:4px;}
.ep-chip{
  min-width:44px;padding:8px 10px;background:rgba(255,255,255,0.04);
  border:1px solid var(--border-glass);border-radius:3px;cursor:pointer;
  font-family:var(--font-data);font-size:12px;color:var(--text-low);
  transition:all 0.15s;
}
.ep-chip:hover{border-color:var(--neon-cyan);color:var(--text-hi);}
.ep-chip.ep-watched{border-color:rgba(155,92,255,0.4);color:var(--text-mid);}
.ep-chip.ep-reviewed{background:rgba(255,79,216,0.15);border-color:var(--neon-pink);color:var(--neon-pink);}
.ep-avg{display:block;font-size:9px;color:var(--neon-cyan);}
.drama-final-review{margin-top:20px;padding-top:16px;border-top:1px dashed var(--border-glass);}
.drama-final-review h4{font-family:var(--font-sketch);font-size:18px;color:var(--neon-pink);margin:0 0 8px;}
.drama-final-review p{font-size:14px;line-height:1.6;color:var(--text-mid);}

/* ===== Episode review modal ===== */
.episode-modal{max-width:520px;}
.ep-attr-grid{display:flex;flex-direction:column;gap:14px;margin-bottom:14px;}
.ep-attr label{display:block;font-size:13px;margin-bottom:4px;}
.attr-hint{font-size:10px;color:var(--text-low);font-weight:normal;}
.attr-slider{display:flex;align-items:center;gap:10px;}
.attr-slider input{flex:1;}
.attr-val{font-family:var(--font-data);color:var(--neon-cyan);min-width:16px;}
.ep-ro-overall{font-family:var(--font-display);font-size:16px;color:var(--neon-cyan);margin-bottom:10px;}
.ep-ro-attr{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed var(--border-glass);font-size:13px;}
.ep-ro-review{font-size:14px;color:var(--text-mid);line-height:1.5;margin-top:12px;font-style:italic;}

/* ===== Pinboard / Community Board ===== */
.pinboard-layout{display:flex;flex-direction:column;gap:20px;}
.pin-form{margin-bottom:0;}
.pin-wall{
  columns:2 280px;column-gap:16px;
}
@media(max-width:600px){.pin-wall{columns:1;}}
.pin-post,.community-pin{
  break-inside:avoid;margin-bottom:16px;padding:16px;
  background:var(--panel);border:2px solid var(--border-glass);
  border-top:3px solid var(--neon-cyan);
  transform:rotate(var(--prot,0deg));transition:transform 0.2s;
}
.pin-post:hover,.community-pin:hover{
  transform:rotate(0deg);
  box-shadow:0 0 24px color-mix(in srgb,var(--neon-cyan) 25%,transparent);
}
.pin-post-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:10px;}
.pin-meta-block{display:flex;flex-direction:column;gap:4px;}
.pin-name{font-weight:600;font-size:14px;}
.pin-location{font-family:var(--font-data);font-size:11px;color:var(--neon-cyan);}
.pin-mood{font-family:var(--font-data);font-size:11px;color:var(--pmc);}
.pin-photo{margin-bottom:10px;border-radius:3px;overflow:hidden;}
.pin-photo img{width:100%;display:block;}
.pin-photo-sm{max-width:180px;}
.pin-text{font-size:14px;line-height:1.5;color:var(--text-mid);margin:0 0 8px;}
.pin-time{font-family:var(--font-data);font-size:10px;color:var(--text-low);}
.pin-replies{margin:12px 0 10px;padding-left:12px;border-left:2px dashed color-mix(in srgb,var(--neon-cyan) 35%,transparent);display:flex;flex-direction:column;gap:10px;}
.pin-reply{padding:10px;background:color-mix(in srgb,var(--panel) 80%,#000);border:1px dashed var(--border-glass);}
.pin-reply-head{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-bottom:6px;}
.pin-reply-head .pin-name{font-size:12px;}
.pin-reply-head .pin-location,.pin-reply-head .pin-time{font-size:9px;}
.pin-reply-btn{margin-top:4px;font-size:11px;}
.pin-reply-form{margin-top:10px;padding-top:10px;border-top:1px dashed var(--border-glass);}
.pin-reply-form.hidden{display:none;}
.pin-reply-actions{display:flex;gap:8px;margin-top:8px;}
.pin-empty{columns:span 1;text-align:center;padding:40px;}

.drama-card{cursor:pointer;}

/* ===== Responsive ===== */
@media(max-width:820px){
  #app{flex-direction:column;padding-bottom:100px;}
  .sidebar{width:100%;}
  .node-nav{flex-direction:row;overflow-x:auto;padding-bottom:6px;gap:2px;}
  .node-nav::before{
    left:20px;right:20px;top:18px;bottom:auto;height:2px;width:auto;
    background:linear-gradient(90deg,var(--neon-pink),var(--neon-purple),var(--neon-blue),var(--neon-cyan));
  }
  .node-btn{flex-direction:column;gap:5px;font-size:10px;padding:8px;white-space:nowrap;}
  .brand{margin-bottom:12px;}
  .manga-panel,.manga-panel.hero,.manga-panel.wide,.manga-panel.tall,.manga-panel.note{
    grid-column:span 12;grid-row:span 1;
  }
  .poke-flip{width:100%;max-width:280px;}
  .skill-skyline{gap:4px;overflow-x:auto;padding-bottom:8px;}
}

@media(max-width:480px){
  .drama-card{width:100%;max-width:320px;}
  .past-day-card{max-width:100%;}
  .today-hero{padding:20px 16px;}
}

/* ===== Neon dot ratings ===== */
.neon-dots{display:inline-flex;gap:5px;align-items:center;vertical-align:middle;}
.neon-dot{
  width:9px;height:9px;border-radius:50%;
  background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.14);
  flex-shrink:0;
}
.neon-dot.lit{
  background:var(--dot-neon,var(--neon-cyan));
  border-color:var(--dot-neon,var(--neon-cyan));
  box-shadow:0 0 8px var(--dot-neon),0 0 14px color-mix(in srgb,var(--dot-neon) 50%,transparent);
}
.attr-slider{display:flex;align-items:center;gap:12px;}
.attr-slider input[type=range]{flex:1;}
.attr-dots,.ep-dots{display:inline-flex;margin-left:4px;}
.ep-chip .ep-dots{margin-left:6px;vertical-align:middle;}
.ep-ro-attr{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:6px 0;border-bottom:1px dashed var(--border-glass);}
.ep-ro-overall{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-family:var(--font-data);font-size:12px;color:var(--neon-cyan);}

/* ===== Place cards ===== */
.plc-front .pc-foot{display:none;}
.plc-art{background:transparent;border:none;}
.plc-ranks{margin-top:auto;padding-top:8px;display:flex;flex-direction:column;gap:6px;}
.plc-rank-row{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:9px;}
.plc-rank-label{color:var(--text-low);text-transform:uppercase;letter-spacing:0.08em;font-size:8px;flex-shrink:0;}
.plc-desc{margin-top:10px;padding-top:8px;border-top:1px dashed color-mix(in srgb,var(--pc-accent) 25%,transparent);}
.plc-desc p{margin:0;font-size:10px;line-height:1.45;color:var(--text-mid);}
.place-card-editor .place-photo-preview{min-height:120px;}
.pin-form input[type=color]{width:100%;height:36px;padding:2px;border:1px solid var(--border-glass);background:transparent;cursor:pointer;}

/* ===== Daily log calendar ===== */
.log-header-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;}
.log-tally{
  font-family:var(--font-data);font-size:12px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--neon-pink);padding:8px 14px;border:1px solid color-mix(in srgb,var(--neon-pink) 40%,transparent);
  box-shadow:0 0 16px color-mix(in srgb,var(--neon-pink) 15%,transparent);
}
.log-cal-nav{display:flex;align-items:center;gap:10px;}
.cal-nav-btn{padding:4px 12px;font-size:16px;line-height:1;min-width:36px;}
.log-month-label{font-family:var(--font-display);font-size:15px;min-width:140px;text-align:center;}

.log-calendar{
  display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:12px;
  position:relative;z-index:2;
}
.cal-wd{
  font-size:9px;text-align:center;color:var(--text-low);letter-spacing:0.1em;
  text-transform:uppercase;padding:4px 0;
}
.cal-cell{border:none;background:transparent;font:inherit;color:inherit;}
.cal-pad{pointer-events:none;}
.cal-day{
  aspect-ratio:1;min-height:52px;border-radius:4px;cursor:pointer;position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  background:transparent;
  border:2px solid var(--cal-neon,var(--neon-purple));
  box-shadow:0 0 8px color-mix(in srgb,var(--cal-neon) 12%,transparent);
  transition:transform 0.15s,box-shadow 0.15s,background 0.15s;
}
.cal-day:hover{transform:scale(1.06);box-shadow:0 0 20px color-mix(in srgb,var(--cal-neon) 30%,transparent);}
.cal-day.has-entry{
  background:var(--cal-neon);
  border-color:var(--cal-neon);
  box-shadow:0 0 16px color-mix(in srgb,var(--cal-neon) 45%,transparent);
}
.cal-day.has-entry .cal-day-num{color:#0a0612;font-weight:800;}
.cal-day.has-entry .cal-mood{color:rgba(10,6,18,0.75);}
.cal-day.has-entry .cal-dot{background:#0a0612;box-shadow:none;}
.cal-day.is-today{outline:2px solid var(--neon-pink);outline-offset:2px;}
.cal-day.is-editing-day{
  outline:3px solid var(--neon-cyan);outline-offset:2px;
  box-shadow:0 0 24px color-mix(in srgb,var(--neon-cyan) 50%,transparent);
}
.cal-day-num{font-size:14px;font-weight:700;color:var(--text-hi);}
.cal-mood{font-size:9px;color:var(--cal-neon);font-family:var(--font-data);}
.cal-dot{
  position:absolute;bottom:6px;width:6px;height:6px;border-radius:50%;
  background:var(--cal-neon);box-shadow:0 0 8px var(--cal-neon);
}

.log-edit-bar{
  display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:16px 0 8px;
}
.log-edit-hint{font-size:12px;color:var(--text-mid);}
.log-editor-panel.hidden,.daily-log-editor.hidden{display:none;}
.daily-log-editor,.log-editor-panel{
  margin:16px 0 24px;padding:18px 20px;
  border:2px solid color-mix(in srgb,var(--neon-pink) 35%,var(--border-glass));
  background:rgba(18,10,32,0.92);
  box-shadow:0 0 28px color-mix(in srgb,var(--neon-pink) 12%,transparent);
  border-radius:4px;
  position:relative;z-index:2;
}
.log-editor-title{
  font-family:var(--font-voice);font-size:20px;margin:0 0 14px;color:var(--neon-pink);
}
.log-editor-actions{
  display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;margin-top:16px;
}

.day-log-template{margin:12px 0;padding:12px;border:1px dashed color-mix(in srgb,var(--neon-purple) 30%,transparent);}
.dlt-row{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px dashed rgba(255,255,255,0.06);font-size:12px;}
.dlt-row span:first-child{color:var(--text-low);font-size:10px;text-transform:uppercase;letter-spacing:0.06em;}

.about-stats-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:14px 0 8px;}
.about-stat-chip{
  padding:12px 18px;text-align:center;border:2px solid color-mix(in srgb,var(--chip-neon) 45%,var(--border-glass));
  box-shadow:0 0 18px color-mix(in srgb,var(--chip-neon) 18%,transparent);
  transform:rotate(-1deg);min-width:120px;
}
.about-stat-num{display:block;font-family:var(--font-display);font-size:28px;font-weight:800;color:var(--chip-neon);}
.about-stat-lbl{font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-mid);}
.about-arrival-edit{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;justify-content:center;margin:8px 0;max-width:360px;}
.about-arrival-edit input[type=date]{flex:1;min-width:140px;}

/* ===== Player Profile dashboard ===== */
#view-profile{position:relative;}
.profile-hero-wrap{margin-bottom:20px;}
.profile-stage .about-arrival-edit{margin:12px auto 0;}
.profile-id-strip{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:14px 0 6px;}
.profile-id-chip{
  font-family:var(--font-data);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;
  padding:5px 10px;border:1px solid color-mix(in srgb,var(--pic-neon) 50%,var(--border-glass));
  color:var(--pic-neon);background:rgba(0,0,0,0.22);
}
.profile-id-wide{max-width:100%;text-align:center;}
.profile-dashboard{display:flex;flex-direction:column;gap:16px;margin-bottom:24px;}
.profile-stat-group{
  padding:16px 18px;border:2px solid color-mix(in srgb,var(--psg-neon) 35%,var(--border-glass));
  background:linear-gradient(135deg,color-mix(in srgb,var(--psg-neon) 8%,transparent),rgba(12,8,22,0.85));
  transform:rotate(-0.2deg);
}
.profile-stat-group-title{
  font-family:var(--font-data);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--psg-neon);margin:0 0 12px;
}
.profile-stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;}
.profile-stat-cell{
  padding:12px 10px;border:1px solid color-mix(in srgb,var(--psc-neon) 30%,var(--border-glass));
  background:rgba(0,0,0,0.2);text-align:center;
}
.profile-stat-val{display:block;font-family:var(--font-display);font-size:22px;font-weight:800;color:var(--psc-neon);line-height:1.1;}
.profile-stat-lbl{display:block;font-size:9px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-mid);margin-top:4px;}
.profile-stat-sub{display:block;font-size:9px;color:var(--text-low);margin-top:3px;font-style:italic;}
.profile-skill-list{display:flex;flex-direction:column;gap:10px;}
.profile-skill-row{
  padding:10px 12px;border-left:3px solid var(--psr-neon);
  background:rgba(0,0,0,0.22);
}
.profile-skill-head{display:flex;justify-content:space-between;gap:8px;align-items:baseline;margin-bottom:6px;}
.profile-skill-name{font-family:var(--font-voice);font-size:14px;font-weight:700;}
.profile-skill-tier{font-family:var(--font-data);font-size:9px;color:var(--psr-neon);letter-spacing:0.08em;}
.profile-skill-bar{height:6px;background:rgba(255,255,255,0.06);border-radius:2px;overflow:hidden;}
.profile-skill-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--psr-neon),color-mix(in srgb,var(--psr-neon) 40%,#fff));box-shadow:0 0 10px color-mix(in srgb,var(--psr-neon) 50%,transparent);}
.profile-skill-meta{font-size:10px;color:var(--text-low);margin-top:5px;}
.profile-feed-title{font-family:var(--font-sketch);font-size:18px;margin:0 0 12px;color:var(--text-mid);}
.profile-empty{color:var(--text-low);font-style:italic;font-size:13px;margin:0;}

/* ===== System Overload — glitch intro ===== */
body.ogl-active{overflow:hidden;}
.overload-glitch-screen{
  position:fixed;inset:0;z-index:500;display:flex;align-items:center;justify-content:center;
  background:#030108;color:#f0f0f5;font-family:var(--font-data);
}
.overload-glitch-screen.hidden{display:none!important;}
.ogl-scanlines{
  position:absolute;inset:0;pointer-events:none;z-index:3;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.28) 2px,rgba(0,0,0,0.28) 4px);
  animation:oglScan 8s linear infinite;
}
@keyframes oglScan{0%{background-position:0 0;}100%{background-position:0 120px;}}
.ogl-noise{
  position:absolute;inset:0;pointer-events:none;z-index:2;opacity:0.12;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:oglNoise 0.35s steps(4) infinite;
}
@keyframes oglNoise{0%{transform:translate(0,0);}25%{transform:translate(-2%,1%);}50%{transform:translate(1%,-1%);}75%{transform:translate(-1%,2%);}100%{transform:translate(0,0);}}
.ogl-vignette{
  position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,0.75) 100%);
}
.ogl-content{
  position:relative;z-index:4;text-align:center;padding:32px 24px;max-width:min(720px,92vw);
  animation:oglFlicker 4.2s ease infinite;
}
@keyframes oglFlicker{
  0%,92%,100%{opacity:1;filter:none;}
  93%{opacity:0.85;filter:brightness(1.4) hue-rotate(-8deg);}
  94%{opacity:0.4;transform:translateX(3px);}
  95%{opacity:1;transform:translateX(-2px);}
  96%{opacity:0.7;}
}
.ogl-kicker{font-size:11px;letter-spacing:0.22em;color:var(--neon-pink);margin:0 0 20px;}
.ogl-title{
  margin:0 0 16px;font-family:var(--font-display);font-weight:900;line-height:0.92;
  font-size:clamp(48px,14vw,120px);letter-spacing:0.06em;text-transform:uppercase;
}
.ogl-title-line{display:block;}
.ogl-title-glitch{
  color:var(--neon-pink);
  text-shadow:3px 0 var(--neon-cyan),-3px 0 #ff0040,0 0 40px rgba(244,63,142,0.55);
  animation:oglGlitchText 2.8s steps(2) infinite;
}
@keyframes oglGlitchText{
  0%,88%,100%{transform:none;clip-path:none;}
  89%{transform:translate(-4px,1px);clip-path:inset(20% 0 55% 0);}
  90%{transform:translate(5px,-2px);clip-path:inset(60% 0 10% 0);}
  91%{transform:translate(-2px,0);clip-path:inset(40% 0 30% 0);}
}
.ogl-sub{font-size:13px;color:var(--text-mid);margin:0 0 28px;letter-spacing:0.08em;}
.ogl-error-feed{
  text-align:left;max-width:480px;margin:0 auto 28px;padding:14px 16px;
  border:1px solid color-mix(in srgb,var(--neon-pink) 40%,transparent);
  background:rgba(0,0,0,0.55);min-height:120px;overflow:hidden;
  box-shadow:inset 0 0 30px rgba(244,63,142,0.08);
}
.ogl-err{font-size:11px;line-height:1.7;color:var(--neon-cyan);opacity:0.85;}
.ogl-err-in{animation:oglErrIn 0.25s ease;}
@keyframes oglErrIn{from{opacity:0;transform:translateX(-8px);}to{opacity:0.85;transform:none;}}
.ogl-enter-btn{
  font-family:var(--font-data);font-size:12px;letter-spacing:0.18em;
  padding:12px 28px;border:2px solid var(--neon-pink);background:rgba(244,63,142,0.12);
  color:var(--neon-pink);cursor:pointer;text-transform:uppercase;
  box-shadow:0 0 24px rgba(244,63,142,0.25);transition:background 0.2s,box-shadow 0.2s;
}
.ogl-enter-btn:hover{background:rgba(244,63,142,0.28);box-shadow:0 0 36px rgba(244,63,142,0.45);}

/* ===== System Overload Log ===== */
.overload-terminal-modal{
  width:min(920px,96vw);max-height:92vh;overflow:auto;padding:22px 24px 28px;
  border:2px solid var(--neon-cyan);background:linear-gradient(180deg,#0a0614 0%,#120a1e 100%);
  box-shadow:0 0 40px rgba(58,214,224,0.15), inset 0 0 80px rgba(58,214,224,0.03);
  font-family:var(--font-data);
}
.end-day-modal{max-width:520px;}
.day-stream-mini{display:flex;flex-direction:column;gap:6px;}
.dsm-row{display:grid;grid-template-columns:minmax(92px,1fr) 88px 2fr;gap:8px;font-size:11px;padding:6px 8px;border-left:2px solid var(--dsm-neon);background:rgba(0,0,0,0.2);}
.dsm-row span:first-child{color:var(--dsm-neon);font-family:var(--font-data);}
.overload-auth-modal{max-width:360px;}
.overload-auth-hint{font-size:12px;color:var(--text-low);margin:0 0 12px;}
.ol-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;flex-wrap:wrap;}
.ol-kicker{font-size:10px;letter-spacing:0.2em;color:var(--neon-cyan);margin:0 0 6px;opacity:0.8;}
.ol-title{font-family:var(--font-display);font-size:clamp(20px,3vw,28px);margin:0;color:var(--text-hi);letter-spacing:0.04em;}
.ol-sub{font-size:12px;color:var(--text-mid);margin:6px 0 0;}
.ol-list{display:flex;flex-direction:column;gap:12px;}
.ol-card{
  padding:14px 16px;border:1px solid color-mix(in srgb,var(--neon-purple) 35%,var(--border-glass));
  background:rgba(0,0,0,0.28);cursor:default;
}
.ol-card-head{margin-bottom:8px;}
.ol-card-date{font-size:10px;color:var(--neon-cyan);letter-spacing:0.12em;}
.ol-card-title{font-family:var(--font-voice);font-size:16px;margin:4px 0 0;}
.ol-card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;}
.ol-tag{
  font-size:10px;padding:3px 8px;border:1px solid color-mix(in srgb,var(--olt-neon) 45%,var(--border-glass));
  color:var(--olt-neon);
}
.ol-card-snippet{font-size:12px;color:var(--text-mid);line-height:1.5;margin:0;}
.ol-card-cmd{font-size:11px;color:var(--neon-cyan);margin:8px 0 0;font-family:monospace;}
.ol-card-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
.ol-card-actions .btn{font-size:11px;padding:5px 10px;}
.ol-empty{color:var(--text-low);font-style:italic;padding:20px 0;}
.ol-form{display:flex;flex-direction:column;gap:14px;}
.ol-form-grid{display:grid;grid-template-columns:1fr 2fr;gap:12px;}
@media(max-width:640px){.ol-form-grid{grid-template-columns:1fr;}}
.ol-section h3,.ol-section h4{font-size:11px;letter-spacing:0.14em;color:var(--neon-cyan);margin:0 0 6px;}
.ol-emotion-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;}
.ol-emotion{
  display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid color-mix(in srgb,var(--ole-neon) 30%,var(--border-glass));
  background:rgba(0,0,0,0.2);font-size:11px;cursor:pointer;
}
.ol-emotion input{accent-color:var(--ole-neon);}
.ol-rant{
  width:100%;min-height:160px;background:rgba(0,0,0,0.35);border:1px solid var(--border-glass);
  color:var(--text-hi);padding:12px;font-family:monospace;font-size:12px;line-height:1.55;resize:vertical;
}
.ol-prompt-field textarea{width:100%;background:rgba(0,0,0,0.25);border:1px solid var(--border-glass);color:var(--text-hi);padding:8px;font-size:12px;}
.ol-command-wrap{display:flex;align-items:center;gap:8px;border:1px solid var(--neon-cyan);padding:8px 12px;background:rgba(0,0,0,0.3);}
.ol-prompt-char{color:var(--neon-cyan);font-family:monospace;font-size:16px;}
.ol-command-wrap input{flex:1;border:none;background:transparent;color:var(--neon-cyan);font-family:monospace;font-size:13px;outline:none;}
.ol-read-rant{
  white-space:pre-wrap;font-family:monospace;font-size:12px;line-height:1.6;
  background:rgba(0,0,0,0.3);padding:14px;border:1px solid var(--border-glass);margin:0;
}
.ol-read-prompt{margin-bottom:10px;}
.ol-read-prompt-label{font-size:10px;color:var(--neon-cyan);letter-spacing:0.1em;margin-bottom:4px;}
.ol-read-prompt p{margin:0;font-size:12px;line-height:1.5;color:var(--text-mid);}
.ol-read-cmd{font-family:monospace;color:var(--neon-cyan);font-size:14px;}
.ol-del-btn{border-color:var(--neon-pink)!important;color:var(--neon-pink)!important;}

/* ===== Coming To You Live ===== */
.live-broadcast{
  display:grid;grid-template-columns:minmax(220px,280px) 1fr;gap:20px;align-items:stretch;min-height:min(72vh,720px);
}
.live-rail-col{
  display:flex;flex-direction:column;min-height:0;border:2px solid color-mix(in srgb,var(--neon-purple) 35%,var(--border-glass));
  background:linear-gradient(180deg,rgba(8,5,16,0.95),rgba(12,8,22,0.88));
  box-shadow:0 0 28px rgba(155,92,255,0.12);
}
.live-rail-head{
  display:flex;justify-content:space-between;align-items:center;padding:12px 14px 10px;
  border-bottom:1px solid var(--border-glass);flex-shrink:0;
}
.live-rail-label{font-family:var(--font-data);font-size:10px;letter-spacing:0.18em;text-transform:uppercase;color:var(--neon-purple);}
.live-rail-count{font-family:var(--font-data);font-size:9px;color:var(--text-low);}
.live-rail-scroll{
  flex:1;overflow-y:auto;overflow-x:hidden;padding:14px 10px 18px 6px;
  scrollbar-width:thin;scrollbar-color:var(--neon-purple) transparent;
}
.live-rail-scroll::-webkit-scrollbar{width:6px;}
.live-rail-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--neon-purple) 50%,transparent);border-radius:3px;}
.live-rail-track{position:relative;padding-left:34px;min-height:100%;}
.live-rail-spine{
  position:absolute;left:15px;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--neon-cyan),var(--neon-purple),var(--neon-pink),transparent);
  box-shadow:0 0 12px rgba(58,214,224,0.35);border-radius:2px;
}
.live-rail-empty{position:relative;padding:20px 10px 20px 34px;color:var(--text-low);font-size:12px;font-style:italic;}
.live-rail-nodes{display:flex;flex-direction:column;gap:0;}
.live-node{
  position:relative;display:flex;gap:12px;align-items:flex-start;padding:0 0 22px 0;
}
.live-node-marker{
  position:absolute;left:-34px;top:2px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;z-index:2;
}
.live-node-glow{
  position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--ln-neon) 55%,transparent),transparent 70%);
  animation:liveNodePulse 2.4s ease infinite;
}
@keyframes liveNodePulse{0%,100%{opacity:0.55;transform:scale(1);}50%{opacity:1;transform:scale(1.15);}}
.live-node-core{
  position:relative;width:14px;height:14px;border-radius:50%;background:var(--ln-neon);
  box-shadow:0 0 14px var(--ln-neon),0 0 24px color-mix(in srgb,var(--ln-neon) 40%,transparent);
  font-size:0;line-height:0;
}
.live-node-card{
  flex:1;padding:10px 12px;border:1px solid color-mix(in srgb,var(--ln-neon) 35%,var(--border-glass));
  background:rgba(0,0,0,0.32);border-left:3px solid var(--ln-neon);
}
.live-node-top{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-bottom:5px;}
.live-node-time{font-family:var(--font-data);font-size:12px;font-weight:700;color:var(--ln-neon);letter-spacing:0.06em;}
.live-node-type{font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-mid);}
.live-node-gap{font-size:9px;color:var(--text-low);font-style:italic;}
.live-node-text{margin:0;font-size:13px;line-height:1.45;color:var(--text-hi);}

.live-stage-col{display:flex;flex-direction:column;gap:14px;min-width:0;}
.live-on-air{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding:12px 16px;
  border:2px solid var(--border-glass);background:rgba(0,0,0,0.25);
}
.live-on-air.is-live{border-color:color-mix(in srgb,var(--neon-pink) 55%,var(--border-glass));box-shadow:0 0 24px rgba(255,79,216,0.15);}
.live-on-air-dot{width:10px;height:10px;border-radius:50%;background:#555;flex-shrink:0;}
.live-on-air.is-live .live-on-air-dot{background:var(--neon-pink);box-shadow:0 0 12px var(--neon-pink);animation:adminPulse 1.2s ease infinite;}
.live-on-air-text{font-family:var(--font-display);font-size:14px;letter-spacing:0.12em;text-transform:uppercase;}
.live-on-air-date{margin-left:auto;font-family:var(--font-data);font-size:10px;color:var(--text-mid);}
.live-clocks-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.live-clock-card{
  padding:14px 16px;border:2px solid color-mix(in srgb,var(--neon-cyan) 30%,var(--border-glass));
  background:rgba(0,0,0,0.28);
}
.live-clock-city{display:block;font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-low);}
.live-clock-val{display:block;font-family:var(--font-display);font-size:clamp(26px,4vw,38px);font-weight:800;color:var(--neon-cyan);margin:4px 0;text-shadow:0 0 18px rgba(58,214,224,0.3);}
.live-clock-tz{font-size:9px;color:var(--text-low);font-family:var(--font-data);}
.live-status-bar{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:11px;color:var(--text-mid);font-family:var(--font-data);}
.live-controls{display:flex;gap:10px;flex-wrap:wrap;}
.live-controls .btn[disabled]{opacity:0.35;cursor:not-allowed;}
.live-pulse-board{
  padding:14px 16px;border:2px solid color-mix(in srgb,var(--neon-pink) 30%,var(--border-glass));
  background:rgba(0,0,0,0.22);
}
.live-pulse-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.live-pulse-title{margin:0 0 4px;font-family:var(--font-voice);font-size:16px;}
.live-pulse-hint{margin:0;font-size:11px;color:var(--text-low);max-width:520px;}
.live-pulse-quick{display:flex;flex-wrap:wrap;gap:8px;}
.pulse-quick-btn{
  font-size:10px;padding:6px 10px;border:1px solid color-mix(in srgb,var(--pq-neon) 40%,var(--border-glass));
  background:rgba(0,0,0,0.28);color:var(--text-hi);cursor:pointer;font-family:var(--font-data);
  letter-spacing:0.06em;
}
.pulse-quick-btn:hover{border-color:var(--pq-neon);box-shadow:0 0 12px color-mix(in srgb,var(--pq-neon) 35%,transparent);}
.pulse-composer-modal{width:min(760px,96vw);max-height:92vh;overflow:auto;}
.pulse-when-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.pulse-type-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;max-height:220px;overflow-y:auto;padding:4px;}
.pulse-type-btn{
  display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 6px;
  border:1px solid color-mix(in srgb,var(--pt-neon) 30%,var(--border-glass));background:rgba(0,0,0,0.25);
  cursor:pointer;font-size:9px;color:var(--text-mid);font-family:var(--font-data);
}
.pulse-type-btn.active,.pulse-type-btn:hover{border-color:var(--pt-neon);color:var(--text-hi);box-shadow:0 0 10px color-mix(in srgb,var(--pt-neon) 30%,transparent);}
.pulse-type-icon{font-size:16px;line-height:1;}
.pulse-type-label{letter-spacing:0.05em;text-align:center;line-height:1.2;}
.pulse-photo-preview{margin-top:8px;}
.pulse-photo-preview img{max-width:100%;max-height:180px;border:1px solid var(--border-glass);}
.live-node-mood{font-size:9px;padding:2px 6px;border:1px solid color-mix(in srgb,var(--ln-neon) 45%,var(--border-glass));color:var(--ln-neon);}
.live-node-body{margin:6px 0 0;font-size:11px;line-height:1.5;color:var(--text-mid);white-space:pre-wrap;}
.live-node-photo{margin-top:8px;border:1px solid color-mix(in srgb,var(--ln-neon) 25%,var(--border-glass));overflow:hidden;}
.live-node-photo img{display:block;width:100%;max-height:140px;object-fit:cover;}
.live-stats-panel{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;
  padding:14px;border:1px dashed var(--border-glass);
}
.live-stat{text-align:center;padding:8px;}
.live-stat-num{display:block;font-family:var(--font-display);font-size:22px;font-weight:800;color:var(--neon-cyan);}
.live-stat-lbl{font-size:9px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-low);}

/* ===== System Failure mind channel — broken cyberpunk ===== */
#view-mind{display:none;}
#view-mind.active{display:block;}
body.mind-channel-open .sidebar{opacity:0.35;filter:saturate(0.6);}
.mind-view{--sec-neon:#f43f8e;}
.sys-flicker{animation:sysFlicker 3.5s steps(2) infinite;}
@keyframes sysFlicker{
  0%,94%,100%{opacity:1;}
  95%{opacity:0.45;}
  96%{opacity:0.9;}
  97%{opacity:0.3;}
}
.sys-broken{
  position:relative;
}
.sys-broken::before{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:0;
  background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(244,63,142,0.03) 3px,rgba(244,63,142,0.03) 6px);
}
.sys-panel{
  position:relative;z-index:1;
  border:1px solid color-mix(in srgb,var(--sec-neon,#f43f8e) 35%,var(--border-glass));
  background:linear-gradient(135deg,rgba(8,4,14,0.92),rgba(14,6,20,0.78));
  box-shadow:inset 0 0 40px rgba(244,63,142,0.04),0 0 20px rgba(0,0,0,0.4);
}
.sys-corrupt::after{
  content:'CORRUPT';position:absolute;top:8px;right:10px;font-size:8px;letter-spacing:0.2em;
  color:var(--neon-pink);opacity:0.35;pointer-events:none;
}
.sys-input{
  background:rgba(0,0,0,0.45)!important;border:1px solid color-mix(in srgb,var(--sec-neon,#f43f8e) 25%,var(--border-glass))!important;
  color:var(--text-hi)!important;
}
.sys-input:focus{outline:none;border-color:var(--neon-pink)!important;box-shadow:0 0 12px rgba(244,63,142,0.2);}
.sys-btn{border-color:var(--neon-pink)!important;color:#fff!important;background:color-mix(in srgb,var(--neon-pink) 55%,#1a0812)!important;box-shadow:0 0 16px rgba(244,63,142,0.35);}
.ol-btn-finished,.ol-btn-new{
  color:#fff!important;background:linear-gradient(135deg,#c2185b,#f43f8e)!important;
  border:2px solid #ff6b9d!important;font-weight:700;letter-spacing:0.08em;
  box-shadow:0 0 20px rgba(244,63,142,0.45)!important;text-shadow:0 1px 2px rgba(0,0,0,0.5);
}
.ol-btn-finished:hover,.ol-btn-new:hover{filter:brightness(1.15);}
.mind-exit-btn{
  border-color:#6ee7a0!important;color:#0a1a0f!important;background:color-mix(in srgb,#6ee7a0 75%,#0a1a0f)!important;
  font-weight:700;z-index:20;position:relative;box-shadow:0 0 16px rgba(110,231,160,0.4);
}
.mind-channel-header{z-index:10;position:relative;}
.ol-parse-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:12px 16px;border-bottom:1px dashed var(--border-glass);}
.ol-parse-summary.ol-parse-pending{opacity:0.65;}
.ol-parse-stat{text-align:center;padding:8px;border:1px solid color-mix(in srgb,var(--neon-cyan) 30%,transparent);}
.ol-parse-stat.discard{border-color:color-mix(in srgb,var(--neon-pink) 40%,transparent);}
.ol-parse-stat strong{display:block;font-size:20px;color:var(--neon-cyan);}
.ol-parse-stat.discard strong{color:var(--neon-pink);}
.ol-parse-stat span{font-size:9px;color:var(--text-low);letter-spacing:0.1em;text-transform:uppercase;}
.ol-term-log.typing{min-height:280px;}
.ol-term-line.ol-line-rephrase p{color:var(--text-hi);font-weight:600;font-size:14px;}
.ol-classify-panel{
  margin:14px 16px;padding:14px;border:2px dashed color-mix(in srgb,var(--neon-cyan) 45%,var(--border-glass));
  background:rgba(0,0,0,0.35);
}
.ol-classify-panel.hidden{display:none!important;}
.ol-classify-kicker{font-family:var(--font-data);font-size:10px;letter-spacing:0.12em;color:var(--neon-cyan);margin:0 0 8px;}
.ol-classify-suggest{margin:0 0 6px;font-size:13px;}
.ol-classify-why{margin:0 0 12px;font-size:12px;color:var(--text-mid);line-height:1.45;}
.ol-classify-controls{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:10px;}
.ol-classify-label{font-size:9px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-low);min-width:56px;}
.ol-classify-btn.active{border-color:var(--neon-cyan)!important;color:var(--neon-cyan)!important;}
.ol-classify-accept{margin-top:4px;}
.pc-card-actions{margin:10px 0;padding-top:8px;border-top:1px dashed color-mix(in srgb,var(--pc-accent) 30%,transparent);}
.pc-card-actions .btn{font-size:11px;width:100%;}
.pulse-card-new{margin-top:8px;}
.pulse-card-new.hidden{display:none!important;}
.pulse-card-hint.hidden{display:none;}
.pulse-card-select{width:100%;}

.profile-console-wrap{
  margin-top:14px;padding:12px 14px;
  border:1px dashed color-mix(in srgb,var(--neon-cyan) 35%,var(--border-glass));
  background:rgba(0,0,0,0.35);
  font-family:var(--font-data);
}
.profile-console-label{display:block;font-size:9px;letter-spacing:0.16em;color:var(--neon-cyan);margin-bottom:8px;}
.profile-console-row{display:flex;align-items:center;gap:8px;}
.profile-console-prompt{color:var(--neon-pink);font-weight:700;}
.profile-console-input{
  flex:1;background:transparent;border:none;border-bottom:1px solid color-mix(in srgb,var(--neon-cyan) 40%,transparent);
  color:var(--text-hi);font-family:var(--font-data);font-size:13px;padding:6px 4px;outline:none;
}
.profile-console-input:focus{border-bottom-color:var(--neon-cyan);box-shadow:0 2px 0 color-mix(in srgb,var(--neon-cyan) 30%,transparent);}

.skill-card-deck{margin-bottom:20px;}
.skc-front .skc-art{
  display:flex;align-items:center;justify-content:center;min-height:120px;margin:8px 0;
}
.skc-glyph{
  font-family:var(--font-display);font-size:56px;font-weight:800;
  color:var(--pc-accent);text-shadow:0 0 20px color-mix(in srgb,var(--pc-accent) 45%,transparent);
}
.skc-tier-name{margin:0 0 4px;font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-mid);text-align:center;}
.skc-hours{margin:0;font-family:var(--font-data);font-size:10px;color:var(--text-low);text-align:center;}
.skc-hobbies{margin-top:10px;padding-top:8px;border-top:1px dashed color-mix(in srgb,var(--pc-accent) 25%,transparent);}
.skc-hobbies-label{display:block;font-size:8px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-low);margin-bottom:4px;}
.skc-hobbies p{margin:0;font-size:10px;line-height:1.4;color:var(--text-mid);}
.skill-flip .skill-open-journey{width:100%;margin-top:10px;font-size:11px;}
.ol-term-line.ol-line-divider{opacity:0.35;margin:6px 0;}
.ol-term-line.ol-line-divider .ol-term-tag{color:var(--text-low);}
.ol-term-line.ol-line-problem p{color:var(--neon-pink);font-weight:600;}
.ol-term-line.ol-line-class p{color:var(--neon-cyan);font-family:var(--font-data);font-size:12px;}
.ol-term-line.ol-line-think p{color:var(--text-hi);}
.ol-term-line.ol-line-control p{color:#86efac;}
.ol-term-line.ol-line-worst p{color:#fca5a5;}
.ol-term-line.ol-line-likely p{color:#93c5fd;}
.ol-term-line.ol-line-action p,.ol-term-line.ol-line-redirect p{color:var(--neon-cyan);font-weight:600;}
.ol-term-line.ol-line-checkin p{color:var(--neon-pink);}
.ol-term-line.ol-line-summary p,.ol-term-line.ol-line-command p{color:var(--text-hi);font-weight:600;}
.ol-btn-finished.hidden{display:none!important;}
.mind-channel-header{
  display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;margin-bottom:18px;
  padding:16px 18px 16px;border-bottom:1px dashed color-mix(in srgb,var(--neon-pink) 40%,var(--border-glass));
}
.mind-exit-btn{border-color:var(--neon-pink)!important;color:var(--neon-pink)!important;font-family:var(--font-data);font-size:11px;letter-spacing:0.1em;}
.mind-channel-kicker{font-family:var(--font-data);font-size:10px;letter-spacing:0.16em;color:var(--neon-pink);display:block;margin-bottom:6px;}
.mind-glitch-title{
  color:var(--neon-pink)!important;
  text-shadow:2px 0 var(--neon-cyan),-1px 0 #ff0040;
  animation:oglGlitchText 4s steps(2) infinite;
}
.mind-channel-sub{margin:6px 0 0;font-size:13px;color:var(--text-mid);}
.mind-sys-bar{
  display:flex;flex-wrap:wrap;gap:10px 18px;margin-left:auto;font-size:9px;letter-spacing:0.12em;
  color:var(--text-low);font-family:var(--font-data);align-self:center;
}
.mind-sys-bar span{padding:4px 8px;border:1px dashed color-mix(in srgb,var(--neon-pink) 30%,transparent);}
.mind-channel-body{min-height:50vh;padding:4px 0;}
.mind-hub{display:grid;grid-template-columns:minmax(200px,260px) 1fr;gap:20px;}
.mind-protocol-card{
  padding:16px;margin-bottom:12px;
}
.mind-protocol-card h3{font-family:var(--font-data);font-size:11px;letter-spacing:0.14em;margin:0 0 8px;color:var(--neon-pink);}
.mind-protocol-card p{font-size:12px;line-height:1.5;color:var(--text-mid);margin:0 0 10px;}
.mind-protocol-steps{margin:0;padding-left:18px;font-size:11px;line-height:1.6;color:var(--text-low);}
.mind-stats-mini{display:flex;flex-direction:column;gap:4px;font-size:10px;color:var(--text-low);font-family:var(--font-data);}
.mind-hub-main{padding:18px;}
.mind-form-wrap{max-width:900px;padding:18px;}
.ol-kicker{color:var(--neon-pink)!important;}
.ol-title{color:var(--text-hi);}
.ol-card{border-style:dashed;}
.ol-card:hover{border-color:color-mix(in srgb,var(--neon-pink) 55%,var(--border-glass));box-shadow:0 0 18px rgba(244,63,142,0.12);}
.ol-command-wrap{border-color:var(--neon-pink)!important;}
.ol-prompt-char{color:var(--neon-pink)!important;}
.ol-command-wrap input{color:var(--neon-pink)!important;}

/* ===== Page crack entry ===== */
.page-crack-overlay{
  position:fixed;inset:0;z-index:450;pointer-events:none;
}
.page-crack-overlay.hidden{display:none!important;}
.crack-flash{
  position:absolute;inset:0;background:rgba(244,63,142,0.22);
  animation:crackFlash 1.5s ease forwards;
}
@keyframes crackFlash{0%{opacity:0;}12%{opacity:1;}30%{opacity:0.35;}100%{opacity:0;}}
.crack-svg{position:absolute;inset:0;width:100%;height:100%;}
.crack-path{
  fill:none;stroke:var(--neon-pink);stroke-width:3;opacity:0;
  filter:drop-shadow(0 0 8px rgba(244,63,142,0.8));
  animation:crackDraw 1.2s ease forwards;
}
.crack-a{animation-delay:0.05s;}
.crack-b{animation-delay:0.15s;stroke:var(--neon-cyan);}
.crack-c{animation-delay:0.25s;}
@keyframes crackDraw{0%{opacity:0;stroke-dashoffset:1200;}20%{opacity:1;}100%{opacity:0.85;stroke-dashoffset:0;}}
.crack-path{stroke-dasharray:1200;stroke-dashoffset:1200;}
.crack-label{
  position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);
  font-family:var(--font-data);font-size:12px;letter-spacing:0.28em;color:var(--neon-pink);
}
body.page-crack-active .main-col{
  animation:pageSplit 1.4s ease forwards;
}
@keyframes pageSplit{
  0%{transform:none;filter:none;}
  25%{transform:scale(1.01);filter:brightness(1.3) contrast(1.2);}
  45%{transform:perspective(900px) rotateY(-2deg) translateX(-6px);filter:hue-rotate(-15deg) saturate(1.4);}
  70%{transform:perspective(900px) rotateY(3deg) translateX(8px);clip-path:polygon(0 0,48% 0,52% 100%,0 100%);}
  100%{transform:none;filter:brightness(0.7);opacity:0.85;}
}
body.mind-repair-active #view-mind{
  animation:mindRepair 1.1s ease forwards;
}
@keyframes mindRepair{
  0%{filter:none;opacity:1;}
  40%{filter:brightness(1.5) hue-rotate(90deg);opacity:0.8;}
  100%{filter:none;opacity:0;transform:scale(0.98);}
}

/* ===== Glitch bars (intro + mind channel) ===== */
.ogl-glitch-bars,.mind-glitch-bars{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.ogl-glitch-bar,.mind-glitch-bar{
  position:absolute;left:0;height:2px;width:var(--ogl-w,var(--mgb-w,20%));
  top:var(--ogl-y,var(--mgb-y,50%));
  background:linear-gradient(90deg,transparent,var(--neon-pink),var(--neon-cyan),transparent);
  opacity:0;animation:glitchBar 2.4s linear infinite;
  animation-delay:var(--ogl-delay,var(--mgb-delay,0s));
}
@keyframes glitchBar{0%,100%{opacity:0;transform:translateX(-20%);}8%{opacity:0.7;}50%{opacity:0.35;transform:translateX(120%);}}
.mind-glitch-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;}
.mind-glitch-scan{
  position:absolute;inset:0;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(244,63,142,0.04) 2px,rgba(244,63,142,0.04) 4px);
  animation:oglScan 10s linear infinite;
}
.mind-view .mind-channel-header,.mind-view .mind-channel-body{position:relative;z-index:1;}

/* ===== System overload layout v2 ===== */
.mind-terminal-layout,.mind-session-layout,.mind-read-layout{display:grid;gap:20px;}
.mind-terminal-layout{grid-template-columns:minmax(220px,280px) 1fr;}
.mind-side-panel{display:flex;flex-direction:column;gap:14px;}
.mind-panel-head{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.mind-panel-id{font-family:var(--font-data);font-size:10px;color:var(--neon-pink);padding:3px 6px;border:1px solid color-mix(in srgb,var(--neon-pink) 40%,transparent);}
.mind-protocol-steps{list-style:none;padding:0;margin:0;}
.mind-protocol-steps li{display:flex;gap:10px;padding:8px 0;border-bottom:1px dashed color-mix(in srgb,var(--neon-pink) 20%,transparent);font-size:11px;}
.mind-protocol-steps li span{font-family:var(--font-data);color:var(--neon-pink);min-width:22px;}
.mind-archive-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.mind-archive-stats div{padding:10px;border:1px dashed color-mix(in srgb,var(--neon-pink) 25%,transparent);text-align:center;}
.mind-archive-stats strong{display:block;font-family:var(--font-display);font-size:22px;color:var(--neon-pink);}
.mind-archive-stats span{font-size:9px;color:var(--text-low);letter-spacing:0.08em;text-transform:uppercase;}
.mind-main-panel{padding:18px;}
.ol-archive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;}
.ol-archive-card{padding:14px;display:flex;flex-direction:column;gap:8px;min-height:180px;}
.ol-card-meta{display:flex;justify-content:space-between;font-size:10px;color:var(--text-low);font-family:var(--font-data);}
.ol-card-id{opacity:0.5;}
.ol-archive-card h4{margin:0;font-family:var(--font-voice);font-size:16px;}
.mind-session-progress{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.mind-session-progress span{
  font-size:9px;letter-spacing:0.12em;padding:5px 10px;border:1px solid var(--border-glass);
  color:var(--text-low);font-family:var(--font-data);
}
.mind-session-progress span.active{border-color:var(--neon-pink);color:var(--neon-pink);box-shadow:0 0 12px rgba(244,63,142,0.2);}
.mind-session-progress span.done{opacity:0.45;text-decoration:line-through;}
.ol-session-grid{display:grid;grid-template-columns:minmax(240px,320px) 1fr;gap:16px;align-items:start;}
.ol-panel{padding:16px;}
.ol-panel-head{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.ol-panel-head span{font-family:var(--font-data);font-size:10px;color:var(--neon-cyan);}
.ol-panel-head h4{margin:0;font-size:12px;letter-spacing:0.12em;}
.ol-emotion-matrix{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px;max-height:min(52vh,520px);overflow-y:auto;padding-right:4px;}
.ol-emotion-chip{
  display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 8px;cursor:pointer;
  border:1px solid color-mix(in srgb,var(--ole-neon) 28%,var(--border-glass));
  background:rgba(0,0,0,0.35);transition:border-color 0.15s,box-shadow 0.15s,transform 0.15s;
}
.ol-emotion-chip:has(input:checked){border-color:var(--ole-neon);box-shadow:0 0 16px color-mix(in srgb,var(--ole-neon) 35%,transparent);transform:translateY(-2px);}
.ol-emotion-chip input{position:absolute;opacity:0;pointer-events:none;}
.ol-emotion-glyph{
  font-family:var(--font-data);font-size:18px;width:34px;height:34px;display:flex;align-items:center;justify-content:center;
  border:1px solid color-mix(in srgb,var(--ole-neon) 50%,transparent);color:var(--ole-neon);
  box-shadow:inset 0 0 12px color-mix(in srgb,var(--ole-neon) 15%,transparent);
}
.ol-emotion-name{font-size:10px;text-align:center;line-height:1.2;color:var(--text-mid);}
.ol-rant-panel .ol-rant{min-height:min(48vh,520px);font-size:13px;line-height:1.65;}
.ol-meta-row{display:grid;grid-template-columns:1fr 1.4fr;gap:10px;margin-bottom:10px;}
.ol-rant-actions{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px;}
.ol-terminal{padding:0;overflow:hidden;}
.ol-terminal-head{display:flex;justify-content:space-between;padding:12px 16px;border-bottom:1px dashed color-mix(in srgb,var(--neon-pink) 35%,transparent);font-size:10px;letter-spacing:0.14em;font-family:var(--font-data);}
.ol-term-rant-echo{padding:12px 16px;border-bottom:1px solid var(--border-glass);max-height:140px;overflow:auto;}
.ol-term-rant-echo pre{margin:0;font-size:11px;line-height:1.5;color:var(--text-mid);white-space:pre-wrap;}
.ol-term-log{min-height:220px;max-height:min(42vh,420px);overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:10px;}
.ol-term-line{display:grid;grid-template-columns:42px 1fr;gap:10px;align-items:start;}
.ol-term-line p{margin:0;font-size:12px;line-height:1.55;}
.ol-term-line.system p{color:var(--neon-cyan);}
.ol-term-line.user p{color:var(--text-hi);}
.ol-term-tag{font-family:var(--font-data);font-size:9px;letter-spacing:0.1em;padding:3px 0;color:var(--neon-pink);}
.ol-term-input-row{display:grid;grid-template-columns:20px 1fr auto;gap:8px;padding:12px 16px 16px;border-top:1px dashed var(--border-glass);}
.ol-command-large{padding:14px 16px;}
.ol-tag-glyph{margin-right:4px;font-family:var(--font-data);}
.ol-tag-more{font-size:9px;color:var(--text-low);}

/* ===== Mood picker ===== */
.mood-picker{display:flex;flex-direction:column;gap:12px;}
.mood-picker-compact .mood-picker-grid{max-height:200px;overflow-y:auto;}
.mood-picker-group-label{font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-low);display:block;margin-bottom:6px;}
.mood-picker-grid{display:flex;flex-wrap:wrap;gap:6px;}
.mood-pick{
  display:inline-flex;align-items:center;gap:6px;padding:5px 9px;cursor:pointer;
  border:1px solid color-mix(in srgb,var(--mp-neon) 30%,var(--border-glass));background:rgba(0,0,0,0.25);
  font-size:10px;color:var(--text-mid);
}
.mood-pick.active,.mood-pick:has(input:checked){border-color:var(--mp-neon);color:var(--text-hi);box-shadow:0 0 10px color-mix(in srgb,var(--mp-neon) 30%,transparent);}
.mood-pick input{position:absolute;opacity:0;pointer-events:none;}
.mood-pick-icon{font-family:var(--font-data);color:var(--mp-neon);}
.mood-picker-admin{display:flex;gap:8px;flex-wrap:wrap;}
.profile-current-mood-wrap{margin:12px 0 8px;display:flex;flex-direction:column;gap:10px;}
.profile-current-mood{
  display:flex;align-items:center;gap:12px;padding:12px 14px;
  border:2px solid color-mix(in srgb,var(--pcm-neon) 45%,var(--border-glass));
  background:rgba(0,0,0,0.3);box-shadow:0 0 20px color-mix(in srgb,var(--pcm-neon) 20%,transparent);
}
.profile-current-mood-glyph{font-family:var(--font-data);font-size:28px;color:var(--pcm-neon);}
.profile-current-mood-label{display:block;font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-low);}
.profile-current-mood strong{font-family:var(--font-voice);font-size:18px;}
.steps-sync-row{display:flex;gap:8px;align-items:center;}
.steps-sync-row input{flex:1;}
.live-stat-sync{grid-column:1/-1;text-align:center;}
.live-stat-sync .btn{width:100%;}

@media(max-width:900px){
  .ol-session-grid,.mind-terminal-layout{grid-template-columns:1fr;}
  .ol-meta-row{grid-template-columns:1fr;}
  .live-broadcast{grid-template-columns:1fr;min-height:auto;}
  .live-rail-col{max-height:42vh;}
  .mind-hub{grid-template-columns:1fr;}
}
