/* ===== 老款诺基亚单色 · 布局工具箱(配 screen.css 用) =====
   颜色全用 screen.css 主题变量(--bg/--fg/--dim/--hi/--tagbg/--tagfg),
   这样 5 套配色主题(.pal-glow/.pal-lcd/.pal-blue/.pal-amber/.pal-mono)都能切。 */

/* 状态栏:老款待机无下边框 */
.ob-bar{ border-bottom:none; }
.ob-op{ text-align:center; font-size:9px; color:var(--fg); padding:1px 0 0; }

/* 待机:大钟 */
.ob-main{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.ob-clock{ font-family:'nokiafc22'; font-size:38px; color:var(--fg); line-height:1; }
.ob-date{ font-size:10px; color:var(--fg); }

/* 标题条 */
.ob-gtitle{ text-align:center; font-size:12px; color:var(--fg); padding:1px 0 2px; border-bottom:1px solid var(--dim); }
.ob-herotitle{ height:17px; display:flex; align-items:center; justify-content:center; color:var(--bg); background:var(--fg); font-size:12px; }

/* 菜单 A:单个大图标(3310) */
.ob-menu{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; }
.ob-chev{ font-size:8px; color:var(--dim); line-height:1; }
.ob-bigicon{ width:44px; height:30px; border:3px solid var(--fg); position:relative; margin:4px 0 6px; }
.ob-bigicon::after{ content:""; position:absolute; left:-3px; right:-3px; top:-3px; height:0;
  border-left:25px solid transparent; border-right:25px solid transparent; border-top:16px solid var(--fg); }
.ob-item{ font-size:14px; color:var(--fg); }
.ob-pos{ font-size:8px; color:var(--dim); }

/* 菜单 B:3×3 宫格(已锁定的主菜单样式) */
.ob-grid{ flex:1; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; padding:4px 3px; align-content:center; }
.gi{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; padding:3px 0; color:var(--fg); }
.gi.sel{ background:var(--fg); color:var(--bg); }
.glabel{ font-size:8px; line-height:1; color:currentColor; }
.gi .ic{ width:16px; height:13px; }

/* 列表(收件箱/草稿箱/通话/联系人/菜单列表都可复用) */
.ob-list{ flex:1; padding:1px 0; overflow-y:auto; overflow-x:hidden; position:relative; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.ob-list::-webkit-scrollbar{ display:none; }
/* 真机标准:每行固定高度、文字上下居中、和行边界留均匀间距(行高 26) */
.lrow{ display:flex; align-items:center; gap:6px; min-height:26px; padding:3px 6px; box-sizing:border-box; color:var(--fg); }
.lrow.sel{ background:var(--fg); color:var(--bg); }
.lname{ font-size:12px; color:currentColor; }
.lsub{ font-size:8px; color:var(--dim); }   /* 次要行(预览/时间) */
.lrow.sel .lsub{ color:var(--bg); }
.lrow.sel .name{ color:var(--bg); }   /* 选中行反色:收件人名也要跟着反,否则亮名压在亮底上看不见 */
/* 多行列表项(草稿:标题行 + 预览行):标签不继承英雄屏下边距,两行各自受控行高,避免压到下一行 */
.lrow .tag{ margin-bottom:0; }
.lrow .cn{ line-height:1.3; }

/* 通用小图标(currentColor,选中自动反色) */
.ic{ width:15px; height:12px; position:relative; flex:0 0 auto; }
.ic.env{ border:1.5px solid currentColor; }
.ic.env::after{ content:""; position:absolute; left:0; top:0; width:0; height:0;
  border-left:7.5px solid transparent; border-right:7.5px solid transparent; border-top:6px solid currentColor; }
.ic.per::before{ content:""; position:absolute; left:50%; top:0; width:5px; height:5px; border-radius:50%; background:currentColor; transform:translateX(-50%); }
.ic.per::after{ content:""; position:absolute; left:50%; bottom:0; width:11px; height:6px; border-radius:5px 5px 0 0; background:currentColor; transform:translateX(-50%); }
.ic.tel{ border:1.5px solid currentColor; border-radius:4px; }
.ic.tel::after{ content:""; position:absolute; left:50%; top:50%; width:3px; height:5px; background:currentColor; transform:translate(-50%,-50%); }
.ic.mus::before{ content:""; position:absolute; left:2px; bottom:1px; width:6px; height:6px; border-radius:50%; background:currentColor; }
.ic.mus::after{ content:""; position:absolute; left:7px; top:0; width:1.5px; height:8px; background:currentColor; }
.ic.box{ border:1.5px solid currentColor; }
.ic.box::after{ content:""; position:absolute; left:50%; top:50%; width:3px; height:3px; background:currentColor; transform:translate(-50%,-50%); }
/* 通话方向箭头 */
.ic.out::after{ content:"↗"; position:absolute; inset:0; font-size:12px; line-height:12px; text-align:center; color:currentColor; }
.ic.inc::after{ content:"↘"; position:absolute; inset:0; font-size:12px; line-height:12px; text-align:center; color:currentColor; }
.ic.miss::after{ content:"↙"; position:absolute; inset:0; font-size:12px; line-height:12px; text-align:center; color:currentColor; }
