/* =====================================================================
   NEEDY GIRL OVERDOSE — デスクトップ復刻 stylesheet
   ---------------------------------------------------------------------
   すべての座標・サイズはゲーム本体の RectTransform / Sprite.m_Border から
   そのまま転写している (ngo-code/ui_layout.txt, ngo-code/sprite_borders.txt)。
   RectTransform -> CSS 変換規則:
     anchor 基準点 = lerp(anchorMin, anchorMax, pivot)
     stretch 時    width  = parentW + sizeDelta.x
                   height = parentH + sizeDelta.y
   ===================================================================== */

*{margin:0;padding:0;box-sizing:border-box}

:root{
  --purple:#4d23cf;    /* windowbase 外枠 */
  --purple2:#815cdd;   /* ボタン影 */
  --face:#f7e1fb;      /* ボタン / タスクバー地色 */
  --face-hi:#fdf2fe;
  --header:#f0d1f1;    /* アクティブウィンドウのヘッダ */
  --grey:#e3e3e3;      /* 非アクティブ */
  --mint:#90f4e4;
  --body:#fff8ff;      /* ウィンドウ本体 */
  --desktop-height:1080px;
  --scaled-height:1080px;
}

/* v1.3.1 : 页面底色改纯黑 — 舞台(16:9)以外的区域不渲染任何内容,
   移动端竖屏时由浏览器自然露黑(信箱式留黑), 不再用粉色铺满 */
html,body{width:100%;height:100%;overflow:hidden;background:#000}
body{
  display:flex;flex-direction:column;justify-content:center;
  font-family:"DotGothic16","MS PGothic","Hiragino Kaku Gothic ProN",
              "Microsoft YaHei",sans-serif;
  color:#241046;cursor:default;
  -webkit-user-select:none;user-select:none;
}
img{display:block;image-rendering:pixelated}

/* 固定 1920x1080 单屏桌面 : 等比缩放适配视口，无纵向滚动 */
#screen-wrap{
  position:relative;width:100%;height:var(--scaled-height);
  overflow:visible;
}
#screen{
  position:absolute;left:50%;top:0;
  width:1920px;height:var(--screen-logical-height,1080px);
  transform:translateX(-50%) scale(var(--scale,1));
  transform-origin:50% 0;
  overflow:visible;
  z-index:6;   /* v1.2.2 : 窗口/图标层永远在景条(z:5)与壁纸之上 */
  /* v1.1.0 : 背景レイヤーを透過させるためキャンバス自体はクリック透過。
     pointer-events は継承されるので、交互コンテナは下で明示し auto へ戻す。 */
  pointer-events:none;
}
#shortcut-parent,#taskbar,#startmenu-parent{pointer-events:auto}
/* v1.1.0 : 壁紙と両側サイドバーは 1920 キャンバスの外へ出し screen-wrap 全域に
   敷く。ビューポート最左 / 最右に固定されるので 16:9 以外でも隙間が出ない。
   テクスチャ寸法も --scale 連動で等倍に拡縮し、見た目の比率を保つ。
   壁紙は wiki テンプレート (noon テーマ) : #f9e3ff 底 + 72px タイル平铺、
   景条は 121x540 素材を 242x1080 (2x) で敷き、JS の時刻帯で差し替え。 */
#wallpaper{
  position:absolute;inset:0;width:100%;height:100%;
  background-color:#f9e3ff;
  background-image:url('ngo-extracted/sprites/template-site-tile.webp');
  background-position:0 0;
  background-size:calc(72px * var(--scale,1));
  background-repeat:repeat;
  pointer-events:auto;
}
.sidebar{
  position:absolute;top:0;width:calc(242px * var(--scale,1));height:100%;padding:0;border:0;
  background-color:#f9e3ff;background-image:var(--sidebar-image);
  background-position:center top;
  background-size:calc(242px * var(--scale,1)) calc(1080px * var(--scale,1));
  background-repeat:repeat-y;
  cursor:pointer;z-index:5;
}
.sidebar:hover{filter:brightness(1.04)}
.sidebar:active{filter:brightness(.97)}
/* v1.2.4 : 景条铺满舞台 — 外缘=舞台边, 内缘=工作区边
   (宽 50vw-718s : 舞台边到工作区边; v1.3.1 高度=舞台高 var(--scaled-height),
    不再 100vh — 移动端竖屏时舞台外保持黑底不渲染) */
#sidebar-left{left:0;width:calc(50% - 718px * var(--scale,1));height:var(--scaled-height);
  background-size:cover;background-position:right center}
/* v1.2.6 : 右景条 = 左景条的镜像 (原作 obiRight 对 obileft 镜像) —
   scaleX(-1) 翻转整块, 配 right center 锚点使翻转后画面仍以内缘对齐 */
#sidebar-right{right:0;width:calc(50% - 718px * var(--scale,1));height:var(--scaled-height);
  background-size:cover;background-position:right center;transform:scaleX(-1)}

.hidden{display:none!important}

/* ---------------------------------------------------------------------
   作業領域 : ShortCutParent / WindowParent  size(1436,1080) @ x=242
   --------------------------------------------------------------------- */
#shortcut-parent,#window-parent{
  position:absolute;left:242px;top:0;width:1436px;height:100%;
}
#window-parent{pointer-events:none}

/* Shortcut セル : size(200,100) piv(0.5,0.5) */
.shortcut{
  position:absolute;width:200px;height:100px;
  cursor:pointer;
}
.shortcut.is-static{cursor:default}
.shortcut:hover{filter:brightness(1.08) drop-shadow(0 0 3px #fff)}
.shortcut:active{transform:translateY(1px)}
.shortcut.is-static:active{transform:none}
/* Image : aMin(0.5,1) aMax(0.5,1) pos(0,0) size(64,64) piv(0.5,1) */
.shortcut-icon{
  position:absolute;left:50%;top:0;width:64px;height:64px;
  margin-left:-32px;object-fit:contain;
  filter:drop-shadow(1px 1px 0 rgba(77,35,207,.35));
}
/* Text (TMP) : aMin(0.5,0) aMax(0.5,0) pos(0,0) size(200,27) piv(0.5,0) */
.shortcut-label{
  position:absolute;left:0;bottom:0;width:200px;height:27px;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;line-height:1;color:#3b1670;
  text-shadow:0 0 3px #fff,0 0 3px #fff,1px 1px 0 #fff;
  white-space:nowrap;
}
/* Badge : v1.2.3 桌面快捷方式标记(原版) aMin(0,1) pos(8,-8) size(27,27) piv(0.5,0.5)
   -> 中心在单元格左上角 (8,-8) : left 8-13.5=-5.5, top -8-13.5=-21.5 */
.shortcut-badge{
  /* v1.2.4 : 锚定图标左上角 — 图标 64x64 顶部居中(x 68..132), 中心=(76,-8) */
  position:absolute;left:62.5px;top:-21.5px;width:27px;height:27px;
  animation:badge-bob .9s ease-in-out infinite alternate;
}
@keyframes badge-bob{from{transform:translateY(0)}to{transform:translateY(-3px)}}

/* ---------------------------------------------------------------------
   Window  (prefab WindowBase 596x394 piv(0,1))
     Contents > Nakami pos(-2,-10) size(-20,-64)  -> inset L8 T42 R12 B22
     Contents > Header aMin(0,1) aMax(1,1) pos(8,-8) size(-20,26) piv(0,1)
   枠は windowbase_active.png / windowbase_inactive.png の 9-slice。
   border-width を .window 自体に付けるとパディングボックスがずれて
   絶対配置の子が全部動くので、枠は inset:0 の専用レイヤーに分離する。
   --------------------------------------------------------------------- */
.window{position:absolute;pointer-events:auto}
.window-frame{
  position:absolute;left:0;top:0;right:0;bottom:0;
  border-style:solid;border-width:42px 12px 22px 69px;
  border-image:url(ngo-extracted/sprites/windowbase_active.png) 42 12 22 69 fill stretch;
  pointer-events:none;
}
.window.inactive .window-frame{
  border-width:42px 14px 22px 70px;
  border-image:url(ngo-extracted/sprites/windowbase_inactive.png) 42 14 22 70 fill stretch;
}
.window-header{
  position:absolute;left:8px;top:8px;right:12px;height:26px;
  cursor:move;
}
.window.inactive .window-header{cursor:default}
/* Icon : aMin(0,0.5) pos(4,0) size(18,18) piv(0,0.5) */
.window-icon{
  position:absolute;left:4px;top:50%;margin-top:-9px;
  width:18px;height:18px;object-fit:contain;
}
/* Title : aMin(0,0) aMax(1,1) pos(28,0) size(-102,0) piv(0,1) */
.window-title{
  position:absolute;left:28px;right:74px;top:0;bottom:0;
  display:flex;align-items:center;
  font-size:16px;line-height:1;color:#3b1670;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.window.inactive .window-title{color:#6d6d6d}
/* Button_Close right 6 / Button_Maximize right 30.7 / Button_Minimize right 54 */
.window-btn{
  position:absolute;top:50%;margin-top:-10px;width:20px;height:20px;
  cursor:pointer;object-fit:contain;
}
.window-btn:hover{filter:brightness(1.15)}
.window-btn:active{transform:translateY(1px)}
.btn-close{right:6px}
.btn-max{right:30.7px}
.btn-min{right:54px}

/* Nakami : ウィンドウ本体 (中身アプリの描画領域) */
.window-nakami{
  position:absolute;left:8px;top:42px;right:12px;bottom:22px;
  overflow:hidden;
}
.window-nakami img.app-image{width:100%;height:100%;object-fit:contain}
.app-stub{
  width:100%;height:100%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:10px;
  font-size:15px;color:#7a5fb0;text-align:center;line-height:1.7;
}
.app-stub .app-stub-name{font-size:24px;color:#4d23cf}
.app-stub .app-stub-size{font-size:12px;color:#a58fd0}

/* ---------------------------------------------------------------------
   App_Webcam: the viewport fills WindowBase while its paired background and
   actor frames share one centered cover transform. This keeps every resize
   edge-to-edge, crops equally from both layers, and keeps Ame undistorted at
   the center instead of independently stretching her to the window height.
   --------------------------------------------------------------------- */
.webcam-app{
  position:relative;width:100%;height:100%;overflow:hidden;background:#fff8ff;
  image-rendering:pixelated;
}
.webcam-viewport{
  position:absolute;inset:0;width:100%;height:100%;
  transform:none;overflow:hidden;background:#fff8ff;
}
.webcam-bg,.webcam-actor{
  position:absolute;left:0;top:0;width:100%;height:100%;
  object-fit:cover;object-position:center;pointer-events:none;
}
.webcam-actor{z-index:2}
.webcam-head-hit{
  /* App_Webcam/head: top anchor, posY=-78.38, size 160x101.23. */
  position:absolute;left:27.0115%;top:12.3348%;width:45.977%;height:44.59%;z-index:4;
  padding:0;border:0;background:transparent;cursor:pointer;
}
.webcam-head-hit:focus-visible{outline:2px solid #8c65d5;outline-offset:2px}
@keyframes webcam-nade{
  0%,100%{transform:none}
  30%{transform:translateX(-3px)}
  65%{transform:translateX(3px)}
}
.webcam-viewport.webcam-nade{animation:webcam-nade .24s steps(2,end)}
@keyframes webcam-yusayusa{
  0%,12.5%,25%,37.5%,50%,62.5%,75%,87.5%,100%{transform:none}
  6.25%,18.75%,31.25%,43.75%,56.25%,68.75%,81.25%,93.75%{transform:translateY(-10px)}
}
.webcam-viewport.webcam-yusayusa{animation:webcam-yusayusa 3.2s steps(1,end)}
.webcam-dock{
  position:absolute;left:calc(100% + 10px);top:54px;width:196px;min-height:120px;
  padding:8px;border:1px solid #d4b9e2;background:rgba(255,248,255,.97);
  color:#6f4a86;z-index:20;box-shadow:2px 2px 0 rgba(77,35,207,.18);
  font-family:"MS Gothic","Microsoft YaHei",sans-serif;pointer-events:auto;
}
.webcam-dock-head{display:flex;align-items:center;justify-content:space-between;
  height:19px;border-bottom:1px solid #eadcf0;font-size:12px}
.webcam-dock-title{color:#4d23cf;font-weight:700}
.webcam-branch-name{max-width:122px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8a5ca0;font-size:10px}
.webcam-yami-row{display:flex;align-items:center;justify-content:space-between;
  margin-top:7px;font-size:11px;color:#6e4b85}
.webcam-yami-label{white-space:nowrap}
.webcam-yami-value{min-width:28px;text-align:right;color:#4d23cf;font-variant-numeric:tabular-nums}
.webcam-yami{display:block;width:100%;height:18px;margin:2px 0 5px;accent-color:#6d3fc4;cursor:pointer}
.webcam-status-meta{display:flex;flex-direction:column;gap:2px;min-height:29px;padding:4px 0;
  border-top:1px solid #f0e2f3;border-bottom:1px solid #f0e2f3}
.webcam-state-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:#6c438b}
.webcam-clip-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:9px/1.1 Consolas,"MS Gothic",monospace;color:#a186b1}
.webcam-dock-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin-top:6px}
.webcam-actions-toggle,.webcam-hide-toggle,.webcam-auto{
  height:21px;min-width:0;padding:0 3px;border:1px solid #d2b7e1;
  background:#fff2fb;color:#75458f;font:10px/1 "MS Gothic","Microsoft YaHei",sans-serif;cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.webcam-actions-toggle:hover,.webcam-hide-toggle:hover,.webcam-auto:hover{background:#f5e0f6;color:#5e3478}
.webcam-auto{background:#f5e7fa}
.webcam-auto.is-manual{background:#e6daf9;color:#59418d}
/* The shipped surface exposes only Stress and Yami controls.  Action, hide,
   and auto buttons remain wired for internal compatibility but stay hidden. */
.webcam-dock-buttons,.webcam-state-panel{display:none!important}
.webcam-state-panel{
  width:100%;max-height:350px;overflow:auto;margin-top:7px;padding:5px;
  border:1px solid #e0cbe9;background:rgba(255,248,255,.98);color:#6f4a86;z-index:6;
}
.webcam-state-head{height:20px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid #eadcf0;font:11px/1 "MS Gothic","Microsoft YaHei",sans-serif}
.webcam-state-hint{color:#805790}
.webcam-state-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin-top:5px}
.webcam-state-button{
  min-width:0;height:23px;padding:0 2px;border:1px solid #e2cce9;background:#fffaff;
  color:#805790;font:10px/1 "MS Gothic","Microsoft YaHei",sans-serif;cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.webcam-state-button:hover{background:#f5e0f6;color:#5e3478}
.webcam-state-button.is-selected{border-color:#8c69c6;background:#eadff8;color:#50377e;
  box-shadow:inset 0 -2px 0 #8c69c6}

/* ---------------------------------------------------------------------
   App_Live_gen / LiveScenario
   ha isin.png is the extracted 1382x890 chrome. The overlay percentages
   keep the eizo and comment column aligned when the window is resized.
   --------------------------------------------------------------------- */
.live-app{
  position:relative;width:100%;height:100%;overflow:hidden;
  background:#fff8ff;color:#5b356e;font-family:"DotGothic16","MS PGothic",sans-serif;
  image-rendering:pixelated;
}
.live-base{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}
.live-title,.live-detail,.live-stage,.live-subtitle,.live-comment-list,
.live-stats,.live-controls,.live-progress{position:absolute;z-index:3}
.live-title{
  left:14%;top:1.2%;width:67%;height:4.6%;display:flex;align-items:center;
  padding-left:1.1%;font-size:17px;color:#e74c64;white-space:nowrap;overflow:hidden;
}
.live-detail{
  left:14.2%;top:6.3%;font-size:12px;color:#b16cae;letter-spacing:.04em;
}
.live-stage{
  left:56.3%;top:10.7%;width:29.2%;height:54.8%;overflow:hidden;
  border:1px solid rgba(202,120,209,.55);background:#f2d8f3;
}
.live-stage-bg{position:absolute;inset:0;background:url('ngo-extracted/textures/bg_stream.png') center/cover no-repeat}
.live-actor{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;
  image-rendering:pixelated;mix-blend-mode:normal;
}
.live-paused .live-actor{filter:saturate(.72) brightness(.94)}
.live-subtitle{
  left:4.2%;top:79.3%;width:49.5%;min-height:8.2%;padding:5px 10px;
  border-top:2px solid #9a86cc;background:rgba(255,248,255,.86);
  font-size:16px;line-height:1.45;color:#56326d;white-space:pre-line;
}
.live-comment-list{
  left:4.2%;top:65.5%;width:49.5%;height:13.2%;overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end;gap:3px;
  padding:4px 8px;background:rgba(255,248,255,.62);
}
.live-comment{display:flex;align-items:center;gap:5px;min-height:17px;font-size:12px;line-height:1.15;color:#88709b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-comment.is-current{color:#553070;font-weight:700}
.live-comment-icon{width:13px;height:13px;flex:0 0 13px;object-fit:contain}
.live-stats{
  left:4.2%;top:91.5%;font-size:11px;color:#a06ca5;letter-spacing:.04em;
}
.live-controls{
  left:40.2%;top:91.0%;display:flex;gap:5px;align-items:center;
}
.live-control{
  width:27px;height:24px;padding:0;border:1px solid #e4c4e8;border-radius:2px;
  background:#fbebfb;color:#7a4c95;font:13px/1 "MS Gothic",sans-serif;cursor:pointer;
}
.live-control:hover{background:#f4d6f2;color:#4d2871}
.live-control:active{transform:translateY(1px)}
.live-lang{width:31px;font-size:10px}
.live-progress{left:4.2%;right:4.2%;bottom:1.1%;height:3px;background:#eedaf0}
.live-progress-fill{height:100%;width:5%;background:#8f6ed0;transition:width .18s ease-out}

/* Candy/KAngel state strip. This occupies the original editor's left-side
   animation controls while preserving the game's 696x454 stage on the right. */
.live-state-panel{
  position:absolute;left:4.2%;top:10.7%;width:49.5%;height:52.8%;
  padding:10px 12px;border:1px solid #eed4ef;background:rgba(255,248,255,.76);
  z-index:4;box-shadow:inset 0 0 0 1px rgba(255,255,255,.8);
}
.live-state-header{height:24px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid #d5c1e6;color:#6c438b;font-size:13px}
.live-state-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-state-follow{height:19px;min-width:39px;padding:0 7px;border:1px solid #d7bce4;
  background:#f8e7fa;color:#82519c;font:11px/1 "MS Gothic",sans-serif;cursor:pointer}
.live-state-follow:hover{background:#efd4f1}.live-state-follow.is-manual{background:#e2d4fa;color:#5c4392}
.live-state-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;
  margin-top:10px}
.live-state-button{height:27px;padding:0 4px;border:1px solid #dfc7e9;background:#fff9ff;
  color:#79518b;font:12px/1 "MS Gothic",sans-serif;cursor:pointer;white-space:nowrap}
.live-state-button:hover{background:#f3def5;color:#5a2d72}
.live-state-button.is-selected{border-color:#8e6dc8;background:#e9def8;color:#4f347e;
  box-shadow:inset 0 -2px 0 #8e6dc8}

/* MoveAndScalableObject : Edges size(-16,8)/(8,-16) + 20x20 corner points */
.window-edge,.window-corner{position:absolute;z-index:2}
.edge-t{left:8px;right:8px;top:0;height:8px;cursor:ns-resize}
.edge-b{left:8px;right:8px;bottom:0;height:8px;cursor:ns-resize}
.edge-l{top:8px;bottom:8px;left:0;width:8px;cursor:ew-resize}
.edge-r{top:8px;bottom:8px;right:0;width:8px;cursor:ew-resize}
.window-corner{width:20px;height:20px}
.corner-tl{left:0;top:0;cursor:nwse-resize}
.corner-tr{right:0;top:0;cursor:nesw-resize}
.corner-bl{left:0;bottom:0;cursor:nesw-resize}
.corner-br{right:0;bottom:0;cursor:nwse-resize}
.window.fixed-size .window-edge,
.window.fixed-size .window-corner{display:none}

/* WindowTweens : born / pop / minimize / maximize */
@keyframes win-born{
  from{transform:scale(.88);opacity:0}
  to  {transform:scale(1);opacity:1}
}
@keyframes win-pop{
  from{transform:scale(.7) translateY(60px);opacity:0}
  to  {transform:scale(1) translateY(0);opacity:1}
}
.window.tw-born{animation:win-born .16s cubic-bezier(.2,1.4,.5,1)}
.window.tw-pop{animation:win-pop .16s cubic-bezier(.2,1.4,.5,1)}
.window.tw-minimize{
  transform:scale(.6) translateY(120px);opacity:0;
  transition:transform .14s ease-in,opacity .14s ease-in;
}
.window.tw-resize{transition:left .16s ease-out,top .16s ease-out,
                             width .16s ease-out,height .16s ease-out}

/* ---------------------------------------------------------------------
   Taskbar : aMin(0,0) aMax(1,0) pos(0,23.417) size(-484,48) piv(0.5,0.5)
             -> 1436x48, left 242, bottom -0.583
   地色はスプライトのパレットからの推定 (専用の背景スプライトは存在しない)
   --------------------------------------------------------------------- */
#taskbar{
  position:absolute;left:242px;bottom:-0.583px;width:1436px;height:48px;
  background:var(--face);
  border-top:2px solid var(--purple);
  box-shadow:inset 0 3px 0 var(--face-hi);
}
/* StartButton : pos(77,22.32) size(138,32) piv(0.5,0.5) -> left 8 bottom 6.32
   sprite 136x32 に対して実寸 138x32 = 差 2px なので 9-slice ではなく
   等倍近似ストレッチで貼る (ロゴのピクセルが崩れない) */
#start-button{
  position:absolute;left:8px;bottom:6.32px;width:138px;height:32px;
  background:url(ngo-extracted/sprites/button_start.png) no-repeat center/100% 100%;
  cursor:pointer;
}
#start-button:active{filter:brightness(.92)}
#start-button.bounce{animation:start-bounce .22s ease-out}
@keyframes start-bounce{35%{transform:translateY(2px) scale(.97)}100%{transform:none}}
/* Text (TMP) pos(20.135,0) size(-40.27,0) -> 左 39px はピクセルロゴ */
#start-button span{
  position:absolute;left:40.27px;top:0;right:0;bottom:0;
  display:flex;align-items:center;
  font-size:15px;color:#3b1670;
}
/* DayButton : aMin(1,0) pos(-6,6.32) size(138,32) piv(1,0) */
#day-button{
  position:absolute;right:6px;bottom:6.32px;width:138px;height:32px;
  background:url(ngo-extracted/sprites/button_day.png) no-repeat center/100% 100%;
  cursor:pointer;
}
#day-button:active{filter:brightness(.94)}
/* DayIcon : aMin(1,0.5) pos(-125.54,0) size(24,24) piv(0,0.5) -> left 12.46 */
#day-button .day-icon{
  position:absolute;left:12.46px;top:50%;margin-top:-12px;
  width:24px;height:24px;object-fit:contain;
}
#day-button span{
  position:absolute;left:40.27px;top:0;right:4px;bottom:0;
  display:flex;align-items:center;font-size:15px;color:#3b1670;
}

/* Poketter/Jine/TaskManager ショートカット : size(24,24) 縦中央
   pos(175.8 / 209.5 / 242.9, 0) piv(0.5,0.5) -> left 163.8 / 197.5 / 230.9 */
.taskbar-shortcut{
  position:absolute;top:50%;margin-top:-12px;width:24px;height:24px;
  cursor:pointer;object-fit:contain;
}
.taskbar-shortcut:hover{filter:brightness(1.2) drop-shadow(0 0 2px #fff)}
.taskbar-shortcut:active{transform:translateY(1px)}

/* TaskBarParent : v1.2.3 紧贴开始按钮 (原版 275.24 与开始按钮间还有快捷图标, 本版无) */
#taskbar-parent{
  position:absolute;left:152px;bottom:0.588px;
  width:1009.92px;height:46.83px;
  display:flex;align-items:center;gap:4px;
  overflow:hidden;
}
/* TaskBarButton prefab : size(160,30)
     Text  aMin(0,0) aMax(1,1) pos(17,0) size(-34,0) -> x 34..160
     Image aMin(0,0.5) pos(20,0) size(16,16)         -> left 12 */
.task-button{
  position:relative;flex:0 1 160px;min-width:44px;height:30px;
  border-style:solid;border-width:0 2px 2px 0;
  border-image:url(ngo-extracted/sprites/BaseButton.png) 0 2 2 0 fill stretch;
  cursor:pointer;
}
.task-button.active{
  border-width:5px 5px 5px 4px;
  border-image:url(ngo-extracted/sprites/BaseButtonPressed.png) 5 5 5 4 fill stretch;
}
.task-button:hover{filter:brightness(1.05)}
.task-button img{
  position:absolute;left:12px;top:50%;margin-top:-8px;
  width:16px;height:16px;object-fit:contain;
}
.task-button span{
  position:absolute;left:34px;right:2px;top:0;bottom:0;
  display:flex;align-items:center;
  font-size:13px;line-height:1;color:#3b1670;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.task-button.active img{margin-left:-4px}
.task-button.active span{margin-left:-4px}

/* ---------------------------------------------------------------------
   StartMenuParent : pos(-718,-23.4169) size(1436,1080) piv(0,0)
     -> 作業領域左端から 1436x1080、下端は画面下端
   StartMenu : aMin(0,1) aMax(0,1) pos(0,-1080) size(212,0) piv(0,1)
     -> 幅 212、高さ 0 (収納状態) を StartMenuView がタイムラインで開く
   --------------------------------------------------------------------- */
#startmenu-parent{
  position:absolute;left:242px;bottom:0;width:1436px;height:1080px;
  pointer-events:none;
}
#startmenu{
  /* v1.2.4 : 无背景面板 — 菜单项浮于开始按钮正上方, 再按一次收回 */
  position:absolute;left:8px;bottom:54px;width:212px;
  pointer-events:auto;
  transition:opacity .18s ease-out;
}
/* StartMenuView._tweenMillisecond / _easeType 相当。
   レイアウトを動かさない opacity だけを使う (transform を使うと
   フレームが進まない環境で潰れたまま残る危険がある) */
#startmenu.opening{opacity:0}
/* NewGame / LoadGame / MyPicture / ControllPanel / Reboot / shutdown
   すべて size(200,40) piv(0.5,0.5) */
.menu-item{
  position:relative;width:200px;height:40px;
  border-style:solid;border-width:0 2px 2px 0;
  border-image:url(ngo-extracted/sprites/BaseButton.png) 0 2 2 0 fill stretch;
  display:flex;align-items:center;cursor:pointer;
}
.menu-item span{margin-left:14px;font-size:16px;color:#3b1670}
.menu-item:hover{
  border-image:url(ngo-extracted/sprites/BaseButtonHovered.png) 0 2 2 0 fill stretch;
}
.menu-item:active{
  border-width:5px 5px 5px 4px;
  border-image:url(ngo-extracted/sprites/BaseButtonPressed.png) 5 5 5 4 fill stretch;
}

/* ---------------------------------------------------------------------
   Shortcut._tooltip (TooltipCaller)
   tooltip_balloon.png 160x100  border L9,B28,R42,T8  尻尾は右下
   --------------------------------------------------------------------- */
#tooltip{
  position:absolute;left:0;top:0;max-width:420px;
  border-style:solid;border-width:8px 42px 28px 9px;
  border-image:url(ngo-extracted/sprites/tooltip_balloon.png) 8 42 28 9 fill stretch;
  font-size:15px;line-height:1.4;color:#3b1670;
  pointer-events:none;z-index:9000;white-space:nowrap;
}

/* v1.2.2 : 任务栏/开始菜单/气泡提示恢复显示 (原被 narrowed delivery 隐藏) */
#taskbar-clock{
  position:absolute;right:152px;top:50%;transform:translateY(-50%);
  /* v1.2.3 : 移到 day 按钮左侧, 不再重叠 */
  font-family:'DotGothic16','ZpixWeb',monospace;font-size:15px;color:#3b1670;
  letter-spacing:1px;
}

/* ---------------------------------------------------------------------
   v1.2.0 : 游戏内鼠标 / 开机流程 / 设置应用
   --------------------------------------------------------------------- */
@font-face{
  font-family:'ZpixWeb';
  src:url('fonts/zpix-subset.ttf') format('truetype');
  font-display:swap;
}
/* 游戏内鼠标 : cursor.png 24x32, 热点在箭头尖端 (2,2) */
html,body,button,input,select,textarea,label,a,[role='button']{
  cursor:url('ngo-extracted/sprites/cursor.png') 2 2,default!important;
}
/* v1.2.8 : 原版手型光标 (App_Webcam head 命中区) — 覆盖上方的全局箭头 !important;
   cursor_hand.png 32x32, 热点在指尖 (10,2) */
.webcam-head-hit{
  cursor:url('ngo-extracted/sprites/cursor_hand.png') 10 2,pointer!important;
}
/* v1.3.0 : AnySearch 搜索窗口 (AnySearchApp) */
.anysearch-app{position:absolute;inset:0;display:flex;flex-direction:column;gap:6px;
  padding:8px;background:#fff8ff;font-size:12px;color:#3c3450}
.anysearch-bar{display:flex;gap:4px}
.anysearch-input{flex:1;min-width:0;height:22px;padding:0 6px;border:1px solid #b9a0d9;
  background:#fff;font-size:12px;color:#2a2140}
.anysearch-go{height:22px;padding:0 12px;border:1px solid #b9a0d9;background:#efe4fa;
  color:#4a3670;cursor:pointer;font-size:12px}
.anysearch-go:active{background:#e0d0f5}
.anysearch-status{color:#7c6598;min-height:14px}
.anysearch-results{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:6px;
  padding-right:2px}
.anysearch-item{padding:5px 6px;border:1px solid #e2d4f2;background:#fff}
.anysearch-title{display:block;color:#1a0dab;font-weight:bold;text-decoration:none;
  word-break:break-all;cursor:pointer}
.anysearch-title:hover{text-decoration:underline}
.anysearch-url{color:#0a7d33;font-size:10px;word-break:break-all}
.anysearch-snippet{margin-top:2px;font-size:11px;line-height:1.45;color:#3c3450}
/* 开机流程层 */
#boot-layer{position:absolute;inset:0;z-index:9000;transition:opacity .4s}
.boot-page{position:absolute;inset:0;background:#000}
/* v1.3.2 : 音频门 — 黑底闪烁 PRESS ANY KEY, 首次手势后进 BIOS */
#boot-gate .boot-gate-box{position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:16px}
.boot-gate-en{font-family:'ZpixWeb',monospace;font-size:24px;color:#c8c8c8;
  letter-spacing:4px;animation:bootGateBlink 1.1s steps(2,start) infinite}
.boot-gate-cn{font-family:'ZpixWeb',monospace;font-size:13px;color:#7a7a7a;letter-spacing:2px}
@keyframes bootGateBlink{50%{opacity:0}}
.boot-page.hidden{display:none}
/* v1.2.1 : 所有开机内容约束到 16:9 舞台, 任意窗口比例下不裁切不变形 */
.boot-stage{
  position:absolute;left:50%;top:50%;
  width:calc(1920px * var(--scale,1));height:calc(1080px * var(--scale,1));
  transform:translate(-50%,-50%);
}
#boot-bios .boot-bios-bg{position:absolute;inset:0;width:100%;height:100%}
#boot-bios .boot-mark-ten{position:absolute;right:2%;top:2%;width:7.4%}
.boot-bios-line{
  position:absolute;left:0;right:0;bottom:3%;
  display:flex;align-items:center;justify-content:center;gap:10px;
  font-family:'ZpixWeb',monospace;font-size:20px;color:#c8c8c8;letter-spacing:1px;
}
.boot-bios-line img{width:36px;height:36px}
#boot-version{
  position:absolute;left:2%;bottom:3%;
  font-family:'ZpixWeb',monospace;font-size:13px;color:#5a5a5a;letter-spacing:1px;
}
/* v1.2.3 : 开机层图片禁用浏览器拖拽 */
#boot-layer img{-webkit-user-drag:none;user-select:none}
/* v1.2.2 : BIOS 底部 "Booting Windose20" 文字 (原作: 1242x50 文本框, 底部居中, 左对齐,
   24px 灰色 RGBA(0.694,0.694,0.690), 加载时以动画省略号表现进度) */
.boot-booting{
  position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:calc(1242.6px * var(--scale,1));height:calc(50px * var(--scale,1));
  overflow:hidden;
}
.boot-booting-label{
  font-family:'ZpixWeb',monospace;
  font-size:calc(24px * var(--scale,1));color:#b1b1b0;letter-spacing:1px;
  white-space:nowrap;
}
/* Windose20 过场 : 黑底中淡入淡出 */
#boot-windose .boot-setup-bg{opacity:0;transition:opacity 1.2s;
  left:0;top:0;width:100%;height:100%}   /* v1.2.4 : bg_boot_en 全屏铺满 */
#boot-windose.visible .boot-setup-bg{opacity:1}
/* 欢迎提示 (原作 Welcome 版式) : 透明页, 覆盖在存档页之上 */
#boot-welcome{background:transparent}
#boot-welcome-box{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;align-items:center;gap:calc(28px * var(--scale,1));
  opacity:0;transition:opacity .45s;
}
#boot-welcome.visible #boot-welcome-box{opacity:1}
.boot-welcome-text{
  /* 原作 : ようこそ 40pt 粉色 RGBA(0.918,0.628,0.910) */
  font-family:'ZpixWeb',monospace;font-size:calc(40px * var(--scale,1));
  color:#ea9fe8;text-shadow:0 0 3px #fff,0 0 3px #fff,1px 1px 0 #fff;
  white-space:nowrap;
}
.boot-welcome-divider{width:2px;height:calc(200px * var(--scale,1));background:#c9a6dc}
.boot-welcome-data{
  display:flex;flex-direction:column;align-items:center;gap:calc(10px * var(--scale,1));
  font-family:'ZpixWeb',monospace;font-size:calc(17px * var(--scale,1));color:#3b1670;
  text-shadow:0 0 3px #fff,0 0 3px #fff,1px 1px 0 #fff;
}
.boot-welcome-data img{width:51px;height:51px}
/* 存档选择页 : 原作专用 "Windose 20 Setup" 背景 (中央 1436px 区域), 两侧黑 */
.boot-setup-bg{
  position:absolute;top:0;
  left:calc(242px * var(--scale,1));
  width:calc(1436px * var(--scale,1));height:100%;
}
#boot-save{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;gap:26px;
  pointer-events:auto;
}
#boot-slot{
  position:relative;width:200px;height:160px;padding:0;border:0;
  background:transparent;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  font-family:'ZpixWeb',monospace;font-size:18px;color:#3b1670;
  text-shadow:0 0 3px #fff,0 0 3px #fff,1px 1px 0 #fff;
}
#boot-slot .boot-slot-icon{width:51px;height:51px}
#boot-slot .boot-slot-badge{
  /* v1.2.5 : 锚定存档图标右上角 (图标 51x51 顶居中, 内容垂直居中 icon 顶≈36) */
  position:absolute;left:112px;top:32px;width:27px;height:27px;
  animation:badge-bob .9s ease-in-out infinite alternate;
}
#boot-slot:hover,#boot-slot.selected{filter:brightness(1.08) drop-shadow(0 0 3px #fff)}
#boot-enter{
  width:200px;height:40px;border:0;padding:0;
  background:url('ngo-extracted/sprites/BaseButton.png') no-repeat center/100% 100%;
  font-family:'ZpixWeb',monospace;font-size:16px;color:#3b1670;
}
#boot-enter:hover{background-image:url('ngo-extracted/sprites/BaseButtonHovered.png')}
#boot-enter:active{background-image:url('ngo-extracted/sprites/BaseButtonPressed.png')}
/* 开机期间 : 图标/窗口隐藏, 任务栏不可交互 (本版本任务栏本身隐藏) */
body.booting #shortcut-parent{visibility:hidden}
body.booting #window-parent{display:none}
body.booting #taskbar,body.booting #startmenu-parent{visibility:hidden;pointer-events:none}
/* v1.2.2 : 关机画面 */
#shutdown-screen{
  position:fixed;inset:0;background:#000;z-index:99999;
  display:flex;align-items:center;justify-content:center;
}
#shutdown-screen .shutdown-text{
  font-family:'ZpixWeb',monospace;font-size:24px;color:#c8c8c8;
  text-align:center;line-height:2;letter-spacing:2px;
}
#shutdown-screen .shutdown-text span{font-size:14px;color:#6a6a6a}
/* 设置应用 */
.settings-app{
  box-sizing:border-box;height:100%;overflow:auto;
  display:flex;flex-direction:column;gap:10px;padding:12px 16px;
  background:#fff8ff;
}
.settings-title{font-size:16px;font-weight:bold;color:#3b1670}
.settings-sec{
  margin-top:2px;padding-bottom:2px;border-bottom:1px solid #e0cbe9;
  font-size:13px;color:#75458f;
}
.settings-row{display:flex;align-items:center;gap:10px;min-height:30px}
.settings-label{width:52px;font-size:13px;color:#3b1670;flex:none}
.settings-range{flex:1;min-width:0}
.settings-value{width:36px;text-align:right;font-size:12px;color:#3b1670;flex:none}
.settings-check{width:16px;height:16px;flex:none}