/*  ONEIROVE 낮·밤 모드  (2026-09-23)
 *
 *  대표 지시 — 「어떤 사람은 어두운 모드를 좋아하니까 낮 모드하고 밤 모드를 조절할 수 있는 걸
 *              만들었으면 좋겠어. 선택할 수 있게.」
 *
 *  🔴 기본값은 「낮」이다. 이 파일은 밤일 때만 값을 갈아 끼운다.
 *     낮 모드에서는 여기서 아무것도 하지 않는다 — 지금 보던 화면 그대로다.
 *
 *  ── 화면에 걸리는 것 (theme.js 가 <head> 안에서 동기로 건다) ──
 *      html[data-ovth]    고른 것    day | night | auto
 *      html[data-ovmode]  보이는 것  day | night
 *  아래 긴 부분은 data-ovmode 하나만 본다.
 *  data-ovth 쪽 한 벌은 자바스크립트가 꺼져 있어도 색이 맞도록 남겨 둔 대비책이다.
 *
 *  ── 지키는 선 ──
 *  · 그림에는 filter 를 걸지 않는다. 꿈카드가 우리 상품이다.
 *  · 밤에는 그림자가 안 보이므로 경계는 --line 테두리로 낸다.
 *  · 배치·글자 크기는 건드리지 않는다. 색만.
 *  · world.html(밤의 나라)·codex.html(도록)은 이 파일을 싣지 않는다. 원래 밤이다.
 */

html[data-ovth="night"], html[data-ovmode="night"]{
  color-scheme:dark;

  /* ── 회원 화면 한 벌 (home · drawer · journal · store · studio · account · cast · make · report · login · welcome) */
  --bg:#0E1330; --bg2:#141A3C; --card:#171E45; --paper:#171E45;
  --line:rgba(169,188,245,.14); --line2:rgba(169,188,245,.22);
  --tx:#EDEFFA; --tx2:#B9C2E6; --tx3:#8E99C4;
  --pri:#8DA0F5; --pri-d:#A9BCF5; --pri-s:rgba(141,160,245,.16);
  --acc:#B79BF5; --acc-s:rgba(183,155,245,.18);
  --sky:#8FBEE4; --sky-s:rgba(143,190,228,.18);

  /* ── 읽는 화면 한 벌 (index · guide · definition · story · pricing · signup · sound · interview) */
  --night:#0B1029; --night-2:#141A3C; --panel:#171E45; --panel-2:#1C2350; --surface:#1C2350;
  --hair:rgba(169,188,245,.10);
  --gold:#A9BCF5; --gold-soft:#B79BF5; --gold-deep:#8DA0F5; --lilac:#B79BF5;
  --mist:#EDEFFA; --mist-2:#B9C2E6; --mist-3:#8E99C4;
  --ink:#8DA0F5; --violet:#B79BF5; --aqua:#8FBEE4; --white:#171E45;
  --gil:#5FD3A6; --hyung:#F08CAC;

  /* ── 색을 직접 박아 둔 자리 (theme.js 와 짝인 wrap 이름) ── */
  --ovon:#141033;          /* 보라로 칠한 단추 안의 글씨 — 밤엔 흰색 대신 짙은 남색 */
  --ovw:#171E45;            /* 흰 카드 */
  --ovw2:#1B2350;           /* 아주 옅은 판 */
  --ovw7:rgba(23,30,69,.66);
  --ovw92:rgba(20,26,60,.94);
  --ovbg:#0E1330;
  --ovbg2:#141A3C;
  --ovtint:#232059;         /* 보랏빛 판 */
  --ovwarm:#2B2440;
  --ovtint2:#2A2560;
  --ovwarm2:#332B42;         /* 따뜻한 판 */

  --ovc5B36D6:#C3B0FA; --ovc7D61E8:#C0ACF8; --ovc4B5BD4:#9FB0F8; --ovc3B49B4:#9FB0F8;
  --ovc5B45C8:#C3B0FA; --ovc3A2B7A:#C0ACF8;
  --ovc1B2450:#EDEFFA; --ovc151F4F:#EDEFFA;
  --ovc26305E:#C9D2EE; --ovc3A4478:#B9C2E6; --ovc4A5580:#B9C2E6; --ovc5C6489:#B9C2E6;
  --ovc5A628C:#A6AFD4; --ovc93A2BD:#A6AFD4; --ovc6B76A0:#8E99C4;
  --ovc7A6BA8:#ABA2D8; --ovc33294F:#DCD6F0; --ovc2C2247:#DCD6F0;
  --ovc4E3F86:#C2B6EC; --ovc453B7A:#C2B6EC; --ovc5D4A96:#C2B6EC; --ovc4B3C86:#C2B6EC;
  --ovc3D3072:#C6BAF0; --ovc3B2E6B:#C6BAF0; --ovcBFB6E6:rgba(169,188,245,.28);
  --ovcB3541E:#F0A971; --ovc9A3412:#F0A971; --ovc8A5A2B:#DFAE73; --ovcB4472E:#F0A184;
  --ovc7C5A3A:#DFAE73; --ovcB08B34:#E6CC80; --ovc6B5200:#E6CC80; --ovc8A6400:#E6CC80;
  --ovc4A3800:#F2E0A6;
  --ovcC0392B:#FF9A90; --ovcB33A3A:#FF9A90; --ovcE04B4B:#FF9A90;
  --ovc1E7A46:#5FD3A6; --ovc1F7A5C:#5FD3A6; --ovc2E8B6A:#5FD3A6; --ovcB04A6A:#F08CAC;
}

@media (prefers-color-scheme: dark){
  html[data-ovth="auto"]{
    color-scheme:dark;
  
    /* ── 회원 화면 한 벌 (home · drawer · journal · store · studio · account · cast · make · report · login · welcome) */
    --bg:#0E1330; --bg2:#141A3C; --card:#171E45; --paper:#171E45;
    --line:rgba(169,188,245,.14); --line2:rgba(169,188,245,.22);
    --tx:#EDEFFA; --tx2:#B9C2E6; --tx3:#8E99C4;
    --pri:#8DA0F5; --pri-d:#A9BCF5; --pri-s:rgba(141,160,245,.16);
    --acc:#B79BF5; --acc-s:rgba(183,155,245,.18);
    --sky:#8FBEE4; --sky-s:rgba(143,190,228,.18);
  
    /* ── 읽는 화면 한 벌 (index · guide · definition · story · pricing · signup · sound · interview) */
    --night:#0B1029; --night-2:#141A3C; --panel:#171E45; --panel-2:#1C2350; --surface:#1C2350;
    --hair:rgba(169,188,245,.10);
    --gold:#A9BCF5; --gold-soft:#B79BF5; --gold-deep:#8DA0F5; --lilac:#B79BF5;
    --mist:#EDEFFA; --mist-2:#B9C2E6; --mist-3:#8E99C4;
    --ink:#8DA0F5; --violet:#B79BF5; --aqua:#8FBEE4; --white:#171E45;
    --gil:#5FD3A6; --hyung:#F08CAC;
  
    /* ── 색을 직접 박아 둔 자리 (theme.js 와 짝인 wrap 이름) ── */
    --ovon:#141033;          /* 보라로 칠한 단추 안의 글씨 — 밤엔 흰색 대신 짙은 남색 */
  --ovw:#171E45;            /* 흰 카드 */
    --ovw2:#1B2350;           /* 아주 옅은 판 */
    --ovw7:rgba(23,30,69,.66);
    --ovw92:rgba(20,26,60,.94);
    --ovbg:#0E1330;
    --ovbg2:#141A3C;
    --ovtint:#232059;         /* 보랏빛 판 */
    --ovwarm:#2B2440;
  --ovtint2:#2A2560;
  --ovwarm2:#332B42;         /* 따뜻한 판 */
  
    --ovc5B36D6:#C3B0FA; --ovc7D61E8:#C0ACF8; --ovc4B5BD4:#9FB0F8; --ovc3B49B4:#9FB0F8;
    --ovc5B45C8:#C3B0FA; --ovc3A2B7A:#C0ACF8;
    --ovc1B2450:#EDEFFA; --ovc151F4F:#EDEFFA;
    --ovc26305E:#C9D2EE; --ovc3A4478:#B9C2E6; --ovc4A5580:#B9C2E6; --ovc5C6489:#B9C2E6;
    --ovc5A628C:#A6AFD4; --ovc93A2BD:#A6AFD4; --ovc6B76A0:#8E99C4;
    --ovc7A6BA8:#ABA2D8; --ovc33294F:#DCD6F0; --ovc2C2247:#DCD6F0;
    --ovc4E3F86:#C2B6EC; --ovc453B7A:#C2B6EC; --ovc5D4A96:#C2B6EC; --ovc4B3C86:#C2B6EC;
    --ovc3D3072:#C6BAF0; --ovc3B2E6B:#C6BAF0; --ovcBFB6E6:rgba(169,188,245,.28);
    --ovcB3541E:#F0A971; --ovc9A3412:#F0A971; --ovc8A5A2B:#DFAE73; --ovcB4472E:#F0A184;
    --ovc7C5A3A:#DFAE73; --ovcB08B34:#E6CC80; --ovc6B5200:#E6CC80; --ovc8A6400:#E6CC80;
    --ovc4A3800:#F2E0A6;
    --ovcC0392B:#FF9A90; --ovcB33A3A:#FF9A90; --ovcE04B4B:#FF9A90;
    --ovc1E7A46:#5FD3A6; --ovc1F7A5C:#5FD3A6; --ovc2E8B6A:#5FD3A6; --ovcB04A6A:#F08CAC;
  }
}

/* ══════════════════════════════════════════════════════════
   여기부터는 「지금 밤으로 보이는 화면」에만 걸린다.
   ══════════════════════════════════════════════════════════ */

html[data-ovmode="night"]{ background:#0B1029 }

/*  회원 화면 위쪽의 하늘빛 띠 — 밤에는 옅은 남색으로 낮춘다.
    (대문·꿈터뷰·드림 사운드는 같은 자리에 몽환 레이어가 있어 따로 다룬다.)  */
html[data-ovmode="night"]:not([data-ovpage="index"]):not([data-ovpage="interview"]):not([data-ovpage="sound"]) body::before{
  background:linear-gradient(180deg,
    rgba(72,104,172,.30) 0%,
    rgba(58,74,140,.12) 55%,
    rgba(11,16,41,0) 100%);
}

/*  대문 — 몽환 레이어를 깊은 남색·보라로. 구조(자리·크기·움직임)는 그대로다.  */
html[data-ovmode="night"][data-ovpage="index"] body::before,
html[data-ovmode="night"][data-ovpage="sound"] body::before{
  background:
    radial-gradient(26vmax 22vmax at 12% 16%, rgba(38,74,136,1), transparent 56%),
    radial-gradient(25vmax 22vmax at 86% 10%, rgba(66,42,132,1), transparent 56%),
    radial-gradient(30vmax 25vmax at 74% 84%, rgba(40,56,124,1), transparent 56%),
    radial-gradient(24vmax 21vmax at 6% 88%, rgba(74,46,130,.96), transparent 58%),
    radial-gradient(20vmax 18vmax at 44% 50%, rgba(80,58,140,.86), transparent 60%),
    radial-gradient(16vmax 14vmax at 62% 30%, rgba(46,86,128,.70), transparent 62%);
  opacity:.80;
}
html[data-ovmode="night"][data-ovpage="index"] body::after{
  background:radial-gradient(90vmax 60vmax at 50% 6%, rgba(40,54,126,.52), transparent 62%);
}

/*  드림 사운드 — 바탕은 position:fixed 한 장이라 통째로 갈아 끼운다.  */
html[data-ovmode="night"][data-ovpage="sound"] body::before{
  inset:0; filter:none; animation:none; opacity:1;
  background:
    radial-gradient(60% 46% at 76% 4%, rgba(90,74,150,.30), transparent 60%),
    radial-gradient(60% 50% at 14% 100%, rgba(58,80,140,.30), transparent 62%),
    linear-gradient(180deg,#0B1029,#141A3C 60%,#0B1029);
}

/*  꿈터뷰 — 하늘+핑크가 이 화면의 얼굴이다.
    밤에는 그 결을 그대로 두고 어두운 남색·자주 쪽으로 낮춘다.  */
html[data-ovmode="night"][data-ovpage="interview"]{
  background:linear-gradient(180deg,
    #14224A 0%, #172449 14%, #1B2449 26%, #21244A 36%,
    #29234A 46%, #331F45 55%, #391E42 63%, #3C2244 71%,
    #3A2544 80%, #332446 88%, #26203E 95%, #0F1430 100%) fixed;
}
html[data-ovmode="night"][data-ovpage="interview"] body::before{
  background:
    radial-gradient(26vmax 22vmax at 12% 16%, rgba(40,84,146,1), transparent 56%),
    radial-gradient(25vmax 22vmax at 86% 10%, rgba(48,92,152,1), transparent 56%),
    radial-gradient(30vmax 25vmax at 74% 84%, rgba(126,44,92,.95), transparent 56%),
    radial-gradient(24vmax 21vmax at 6% 88%, rgba(122,54,96,.92), transparent 58%),
    radial-gradient(20vmax 18vmax at 44% 50%, rgba(110,48,104,.8), transparent 60%);
  opacity:.72;
}
html[data-ovmode="night"][data-ovpage="interview"] body::after{
  background:radial-gradient(90vmax 60vmax at 50% 6%, rgba(36,72,132,.40), transparent 62%);
}

/*  가입 화면은 body 에 바탕을 직접 그린다.  */
html[data-ovmode="night"][data-ovpage="signup"] body{
  background:
    radial-gradient(60% 40% at 80% 0%, rgba(169,188,245,.08), transparent 60%),
    linear-gradient(180deg,#0B1029,#141A3C 60%,#0B1029);
}

/*  밤에는 흰 판이 없어 그림자가 안 보인다 — 경계는 테두리로 낸다.  */
html[data-ovmode="night"] .card,
html[data-ovmode="night"] .paper,
html[data-ovmode="night"] .panel,
html[data-ovmode="night"] .pk,
html[data-ovmode="night"] .local,
html[data-ovmode="night"] .gatecard{
  border:1px solid var(--line);
}

/*  꿈카드·꿈영상 그림에는 어떤 덮개도 걸지 않는다 (우리 상품이다).  */
html[data-ovmode="night"] img,
html[data-ovmode="night"] video,
html[data-ovmode="night"] canvas{ filter:none }

/*  칠해 둔 판이 한 장씩 남아 있다 — 토큰을 안 쓰고 색을 직접 섞어 둔 자리다.  */
html[data-ovmode="night"] .research-call{
  background:linear-gradient(135deg,#171E45,#221C4E);
  border-color:var(--line);
  box-shadow:none;
}
html[data-ovmode="night"] .door.jr{
  background:linear-gradient(160deg,#39408F 0%,#4B3C93 55%,#66499C 100%);
}

/*  동그란 사진 테두리 — 낮에는 흰 링이 판과 이어지지만 밤에는 흰 고리만 남는다.  */
html[data-ovmode="night"] .pfav .in,
html[data-ovmode="night"] .pfav .bd,
html[data-ovmode="night"] .pfprev .big img,
html[data-ovmode="night"] .castrow .chi{ border-color:#1B2350 }
html[data-ovmode="night"] .pfav .in{ background:linear-gradient(135deg,#1E2550,#241F52) }
