/* ============================================================
   Vixcess corporate site — Windows 3.0 (Program Manager) theme
   共通スタイル。全ページがこれを読む。
   ============================================================ */
:root{
  --face:#c0c0c0;
  --lite:#ffffff;
  --shadow:#808080;
  --dark:#000000;
  --title:#000080;
  --title-off:#808080;
  --desk:#008080;
  --txt:#000000;
  --sel:#000080;
}
*{box-sizing:border-box}
body{
  margin:0;min-height:100vh;background:var(--desk);color:var(--txt);
  font-family:"MS Sans Serif","Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",Geneva,Verdana,sans-serif;
  font-size:14px;line-height:1.6;-webkit-font-smoothing:none;
}
.sunken{border:1px solid var(--dark);box-shadow:inset -1px -1px 0 var(--lite),inset 1px 1px 0 var(--shadow);background:var(--lite)}
a{color:#000080}

#desktop{position:relative;min-height:100vh;padding:10px 10px 60px}

/* ---------- ウィンドウ ---------- */
.win{position:absolute;background:var(--face);border:1px solid var(--dark);padding:2px;
     box-shadow:inset 1px 1px 0 var(--lite),inset -1px -1px 0 var(--shadow);z-index:1}
.win.inactive{border-color:var(--shadow);box-shadow:inset 1px 1px 0 #dfdfdf,inset -1px -1px 0 var(--shadow)}
.win.inactive > .titlebar{background:var(--title-off);color:#e6e6e6}
.win.collapsed{display:none}
.titlebar{display:flex;align-items:center;gap:5px;height:25px;padding:0 3px 0 7px;
          background:var(--title);color:#fff;font-weight:700;cursor:move;user-select:none}
.titlebar .t{flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tbtn{width:23px;height:20px;border:1px solid var(--dark);background:var(--face);
      box-shadow:inset 1px 1px 0 var(--lite),inset -1px -1px 0 var(--shadow);
      color:#000;font:700 13px/18px "MS Sans Serif",sans-serif;text-align:center;cursor:default;flex:0 0 auto}
.tbtn:active{box-shadow:inset -1px -1px 0 var(--lite),inset 1px 1px 0 var(--shadow)}
.menubar{display:flex;gap:16px;padding:5px 8px 5px 6px;border-bottom:1px solid var(--shadow);font-size:13.5px}
.menubar span{cursor:default;padding:0 2px}
.menubar span:hover{background:var(--sel);color:#fff}
.menubar u{text-decoration:underline}
.winbody{padding:7px}
.statusbar{display:flex;gap:8px;margin-top:8px;padding:4px 0 0;border-top:1px solid var(--shadow);
           box-shadow:inset 0 1px 0 var(--lite);font-size:12.5px}
.statusbar .cell{border:1px solid var(--shadow);box-shadow:inset 1px 1px 0 #dfdfdf;padding:0 6px;flex:0 0 auto}
.statusbar .grow{flex:1 1 auto}

.group{border:1px solid var(--shadow);box-shadow:inset 1px 1px 0 var(--lite);
       margin:15px 0 6px;padding:17px 11px 11px;position:relative}
.group > .cap{position:absolute;top:-9px;left:9px;background:var(--face);padding:0 5px;font-weight:700}

/* ---------- ボタン ---------- */
.btn3d{display:inline-block;min-width:96px;padding:5px 14px;margin:4px 5px 4px 0;background:var(--face);
       border:1px solid var(--dark);box-shadow:inset 1px 1px 0 var(--lite),inset -1px -1px 0 var(--shadow);
       color:#000;text-decoration:none;text-align:center;font:400 14px/1.5 inherit;cursor:pointer}
.btn3d:hover{background:#d4d0c8}
.btn3d:active{box-shadow:inset -1px -1px 0 var(--lite),inset 1px 1px 0 var(--shadow)}
.btn3d.primary{font-weight:700}
button.btn3d{font-family:inherit}

/* ---------- テキスト ---------- */
.notepad{font-family:"Courier New",ui-monospace,monospace;font-size:14px;line-height:1.6;
         white-space:pre;overflow:auto;padding:6px;max-height:300px}
.lnk{color:#000080;text-decoration:underline;cursor:pointer}
.lnk:hover{color:#0000ff}
.dim{color:#404040}
h1.page{font-size:19px;font-weight:700;margin:0 0 4px;line-height:1.45}
h2.page{font-size:16px;font-weight:700;margin:0 0 4px;line-height:1.45}
.small{font-size:12.5px}

/* ---------- アイコン ---------- */
.icons{display:flex;flex-wrap:wrap;gap:2px;padding:2px 0}
.icon{width:98px;padding:6px 2px 4px;text-align:center;cursor:pointer;user-select:none;
      color:inherit;text-decoration:none;display:block}
.icon svg{display:block;width:40px;height:40px;margin:0 auto 5px}
.icon .lbl{display:inline-block;padding:0 3px;line-height:1.3;font-size:13.5px}
.icon:hover .lbl{background:var(--sel);color:#fff}
.icon.selected .lbl{background:var(--sel);color:#fff}

/* ---------- DOS窓 ---------- */
.dos{background:#000;color:#c0c0c0;font-family:"Courier New",ui-monospace,monospace;font-size:14px;
     line-height:1.6;white-space:pre;overflow:auto;padding:8px;max-height:300px}
.dos .g{color:#4fe04f}.dos .y{color:#e6d64a}.dos .c{color:#63d8d8}.dos a{color:#63d8d8}

/* ---------- 表 ---------- */
.kv{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid #dfdfdf;padding:4px 5px}
.kv:last-child{border-bottom:0}
.kv b{font-family:"Courier New",monospace}

/* ---------- フォーム ---------- */
.field{margin-top:11px}
.field > label{display:block;margin-bottom:3px}
.req{color:#c00000;margin-left:5px;font-size:12.5px}
.inp{width:100%;padding:5px 6px;border:1px solid var(--dark);
     box-shadow:inset 1px 1px 0 var(--shadow),inset -1px -1px 0 var(--lite);
     background:#fff;font-family:inherit;font-size:14px;border-radius:0;-webkit-appearance:none;appearance:none}
textarea.inp{min-height:125px;resize:vertical;line-height:1.6}
.inp:focus{outline:1px dotted #000;outline-offset:-4px}
.hint{color:#404040;font-size:12.5px;margin-top:5px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.formmsg{margin-top:10px;padding:7px;display:none;border:1px solid var(--dark);
         box-shadow:inset 1px 1px 0 var(--shadow);background:#ffffcc}
.formmsg.show{display:block}

/* ---------- 最小化バー ---------- */
#minrow{position:fixed;left:0;right:0;bottom:0;display:flex;align-items:flex-start;gap:2px;
        padding:4px;background:rgba(0,0,0,.16);z-index:5}
#minrow:empty{display:none}
#minrow .micon{width:98px;text-align:center;cursor:pointer;color:#fff;user-select:none;font-size:12.5px}
#minrow .micon svg{width:36px;height:36px}
#minrow .micon .lbl{background:rgba(0,0,0,.3);padding:0 3px;display:inline-block}

/* ---------- ページ見出し（下層ページ用） ---------- */
.pagehint{color:#eaffff;text-shadow:0 1px 0 rgba(0,0,0,.45);font-size:13px;padding:2px 6px}

.closer{display:none;margin-top:8px}

@media (min-width:701px){ #desktop{height:auto;min-height:82vh} }

/* ---------- スマホ ---------- */
@media (max-width:700px){
  body{font-size:15.5px;line-height:1.7}
  #desktop{padding:8px 8px 16px;height:auto;min-height:0}
  .win{position:relative!important;left:auto!important;top:auto!important;
       width:auto!important;height:auto!important;margin:0 0 10px;z-index:auto!important}
  .titlebar{cursor:default}
  .tbtn{display:none}
  .menubar{display:none}
  .winbody{padding:8px}
  .notepad,.dos{max-height:none;white-space:pre-wrap;font-size:15px;line-height:1.75}
  .icons{gap:12px}
  .icon{width:32%;min-width:104px;padding:8px 2px 6px}
  .statusbar{display:none}
  #minrow{display:none}
  .closer{display:inline-block}
  .inp{font-size:16px;padding:7px}
  textarea.inp{min-height:140px}
}