/* ======================================================================
 *  工位桌面 OS /desk-os.css
 *  浏览器里的假电脑桌面：窗口系统 + 多应用 + 一键避险
 *  复用全局变量，自动支持 [data-theme="dark"] 黑夜模式。
 * ====================================================================== */

.dos-wrap {
    --dos-accent: #2563eb; --dos-accent-soft: rgba(37,99,235,0.12);
    --dos-surface: var(--c-surface); --dos-soft: var(--c-surface-soft);
    --dos-text: var(--c-text); --dos-sub: var(--c-text-sub); --dos-muted: var(--c-text-muted);
    --dos-line: var(--c-border);
    --dos-bar: #0f172a; --dos-bar-text: #e2e8f0;
    --dos-win-bg: #ffffff; --dos-win-text: #0f172a;
    font-family: var(--font-sans, system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif);
}
[data-theme="dark"] .dos-wrap { --dos-accent: #60a5fa; --dos-bar: #0b1220; }

.dos-container { max-width: 1120px; margin: 0 auto; padding: 0 16px; }

/* Hero（小，突出桌面） */
.dos-hero { margin: 16px 0 16px; padding: 18px 22px; border-radius: 18px;
    background: linear-gradient(120deg, rgba(37,99,235,0.12), rgba(239,68,68,0.06));
    border: 1px solid var(--dos-line); }
.dos-hero h1 { margin: 0 0 6px; font-size: 22px; font-weight: 900; color: var(--dos-text); }
.dos-hero p { margin: 0; font-size: 13.5px; line-height: 1.7; color: var(--dos-sub); }
.dos-tags { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 7px; }
.dos-tag { font-size: 11.5px; font-weight: 700; padding: 3px 10px; border-radius: 99px;
    background: var(--dos-accent-soft); color: var(--dos-accent); border: 1px solid rgba(37,99,235,0.3); }

/* ============ 屏幕 ============ */
.dos-screen {
    position: relative; height: 660px; border-radius: 16px; overflow: hidden;
    border: 1px solid var(--dos-line); box-shadow: 0 24px 60px rgba(2,8,23,.32);
    background: #0b1220; user-select: none;
}
.dos-screen.full { position: fixed; inset: 0; z-index: 9999; height: auto; border-radius: 0; border: none; }
.dos-wall { position: absolute; inset: 0; background: linear-gradient(140deg, #1e3a8a, #0ea5e9 55%, #0891b2); transition: background .3s; }
.dos-wall.w2 { background: linear-gradient(140deg, #065f46, #10b981 60%, #0d9488); }
.dos-wall.w3 { background: linear-gradient(140deg, #4c1d95, #7c3aed 55%, #db2777); }
.dos-wall::after { content: ""; position: absolute; inset: 0;
    background: radial-gradient(500px 300px at 80% 20%, rgba(255,255,255,.16), transparent 70%); }

/* 桌面图标 */
.dos-icons { position: absolute; top: 14px; left: 14px; display: grid; grid-auto-flow: column;
    grid-template-rows: repeat(4, 92px); gap: 6px; z-index: 1; }
.dos-icon { width: 86px; padding: 8px 4px; border-radius: 8px; text-align: center; cursor: pointer;
    border: 1px solid transparent; transition: background .12s, border-color .12s; }
.dos-icon:hover { background: rgba(255,255,255,.12); }
.dos-icon.sel { background: rgba(37,99,235,.45); border-color: rgba(255,255,255,.5); }
.dos-icon .dos-ic-emo { font-size: 30px; line-height: 1.1; filter: drop-shadow(0 2px 3px rgba(0,0,0,.4)); }
.dos-icon .dos-ic-tx { font-size: 11px; color: #fff; margin-top: 4px; text-shadow: 0 1px 2px rgba(0,0,0,.6); }

/* 窗口层 */
.dos-windows { position: absolute; inset: 0 0 46px 0; z-index: 5; pointer-events: none; }
.dos-win { position: absolute; pointer-events: auto; background: var(--dos-win-bg); color: var(--dos-win-text);
    border-radius: 10px; box-shadow: 0 18px 44px rgba(2,8,23,.45); display: flex; flex-direction: column;
    min-width: 300px; min-height: 180px; overflow: hidden; border: 1px solid rgba(0,0,0,.15); }
.dos-win.hidden { display: none; }
.dos-win.active { box-shadow: 0 22px 56px rgba(2,8,23,.55), 0 0 0 1px var(--dos-accent); }
.dos-wtitle { height: 34px; flex: none; display: flex; align-items: center; gap: 7px; padding: 0 8px;
    background: linear-gradient(180deg, #f8fafc, #e8edf5); border-bottom: 1px solid #d7dee9; cursor: grab; }
.dos-wtitle:active { cursor: grabbing; }
.dos-win.active .dos-wtitle { background: linear-gradient(180deg, #dbeafe, #bfdbfe); }
.dos-wtitle .dos-w-ic { font-size: 15px; }
.dos-wtitle .dos-w-tx { font-size: 12.5px; font-weight: 700; color: #1e293b; flex: 1;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dos-wbtns { display: flex; gap: 4px; }
.dos-wbtns button { width: 26px; height: 22px; border: none; border-radius: 4px; background: #e2e8f0;
    color: #475569; font-size: 12px; cursor: pointer; line-height: 1; }
.dos-wbtns button:hover { background: #cbd5e1; }
.dos-wbtns .dos-b-close:hover { background: #ef4444; color: #fff; }
.dos-wbody { flex: 1; overflow: auto; background: var(--dos-win-bg); }
.dos-resize { position: absolute; right: 0; bottom: 0; width: 14px; height: 14px; cursor: nwse-resize; }
.dos-resize::after { content: ""; position: absolute; right: 3px; bottom: 3px; width: 7px; height: 7px;
    border-right: 2px solid #94a3b8; border-bottom: 2px solid #94a3b8; }

/* 任务栏 */
.dos-taskbar { position: absolute; left: 0; right: 0; bottom: 0; height: 46px; z-index: 50;
    background: var(--dos-bar); display: flex; align-items: center; gap: 8px; padding: 0 10px;
    border-top: 1px solid rgba(255,255,255,.08); }
.dos-start-btn { height: 34px; padding: 0 14px; border: none; border-radius: 6px; cursor: pointer;
    background: linear-gradient(180deg, #3b82f6, #2563eb); color: #fff; font-size: 13px; font-weight: 800; }
.dos-start-btn:hover { filter: brightness(1.08); }
.dos-tasks { flex: 1; display: flex; gap: 6px; overflow: hidden; }
.dos-task { max-width: 168px; height: 34px; padding: 0 10px; border: none; border-radius: 6px; cursor: pointer;
    background: rgba(255,255,255,.08); color: var(--dos-bar-text); font-size: 12px; font-weight: 600;
    display: flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; }
.dos-task:hover { background: rgba(255,255,255,.16); }
.dos-task.on { background: rgba(59,130,246,.55); box-shadow: inset 0 0 0 1px rgba(255,255,255,.25); }
.dos-tray { display: flex; align-items: center; gap: 10px; color: var(--dos-bar-text); font-size: 12px; }
.dos-clock { font-variant-numeric: tabular-nums; font-weight: 700; }
.dos-panic-btn { height: 30px; padding: 0 12px; border: none; border-radius: 6px; cursor: pointer;
    background: linear-gradient(180deg, #ef4444, #dc2626); color: #fff; font-size: 12px; font-weight: 800; }
.dos-panic-btn:hover { filter: brightness(1.08); }
.dos-fs-btn { height: 30px; padding: 0 10px; border: none; border-radius: 6px; cursor: pointer;
    background: rgba(255,255,255,.12); color: var(--dos-bar-text); font-size: 12px; }

/* 开始菜单 */
.dos-startmenu { position: absolute; left: 10px; bottom: 52px; width: 232px; z-index: 60;
    background: rgba(15,23,42,.96); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.14);
    border-radius: 10px; padding: 8px; box-shadow: 0 18px 40px rgba(0,0,0,.5); display: none; }
.dos-startmenu.open { display: block; }
.dos-startmenu .dos-sm-h { font-size: 11px; color: #94a3b8; padding: 4px 8px 6px; letter-spacing: .5px; }
.dos-sm-item { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 9px; border: none;
    background: none; color: #e2e8f0; font-size: 13px; cursor: pointer; border-radius: 6px; text-align: left; }
.dos-sm-item:hover { background: rgba(59,130,246,.4); }
.dos-sm-item .e { font-size: 17px; }

/* ============ 避险（panic）覆盖 ============ */
.dos-panic { position: absolute; inset: 0; z-index: 900; background: #f1f5f9; display: none;
    flex-direction: column; color: #0f172a; }
.dos-panic.on { display: flex; }
.dos-pk-bar { height: 40px; background: #1d4ed8; color: #fff; display: flex; align-items: center;
    gap: 10px; padding: 0 14px; font-size: 13px; font-weight: 700; }
.dos-pk-bar .dot { width: 9px; height: 9px; border-radius: 50%; background: #4ade80; }
.dos-pk-body { flex: 1; padding: 18px; overflow: auto; background: #fff; }
.dos-pk-body h4 { margin: 0 0 4px; font-size: 15px; color: #0f172a; }
.dos-pk-body .pk-sub { font-size: 12px; color: #64748b; margin: 0 0 14px; }
.dos-pk-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 16px; }
.dos-pk-card { border: 1px solid #e2e8f0; border-radius: 8px; padding: 10px 12px; background: #f8fafc; }
.dos-pk-card .k { font-size: 11px; color: #64748b; }
.dos-pk-card .v { font-size: 19px; font-weight: 800; color: #1d4ed8; font-variant-numeric: tabular-nums; }
.dos-pk-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.dos-pk-table th, .dos-pk-table td { border: 1px solid #e2e8f0; padding: 7px 9px; text-align: left; color: #334155; }
.dos-pk-table th { background: #eff4fb; font-weight: 700; }
.dos-pk-foot { height: 34px; border-top: 1px solid #e2e8f0; background: #f8fafc; display: flex;
    align-items: center; justify-content: space-between; padding: 0 14px; font-size: 11.5px; color: #64748b; }

/* ============ 应用内部 ============ */
/* 文档 */
.dos-app-docs { display: flex; flex-direction: column; height: 100%; }
.dos-doc-tool { flex: none; display: flex; gap: 4px; padding: 6px 8px; border-bottom: 1px solid #e2e8f0; background: #f8fafc; flex-wrap: wrap; }
.dos-doc-tool button { padding: 4px 9px; font-size: 12px; border: 1px solid #dbe3ee; background: #fff;
    border-radius: 5px; cursor: pointer; color: #334155; }
.dos-doc-tool button:hover { background: #eef2f8; }
.dos-doc-tool .sp { flex: 1; }
.dos-doc-tool .cnt { font-size: 11.5px; color: #64748b; align-self: center; }
.dos-doc-area { flex: 1; padding: 20px 26px; outline: none; font-size: 13.5px; line-height: 1.9; color: #1e293b; overflow: auto; }
.dos-doc-area h3 { margin: 0 0 8px; font-size: 16px; }
.dos-doc-area p { margin: 0 0 10px; }

/* 表格 */
.dos-app-sheet { display: flex; flex-direction: column; height: 100%; }
.dos-sheet-bar { flex: none; padding: 5px 8px; border-bottom: 1px solid #e2e8f0; background: #f8fafc;
    font-size: 11.5px; color: #475569; display: flex; align-items: center; gap: 8px; }
.dos-sheet-fx { flex: 1; padding: 3px 7px; border: 1px solid #dbe3ee; border-radius: 4px; font-size: 12px;
    font-family: ui-monospace, Menlo, Consolas, monospace; background: #fff; color: #0f172a; }
.dos-sheet-wrap { flex: 1; overflow: auto; }
.dos-sheet { border-collapse: collapse; font-size: 12px; }
.dos-sheet th { background: #eff4fb; border: 1px solid #d7dee9; width: 66px; min-width: 46px;
    font-weight: 700; color: #475569; padding: 3px 5px; text-align: center; }
.dos-sheet td { border: 1px solid #e2e8f0; padding: 0; min-width: 66px; }
.dos-sheet td input { width: 100%; border: none; outline: none; padding: 4px 6px; font-size: 12px;
    background: transparent; color: #0f172a; font-family: inherit; }
.dos-sheet td input:focus { background: #dbeafe; box-shadow: inset 0 0 0 2px #2563eb; }
.dos-sheet .dos-calc { background: #f0fdf4; font-weight: 700; }

/* 邮件 */
.dos-app-mail { display: flex; height: 100%; }
.dos-mail-list { width: 44%; border-right: 1px solid #e2e8f0; overflow: auto; background: #f8fafc; }
.dos-mail-item { padding: 9px 11px; border-bottom: 1px solid #eef2f7; cursor: pointer; }
.dos-mail-item:hover { background: #eef2f8; }
.dos-mail-item.on { background: #dbeafe; }
.dos-mail-item .m-t { font-size: 12.5px; font-weight: 700; color: #0f172a; display: flex; justify-content: space-between; gap: 6px; }
.dos-mail-item .m-f { font-size: 11px; color: #64748b; }
.dos-mail-item .m-p { font-size: 11.5px; color: #475569; margin-top: 3px; overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap; }
.dos-mail-item.unread .m-t { color: #1d4ed8; }
.dos-mail-view { flex: 1; display: flex; flex-direction: column; }
.dos-mail-head { padding: 11px 14px; border-bottom: 1px solid #e2e8f0; }
.dos-mail-head .s { font-size: 14px; font-weight: 800; color: #0f172a; }
.dos-mail-head .f { font-size: 11.5px; color: #64748b; margin-top: 3px; }
.dos-mail-body { flex: 1; padding: 14px; font-size: 13px; line-height: 1.85; color: #334155; overflow: auto; }
.dos-mail-reply { flex: none; border-top: 1px solid #e2e8f0; padding: 8px; display: flex; gap: 6px; background: #f8fafc; }
.dos-mail-reply input { flex: 1; padding: 6px 9px; border: 1px solid #dbe3ee; border-radius: 6px; font-size: 12.5px; }
.dos-mail-reply button { padding: 6px 13px; border: none; border-radius: 6px; background: #2563eb; color: #fff;
    font-size: 12.5px; font-weight: 700; cursor: pointer; }

/* 聊天 */
.dos-app-chat { display: flex; height: 100%; }
.dos-chat-side { width: 32%; border-right: 1px solid #e2e8f0; background: #f8fafc; overflow: auto; }
.dos-chat-ct { padding: 9px 11px; border-bottom: 1px solid #eef2f7; cursor: pointer; display: flex; gap: 8px; align-items: center; }
.dos-chat-ct:hover { background: #eef2f8; }
.dos-chat-ct.on { background: #dbeafe; }
.dos-chat-ct .a { font-size: 19px; }
.dos-chat-ct .n { font-size: 12.5px; font-weight: 700; color: #0f172a; }
.dos-chat-main { flex: 1; display: flex; flex-direction: column; }
.dos-chat-log { flex: 1; overflow: auto; padding: 12px; background: #f1f5f9; }
.dos-msg { display: flex; gap: 7px; margin-bottom: 10px; align-items: flex-end; }
.dos-msg.me { flex-direction: row-reverse; }
.dos-msg .av { width: 28px; height: 28px; border-radius: 6px; display: grid; place-items: center;
    background: #fff; font-size: 15px; flex: none; border: 1px solid #e2e8f0; }
.dos-msg .bb { max-width: 74%; padding: 7px 10px; border-radius: 9px; font-size: 12.5px; line-height: 1.6;
    background: #fff; color: #0f172a; border: 1px solid #e2e8f0; }
.dos-msg.me .bb { background: #2563eb; color: #fff; border-color: #2563eb; }
.dos-chat-typing { font-size: 11px; color: #64748b; padding: 0 12px 6px; height: 16px; }
.dos-chat-in { flex: none; display: flex; gap: 6px; padding: 8px; border-top: 1px solid #e2e8f0; background: #f8fafc; }
.dos-chat-in input { flex: 1; padding: 6px 9px; border: 1px solid #dbe3ee; border-radius: 6px; font-size: 12.5px; }
.dos-chat-in button { padding: 6px 13px; border: none; border-radius: 6px; background: #2563eb; color: #fff;
    font-size: 12.5px; font-weight: 700; cursor: pointer; }
.dos-quick { flex: none; display: flex; gap: 5px; padding: 0 8px 8px; background: #f8fafc; flex-wrap: wrap; }
.dos-quick button { padding: 3px 8px; font-size: 11px; border: 1px solid #dbe3ee; background: #fff;
    border-radius: 99px; cursor: pointer; color: #475569; }
.dos-quick button:hover { background: #eef2f8; }

/* 文件管理 */
.dos-app-files { display: flex; height: 100%; }
.dos-files-side { width: 30%; border-right: 1px solid #e2e8f0; background: #f8fafc; padding: 8px; overflow: auto; }
.dos-files-side div { padding: 6px 8px; font-size: 12.5px; border-radius: 5px; cursor: pointer; color: #334155; }
.dos-files-side div:hover { background: #eef2f8; }
.dos-files-side div.on { background: #dbeafe; font-weight: 700; }
.dos-files-main { flex: 1; padding: 10px; overflow: auto; }
.dos-file { display: inline-flex; flex-direction: column; align-items: center; gap: 4px; width: 84px;
    padding: 9px 4px; border-radius: 7px; cursor: pointer; text-align: center; }
.dos-file:hover { background: #eef2f8; }
.dos-file .e { font-size: 25px; }
.dos-file .n { font-size: 11px; color: #334155; word-break: break-all; line-height: 1.3; }

/* 设置 */
.dos-app-set { padding: 14px; font-size: 12.5px; color: #334155; overflow: auto; }
.dos-app-set h5 { margin: 0 0 8px; font-size: 13px; color: #0f172a; }
.dos-app-set .row { margin-bottom: 14px; }
.dos-app-set .opts { display: flex; gap: 6px; flex-wrap: wrap; }
.dos-app-set .opts button { padding: 5px 11px; font-size: 12px; border: 1px solid #dbe3ee; background: #fff;
    border-radius: 6px; cursor: pointer; color: #334155; }
.dos-app-set .opts button.on { background: #2563eb; color: #fff; border-color: #2563eb; }
.dos-app-set ul { margin: 0; padding-left: 18px; line-height: 1.9; }
.dos-app-set code { background: #f1f5f9; padding: 1px 5px; border-radius: 4px; font-size: 11.5px; }

/* 弹窗（彩蛋/提示） */
.dos-dialog { position: absolute; z-index: 800; left: 50%; top: 42%; transform: translate(-50%,-50%);
    background: #fff; border-radius: 10px; box-shadow: 0 20px 50px rgba(0,0,0,.4); width: 320px; overflow: hidden; }
.dos-dialog .dh { padding: 9px 12px; background: #1d4ed8; color: #fff; font-size: 13px; font-weight: 700;
    display: flex; justify-content: space-between; }
.dos-dialog .db { padding: 14px; font-size: 12.5px; line-height: 1.8; color: #334155; }
.dos-dialog .df { padding: 8px 12px; border-top: 1px solid #e2e8f0; display: flex; justify-content: flex-end; background: #f8fafc; }
.dos-dialog .df button { padding: 5px 14px; border: none; border-radius: 6px; background: #2563eb; color: #fff; cursor: pointer; font-size: 12.5px; }

/* 提示条 */
.dos-tip { margin: 10px 0 0; font-size: 12px; color: var(--dos-muted); line-height: 1.7; }
.dos-tip b { color: var(--dos-accent); }

/* 信息 / tabs / 相关 */
.dos-info { margin-top: 24px; }
.dos-info .dos-desc { font-size: 14px; line-height: 1.8; color: var(--dos-sub); }
.dos-info .dos-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); gap: 10px; margin-top: 14px; }
.dos-info .dos-meta .item { background: var(--dos-soft); border: 1px solid var(--dos-line); border-radius: 12px; padding: 10px 12px; }
.dos-info .dos-meta .item .k { font-size: 11.5px; color: var(--dos-muted); }
.dos-info .dos-meta .item .v { font-size: 13px; font-weight: 700; color: var(--dos-text); margin-top: 3px; }
.dos-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 22px 0 14px; border-bottom: 1px solid var(--dos-line); }
.dos-tabs button { padding: 9px 14px; font-size: 13.5px; font-weight: 700; border: none; background: none;
    color: var(--dos-muted); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.dos-tabs button.active { color: var(--dos-accent); border-bottom-color: var(--dos-accent); }
.dos-panel { display: none; } .dos-panel.active { display: block; }
.dos-panel h4 { font-size: 15px; color: var(--dos-text); margin: 6px 0 12px; }
.dos-panel p, .dos-panel li { font-size: 13.5px; line-height: 1.8; color: var(--dos-sub); }
.dos-panel ol { padding-left: 20px; }
.dos-faq details { border: 1px solid var(--dos-line); border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; background: var(--dos-soft); }
.dos-faq summary { font-weight: 700; cursor: pointer; color: var(--dos-text); font-size: 13.5px; }
.dos-faq .dos-a { margin-top: 9px; font-size: 13px; line-height: 1.75; color: var(--dos-sub); }
.dos-changelog li { list-style: none; margin-bottom: 10px; font-size: 13px; color: var(--dos-sub); }
.dos-changelog .ver { font-weight: 800; color: var(--dos-accent); margin-right: 8px; }
.dos-changelog .date { color: var(--dos-muted); margin-right: 8px; font-size: 12px; }
.dos-related { margin-top: 24px; } .dos-related h3 { font-size: 16px; color: var(--dos-text); margin: 0 0 12px; }
.dos-rel-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px,1fr)); gap: 12px; }
.dos-rel-item { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border: 1px solid var(--dos-line);
    border-radius: 14px; background: var(--dos-surface); text-decoration: none; color: var(--dos-text); transition: border-color .15s, transform .1s; }
.dos-rel-item:hover { border-color: var(--dos-accent); transform: translateY(-2px); }
.dos-rel-item .e { font-size: 22px; } .dos-rel-item b { font-size: 13.5px; display: block; } .dos-rel-item small { font-size: 11.5px; color: var(--dos-muted); }
.dos-rel-item .go { margin-left: auto; color: var(--dos-accent); font-weight: 800; }
.dos-disclaim { margin-top: 22px; font-size: 12px; line-height: 1.7; color: var(--dos-muted);
    background: var(--dos-soft); border: 1px dashed var(--dos-line); border-radius: 12px; padding: 12px 14px; }

@media (max-width: 720px) {
    .dos-screen { height: 520px; }
    .dos-icons { grid-template-rows: repeat(4, 80px); }
    .dos-icon { width: 74px; }
    .dos-pk-grid { grid-template-columns: repeat(2, 1fr); }
}