/* ===== 整机运行时:补充样式(配 screen.css + oldnokia.css) ===== */
html,body{ margin:0; height:100%; background:#0c0e11; }
body{ display:flex; align-items:center; justify-content:center; overflow:hidden; }

/* outline 像素图标(菜单九宫格) */
.gi .mi{ width:16px; height:16px; display:block; shape-rendering:crispEdges; }
.gi .mi rect{ fill:currentColor; }

/* outline 像素图标(列表行:信息/通话记录/设置;源自图标 workflow) */
.ico{ width:16px; height:16px; display:block; flex:0 0 auto; shape-rendering:crispEdges; }
.ico rect{ fill:currentColor; }

/* 状态栏闹钟指示(铃铛,开启时显示) */
.sb-alarm{ display:inline-flex; align-items:center; width:9px; height:9px; margin-right:3px; color:var(--fg); }
.sb-alarm .ico{ width:9px; height:9px; }
/* 闹钟响铃大铃铛 */
.bigbell{ width:40px; height:40px; color:var(--hi); }
.bigbell .ico{ width:40px; height:40px; }

/* 屏幕内容可点击(软键/列表项),取消默认选中态 */
#screen{ cursor:default; }
#screen [data-act],#screen [data-i]{ cursor:pointer; }
.softkeys span{ position:relative; }

/* 选项弹层(选项软键 → 底部弹出原生菜单) */
.opt-fill{ flex:1; }
.popup{ border-top:2px solid var(--fg); background:var(--bg); display:flex; flex-direction:column; max-height:80%; }
.popup-t{ font-size:9px; color:var(--dim); padding:2px 6px 1px; border-bottom:1px solid var(--dim); flex:0 0 auto; }
.popup .ob-list{ flex:1 1 auto; }
/* 通讯录·新建加号 */
.addbtn{ position:absolute; right:4px; top:50%; transform:translateY(-50%); width:12px; height:12px; line-height:11px; text-align:center; background:var(--fg); color:var(--bg); font-size:11px; cursor:pointer; }

/* 屏间淡入 */
@keyframes scr-in{ from{ opacity:.35 } to{ opacity:1 } }
#screen.anim{ animation:scr-in .12s ease-out; }

/* —— 待机 —— */
.sb-wall{ position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.sb-moon{ position:absolute; border-radius:50%; box-shadow:inset -3px -1px 0 0 var(--bg); }
.sb-star{ position:absolute; width:1px; height:1px; background:var(--fg); }
.sb-hill{ position:absolute; left:0; right:0; bottom:0; background:var(--dim); }
.sb-tree{ position:absolute; background:var(--fg); }
.sb-hint{ font-size:9px; color:var(--dim); }

/* —— 拨号 —— */
.dial-name{ font-size:11px; color:var(--hi); text-align:center; }
.dial-num{ font-family:'nokiafc22'; font-size:24px; color:var(--fg); text-align:center; letter-spacing:1px; line-height:1.1; word-break:break-all; padding:0 4px; }
.dial-caret{ display:inline-block; animation:blink .7s steps(1,end) infinite; }
.dial-hint{ font-size:8px; color:var(--dim); text-align:center; }
.dial-call{ display:inline-block; width:8px; height:8px; border-radius:2px; background:var(--hi); margin-right:3px; vertical-align:-1px; }

/* —— 通话中 / 拨出 / 结束 —— */
.call-c{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; }
.call-name{ font-size:14px; color:var(--hi); }
.call-num{ font-size:9px; color:var(--dim); }
.call-time{ font-family:'nokiafc22'; font-size:26px; color:var(--fg); }
.call-state{ font-size:10px; color:var(--fg); }
.call-hs{ width:16px; height:16px; border:2px solid currentColor; border-radius:50%; position:relative; color:var(--fg); }
.call-hs::after{ content:""; position:absolute; left:50%; top:50%; width:4px; height:7px; background:currentColor; transform:translate(-50%,-50%); }
.dots::after{ content:"…"; animation:dots 1.2s steps(4,end) infinite; }
@keyframes dots{ 0%{content:"";}25%{content:"·";}50%{content:"··";}75%{content:"···";} }
.call-sw{ font-size:8px; color:var(--dim); }

/* —— 主题色样网格 —— */
.theme-grid{ flex:1; display:grid; grid-template-columns:1fr 1fr; gap:3px; padding:4px; align-content:center; }
.tsw{ position:relative; background:var(--bg); color:var(--fg); border:1px solid var(--dim); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; padding:5px 2px; overflow:hidden; }
.tsw .tsw-aa,.tsw .tsw-cl,.tsw .tsw-nm{ color:var(--fg); }
.tsw.sel{ border:2px solid #fff; }
.tsw .tsw-aa{ font-size:11px; }
.tsw .tsw-cl{ font-size:9px; font-family:'nokiafc22'; }
.tsw .tsw-nm{ font-size:8px; margin-top:1px; }

/* —— 壁纸选择 —— */
.wp-row{ flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:6px; }
.wp-opt{ width:54px; height:64px; border:1px solid var(--dim); position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.wp-opt.sel{ border:2px solid var(--hi); }
.wp-cap{ font-size:8px; color:var(--fg); text-align:center; margin-top:2px; }

/* —— 进度条 / 音乐 —— */
.pbar{ height:3px; background:var(--dim); position:relative; margin:3px 0; }
.pbar > i{ position:absolute; left:0; top:0; bottom:0; background:var(--fg); }
.pt{ display:flex; justify-content:space-between; font-size:8px; color:var(--dim); }
.viz{ display:flex; align-items:flex-end; gap:1px; height:14px; }
.viz i{ width:2px; height:100%; background:var(--fg); transform-origin:bottom; animation:vizbar .85s ease-in-out infinite alternate; }
@keyframes vizbar{ from{ transform:scaleY(.16) } to{ transform:scaleY(1) } }
.np-big{ font-size:20px; color:var(--hi); text-align:center; line-height:1.1; }

/* —— 备忘录 —— */
.note-body{ flex:1; padding:4px 5px; color:var(--fg); font-family:var(--cnf); font-size:12px; line-height:1.4; overflow:hidden; white-space:pre-wrap; }
.note-sb{ position:absolute; right:1px; top:18px; bottom:18px; width:2px; background:var(--dim); }
.note-sb > i{ position:absolute; left:0; width:2px; height:30%; background:var(--fg); top:0; }
.caret{ display:inline-block; animation:blink .7s steps(1,end) infinite; }
@keyframes blink{ 50%{ opacity:0; } }

/* —— 相册 / 日历 / 相机 —— */
.ph-grid{ flex:1; display:grid; grid-template-columns:repeat(3,1fr); gap:2px; padding:4px; align-content:start; }
.ph-grid{ overflow-y:auto; overflow-x:hidden; scrollbar-width:none; }
.ph-grid::-webkit-scrollbar{ display:none; }
.ph-th{ height:42px; border:1px solid var(--dim); background:repeating-linear-gradient(45deg,var(--bg),var(--bg) 2px,var(--dim) 2px,var(--dim) 3px); }
.ph-th.sel{ border:2px solid var(--hi); }
/* 相册真实照片:缩略图填满格、大图居中;平滑缩放(让点阵/反光那层去做"屏感") */
.ph-img{ width:100%; height:100%; object-fit:cover; display:block; image-rendering:auto; }
.ph-full{ max-width:100%; max-height:100%; min-height:0; object-fit:contain; display:block; image-rendering:auto; }
.cal-grid{ flex:1; display:grid; grid-template-columns:repeat(7,1fr); gap:1px; padding:2px 3px; align-content:start; }
.cal-h{ font-size:7px; color:var(--dim); text-align:center; }
.cal-d{ font-size:9px; color:var(--fg); text-align:center; padding:1px 0; font-family:'nokiafc22'; position:relative; }
.cal-d.today{ background:var(--fg); color:var(--bg); }
.cal-d.has::after{ content:""; position:absolute; left:50%; bottom:0; width:2px; height:2px; background:currentColor; transform:translateX(-50%); }
.cal-hint{ flex:0 0 auto; text-align:center; font-size:7px; color:var(--dim); padding:1px 0 2px; }

/* 收件箱信封图标(定宽,左缘对齐;未读闭口/已读开口) + 读信发件人 */
.envic{ width:13px; height:9px; flex:0 0 auto; display:block; }
.rd-from{ font-size:12px; color:var(--hi); padding:3px 5px 1px; }
/* 写信息·输入法模式标(拼音/Abc/123) */
.ime-mode{ position:absolute; right:4px; top:50%; transform:translateY(-50%); font-size:8px; color:var(--bg); background:var(--fg); border:1px solid var(--fg); border-radius:2px; padding:0 3px; line-height:11px; cursor:pointer; white-space:nowrap; }
/* 袁朗正在输入(等真·Sonnet 回信) */
.lang-typing{ flex:0 0 auto; font-size:9px; color:var(--hi); padding:2px 5px; border-bottom:1px solid var(--dim); }

/* ===== 诺基亚 Conversations:会话列表 + 对话线程底部输入栏 ===== */
.cv-row{ align-items:center; }
.cv-av{ flex:0 0 auto; width:20px; height:20px; border:1px solid var(--dim); display:flex; align-items:center; justify-content:center; font-size:12px; color:var(--hi); font-family:var(--cnf); }
.cv-mid{ flex:1; min-width:0; }
.cv-name{ font-size:12px; color:var(--hi); display:flex; align-items:center; gap:4px; line-height:1.15; }
.cv-snip{ font-size:9px; color:var(--dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.2; }
.cv-time{ flex:0 0 auto; font-size:8px; color:var(--dim); align-self:flex-start; padding-top:1px; }
.cv-dot{ width:5px; height:5px; border-radius:50%; background:var(--hi); display:inline-block; }
.lrow.sel .cv-av{ color:var(--bg); border-color:var(--bg); }
.lrow.sel .cv-name, .lrow.sel .cv-snip, .lrow.sel .cv-time, .lrow.sel .cv-dot{ color:var(--bg); }
.lrow.sel .cv-dot{ background:var(--bg); }
/* 线程底部常驻输入栏(诺基亚"写短信…") */
.cv-input{ flex:0 0 auto; border-top:1px solid var(--dim); padding:3px 5px; }
.cv-field{ font-size:12px; min-height:14px; color:var(--fg); line-height:1.3; word-break:break-all; }
.cv-ph{ color:var(--dim); }
.cv-py{ color:var(--hi); font-size:10px; margin-left:2px; }
.cam-vf{ flex:1; position:relative; margin:4px; border:1px solid var(--dim); display:flex; align-items:center; justify-content:center; }
.cam-corner{ position:absolute; width:8px; height:8px; border:2px solid var(--fg); }
.cam-shot{ font-size:9px; color:var(--dim); }

/* —— 与袁朗的会话(Conversations 串联) —— */
.thread{ flex:1; overflow:hidden; padding:3px 4px; }
.trow{ display:flex; margin:3px 0; }
.trow.me{ justify-content:flex-end; }
.tcol{ max-width:82%; }
.tmsg{ border:1px solid var(--dim); padding:2px 5px; font-size:12px; line-height:1.3; color:var(--fg); }
.trow.me .tmsg{ background:var(--fg); color:var(--bg); border-color:var(--fg); }
.tt{ font-size:8px; color:var(--dim); margin-top:1px; }
.trow.me .tt{ text-align:right; }
.tdate{ text-align:center; font-size:8px; color:var(--dim); padding:1px 0 4px; }

/* —— 拼音候选输入区(写短信) —— */
/* 固定高度锚定:候选有无都不顶动正文区(避免 reflow 跳动) */
.ime-zone{ flex:0 0 auto; height:34px; box-sizing:border-box; border-top:1px solid var(--dim); padding:3px 4px; overflow:hidden; }
.py-line{ font-size:10px; color:var(--hi); height:12px; line-height:12px; font-family:var(--cnf); overflow:hidden; }
.cands{ display:flex; gap:5px; flex-wrap:nowrap; height:16px; overflow:hidden; align-items:center; }
.cand{ font-family:var(--cnf); font-size:12px; color:var(--fg); cursor:pointer; }
.cand b{ color:var(--dim); font-size:8px; margin-right:1px; }

/* ===== 状态栏新信息信封 ===== */
.sb-env{ display:inline-flex; align-items:center; margin-right:3px; }
.sb-env .envic{ width:10px; height:8px; }

/* ===== 新短信推送屏 ===== */
.notify-env{ color:var(--hi); }
.notify-env .envic{ width:30px; height:22px; }

/* ===== 贪吃蛇 ===== */
.snk-wrap{ flex:1; position:relative; display:flex; align-items:center; justify-content:center; }
#snk{ image-rendering:pixelated; display:block; background:transparent; }
.snk-over{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  background:color-mix(in srgb, var(--bg) 72%, transparent); }
.snk-over .t{ font-size:13px; color:var(--hi); }
.snk-over .s{ font-size:9px; color:var(--dim); }

/* ===== 红/绿通话键:用数字键同一套照片精灵(.key)+ kp-down 下沉反馈;仅这两颗可点 ===== */
.keypad .key.ckey{ pointer-events:auto; cursor:pointer; -webkit-tap-highlight-color:transparent; }
