/* ===== lang-nokia 可复用屏幕样式 =====
   原生 176×208;.screen 用 zoom:var(--s) 整数倍放大保持像素锐利。
   中文走像素字体(--cnf/--cnpx),数字/拉丁走 nokiafc22。 */

@font-face{ font-family:'nokiafc22';    src:url('fonts/nokiafc22.ttf') format('truetype'); }
@font-face{ font-family:'FusionPixel12'; src:url('fonts/FusionPixel-12-zhhans.otf') format('opentype'); }
@font-face{ font-family:'FusionPixel10'; src:url('fonts/FusionPixel-10-zhhans.otf') format('opentype'); }
@font-face{ font-family:'Cubic11';       src:url('fonts/Cubic11.ttf') format('truetype'); }
@font-face{ font-family:'QuanPixel8';    src:url('fonts/QuanPixel8.ttf') format('truetype'); }
@font-face{ font-family:'ChillBitmap';   src:url('fonts/ChillBitmap.ttf') format('truetype'); }
@font-face{ font-family:'Uranus11';      src:url('fonts/Uranus11.ttf') format('truetype'); }
@font-face{ font-family:'Boutique7x7';   src:url('fonts/Boutique7x7.ttf') format('truetype'); }
@font-face{ font-family:'MplusHzk12';    src:url('fonts/MplusHzk12.ttf') format('truetype'); }
@font-face{ font-family:'TianCheng';     src:url('fonts/TianCheng.otf') format('opentype'); }

.screen{
  width:176px; height:208px; zoom:var(--s,3);
  background:var(--bg); color:var(--fg);
  image-rendering:pixelated; position:relative; overflow:hidden;
  display:flex; flex-direction:column;
}
.cn{ font-family:var(--cnf); font-size:var(--cnpx); }
.latin{ font-family:'nokiafc22'; }

/* 状态栏 */
.statusbar{ height:15px; flex:0 0 auto; display:flex; align-items:center; gap:3px;
  padding:0 3px; border-bottom:1px solid var(--dim); }
.sig{ display:inline-flex; align-items:flex-end; gap:1px; height:8px; }
.sig i{ width:2px; background:var(--fg); }
.sig i:nth-child(1){height:3px} .sig i:nth-child(2){height:5px}
.sig i:nth-child(3){height:7px} .sig i:nth-child(4){height:8px}
.net{ font-size:8px; color:var(--fg); }
.sb-spacer{ flex:1; }
.clock{ font-size:8px; color:var(--fg); }
.batt{ width:13px; height:7px; border:1px solid var(--fg); position:relative;
  padding:1px; display:inline-flex; gap:1px; }
.batt::after{ content:""; position:absolute; right:-3px; top:2px; width:2px; height:3px; background:var(--fg); }
.batt i{ flex:1; background:var(--fg); }

/* 标题栏 */
.titlebar{ flex:0 0 auto; height:17px; display:flex; align-items:center; justify-content:center;
  color:var(--bg); background:var(--fg); }
.titlebar.cn{ font-size:var(--cnpx); }

/* 正文 */
.body{ flex:1; padding:4px 4px 0; overflow:hidden; }
.tag{ display:inline-block; background:var(--tagbg); color:var(--tagfg); padding:1px 3px; margin-bottom:4px; }
.rcpt{ color:var(--fg); margin-bottom:1px; }
.name{ color:var(--hi); }
.date{ font-size:8px; color:var(--dim); margin-bottom:3px; }
.rule{ height:1px; background:var(--dim); margin:0 0 4px; }
.msg{ color:var(--fg); line-height:1.4; }

/* 软键栏 */
.softkeys{ flex:0 0 auto; height:16px; display:flex; align-items:center; justify-content:space-between;
  padding:0 4px; border-top:1px solid var(--dim); color:var(--fg); }

/* ===== 配色主题(5 套老款诺基亚单色,用户可切) ===== */
.pal-glow { --bg:#102a18; --fg:#73e08b; --dim:#2c5e38; --hi:#cdffd8; --tagbg:#73e08b; --tagfg:#102a18; } /* 绿背光:同一橄榄面板被背光点亮(非纯黑底/非霓虹绿) */
.pal-lcd  { --bg:#aeb87a; --fg:#232b18; --dim:#5f6a43; --hi:#11160a; --tagbg:#232b18; --tagfg:#aeb87a; } /* 黄绿反射LCD·日光(墨色非纯黑、低对比) */
.pal-blue { --bg:#04101d; --fg:#54cfff; --dim:#1c4a6b; --hi:#c2efff; --tagbg:#54cfff; --tagfg:#04101d; } /* 蓝荧光·背光 */
.pal-amber{ --bg:#160d02; --fg:#ffb43c; --dim:#7a5212; --hi:#ffd98a; --tagbg:#ffb43c; --tagfg:#160d02; } /* 琥珀荧光 */
.pal-mono { --bg:#050505; --fg:#e6ffe9; --dim:#3a4a3a; --hi:#ffffff; --tagbg:#e6ffe9; --tagfg:#050505; } /* 黑白单色 */
/* legacy(旧 review 页用) */
.pal-green{ --bg:#0a130d; --fg:#8fd06a; --dim:#356b40; --hi:#caf59a; --tagbg:#8fd06a; --tagfg:#0a130d; }
.pal-color{ --bg:#0b0f0a; --fg:#7fc457; --dim:#3a5a33; --hi:#bfeaa0; --tagbg:#ef9b2e; --tagfg:#1a1206; }

/* ===== 字体类(--cnpx = 该字体原生像素号,整数倍才锐) ===== */
.f-fp12    { --cnf:'FusionPixel12'; --cnpx:12px; }
.f-fp10    { --cnf:'FusionPixel10'; --cnpx:10px; }
.f-cubic   { --cnf:'Cubic11';       --cnpx:11px; }
.f-quan    { --cnf:'QuanPixel8';    --cnpx:8px;  }
.f-chill   { --cnf:'ChillBitmap';   --cnpx:12px; }
.f-uranus  { --cnf:'Uranus11';      --cnpx:11px; }
.f-boutique{ --cnf:'Boutique7x7';   --cnpx:14px; }
.f-mplus   { --cnf:'MplusHzk12';    --cnpx:12px; }
.f-tian    { --cnf:'TianCheng';     --cnpx:12px; }

/* ===== 设备边框 + 屏幕开口 =====
   nokia-device.png 为正方形 2953×2953;开口位置用百分比,缩放无关。
   开口几何来自 verano-os(.nokia-texture 矩形)。 */
.device-wrap{ position:relative; }
.device-img{ width:100%; display:block; }
.aperture{ position:absolute;
  left:var(--ap-l,37.149%); top:var(--ap-t,24.822%);
  width:var(--ap-w,24.788%); height:var(--ap-h,28.954%);
  overflow:hidden; display:flex; align-items:center; justify-content:center; }

/* ===== 屏幕质感(纯 CSS,零外部图)=====
   两层物理:① 内部 LCD 纹理(点阵栅格 + 荧光辉光)长在 .screen 伪元素上,随屏 transform 缩放、
   且 innerHTML 重渲不被清;② 玻璃做旧(划痕/灰尘/眩光/暗角)在 .scr-fx 覆盖层(机身玻璃,显示尺度)。
   总强度由 --wear 调(0=全新, 1=默认旧, 1.6=很旧)。 */
.screen{ --wear:1; }

/* ① 内部·点阵栅格:横竖细线交叉成像素格,multiply 压暗(在亮像素上最明显=点阵感) */
.screen::before{
  content:""; position:absolute; inset:0; z-index:6; pointer-events:none;
  background:
    repeating-linear-gradient(0deg,  rgba(0,0,0,.28) 0 1px, transparent 1px 2px),
    repeating-linear-gradient(90deg, rgba(0,0,0,.28) 0 1px, transparent 1px 2px),
    repeating-linear-gradient(90deg, rgba(0,0,0,.08) 0 1px, transparent 1px 3px);
  mix-blend-mode:multiply; opacity:calc(.66 * var(--wear,1));
}
/* ① 内部·亮度:背光从顶部光导注入(同色微提亮,克制),screen 叠加 */
.screen::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(120% 80% at 50% 0%,
    color-mix(in srgb, var(--fg) 9%, transparent) 0%,
    color-mix(in srgb, var(--fg) 3%, transparent) 45%, transparent 75%);
  mix-blend-mode:screen; opacity:.6;
}
/* 日光反射式:无荧光,改顶部中性冷反光(玻璃反射环境光) */
.pal-lcd .screen::after{
  background:linear-gradient(180deg, rgba(255,255,255,.10) 0%, transparent 22%);
  mix-blend-mode:screen; opacity:.5;
}

/* ===== 关机 / 开机动画 ===== */
.poweroff{ position:absolute; inset:0; background:#000; display:flex; align-items:center; justify-content:center; }
.po-hint{ color:var(--dim); font-size:10px; animation:po-pulse 1.8s ease-in-out infinite; }
@keyframes po-pulse{ 0%,100%{ opacity:.22 } 50%{ opacity:.8 } }
/* 开机:纯文字 NOKIA 字标(真·诺基亚字体),字慢慢浮现→慢慢收拢,与开机音(~3.3s)同收 */
.bootw{ position:absolute; inset:0; background:var(--bg); display:flex; align-items:center; justify-content:center;
  animation:boot-warm 1s ease-out both; }
@keyframes boot-warm{ 0%{ filter:brightness(0) } 10%{ filter:brightness(1.8) } 18%{ filter:brightness(.3) } 32%{ filter:brightness(1.3) } 100%{ filter:brightness(1) } }
.bootw .nk{ text-align:center; color:var(--fg); }
.bootw .nk-word{ font-family:'nokiafc22'; font-size:26px; line-height:1; letter-spacing:4px; padding-left:4px;
  animation:nk-in 3.1s cubic-bezier(.45,0,.4,1) .15s both; }
.bootw .nk-tag{ font-family:'nokiafc22'; font-size:9px; letter-spacing:2px; padding-left:2px; margin-top:16px; color:var(--dim);
  animation:nk-fade 1.2s ease-out 2.1s both; }
/* padding-left 与 letter-spacing 等值,抵消尾部字距偏移→任一帧居中 */
@keyframes nk-in{ 0%{ opacity:0; letter-spacing:14px; padding-left:14px } 45%{ opacity:1; letter-spacing:14px; padding-left:14px } 100%{ opacity:1; letter-spacing:4px; padding-left:4px } }
@keyframes nk-fade{ 0%{ opacity:0 } 100%{ opacity:1 } }

/* ===== 九键按下反馈(真实下沉:照片精灵窗口,按下时键帽本体下移变亮)===== */
.keypad{ position:absolute; inset:0; pointer-events:none; z-index:2; }
.keypad .key{ position:absolute; transform:translate(-50%,-50%); width:10%; height:4.3%;
  background-image:url('device/nokia-device.png'); background-repeat:no-repeat; border-radius:18%;
  transition:transform .07s ease-out, filter .07s ease-out; will-change:transform,filter; }
.keypad .key.kp-down{ transform:translate(-50%,-44%) scale(.92); filter:brightness(1.34) contrast(1.05); }

/* ② 玻璃做旧覆盖层(机身开口内,叠在屏上方) */
.scr-fx{ position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.scr-fx > i{ content:""; position:absolute; inset:-12%; display:block; }
/* 眩光:单道柔和斜向玻璃反光(替代原来的"雨点"划痕层) */
.scr-fx .fx-glare{
  inset:0;
  background:linear-gradient(120deg, transparent 0%,
    rgba(255,255,255,.05) 38%, rgba(255,255,255,.10) 50%, rgba(255,255,255,.04) 62%, transparent 100%);
  mix-blend-mode:screen; opacity:calc(.7 * var(--wear,1));
}
/* 灰尘:各向同性 fractalNoise 圆点(非条纹),几乎不可见——克制 */
.scr-fx .fx-dust{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='d'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='1' seed='3'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 22 -16'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23d)'/%3E%3C/svg%3E");
  mix-blend-mode:multiply; opacity:calc(.06 * var(--wear,1));
}
/* 边角暗角:温和压暗(不可像聚光) */
.scr-fx .fx-vignette{
  inset:0; box-shadow:inset 0 0 12px 2px rgba(0,0,0,.30), inset 0 0 3px 1px rgba(0,0,0,.22);
}