/* ============================================================
   中国同学录 5460.net · 复刻样式
   实证依据：Wayback 2000-02-29 / 2002-03-31 存档
   685px 表格布局 · 宋体9pt · 淡灰 #ECECEC 面板 · navy 标题
   （非营利怀旧展示 · 全部模拟数据）
   ============================================================ */

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:#ffffff;
  color:#1a1a1a;
  font-family:"宋体",SimSun,"Microsoft YaHei",serif;
  font-size:12px;          /* 当年 9pt ≈ 12px */
  line-height:1.6;
  -webkit-font-smoothing:none;
}
img{border:0;image-rendering:pixelated}
a{color:#1f3a93;text-decoration:none}
a:hover{color:#cc0000;text-decoration:underline}

/* 685 内容区，居中，保留窄表格年代感但允许收窄 */
.wrap{width:685px;max-width:100%;margin:0 auto;padding:0 4px 64px}

/* ===== 顶部字标区（实证：02logo + 我思念你slogan + 5460.net）===== */
.masthead{border-top:5px solid #d6d5cd;padding-top:8px}
.masthead .row{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.masthead .logo img{height:60px}
.masthead .slogan{flex:1;text-align:center;min-width:200px}
.masthead .slogan img{height:42px;max-width:100%}
.masthead .dom img{height:38px}
.masthead .date{text-align:right;color:#999;font-size:10px;letter-spacing:1px;
  font-family:Verdana,Arial,sans-serif;margin:4px 0 6px}
.masthead .rule{height:2px;background:#000;margin:2px 0 0}

/* 备用：无图时的文字字标 */
.wordmark{font-size:26px;font-weight:bold;color:#cc0000;letter-spacing:3px;line-height:1}
.wordmark small{font-size:12px;color:#416aaf;letter-spacing:1px}

/* ===== 文字导航条 ===== */
.topnav{
  background:#000080;color:#fff;font-size:12px;letter-spacing:1px;
  padding:4px 8px;margin:6px 0 8px;
  display:flex;flex-wrap:wrap;gap:2px 0;align-items:center;
}
.topnav a{color:#ffffff;padding:0 9px;border-right:1px solid #4a4ab0}
.topnav a:last-child{border-right:0}
.topnav a:hover{color:#ffe600;text-decoration:none}
.topnav a.cur{color:#ffe600;font-weight:bold}

/* ===== 两栏布局（左侧栏 + 主区）===== */
.layout{display:flex;gap:8px;align-items:flex-start}
.side{width:175px;flex:none}
.main{flex:1;min-width:0}
@media(max-width:560px){
  .layout{flex-direction:column}
  .side{width:100%}
}

/* ===== 面板（带 navy 标题条的盒子）===== */
.panel{border:1px solid #b9c2d0;background:#fff;margin:0 0 10px}
.panel>.h{
  background:#ECECEC;border-bottom:1px solid #b9c2d0;
  color:#000080;font-weight:bold;font-size:12px;
  padding:3px 8px;display:flex;justify-content:space-between;align-items:center;
}
.panel>.h .more{font-weight:normal;font-size:11px}
.panel>.b{padding:8px 10px}
.panel.gray{background:#ECECEC}
.panel.gray>.b{background:#ECECEC}

/* 蓝标题（无盒子，仅一行小标题）*/
.miniH{color:#000080;font-weight:bold;border-bottom:1px solid #d6d5cd;
  padding:2px 0;margin:0 0 6px}

/* ===== 登录小盒 ===== */
.login p{margin:3px 0}
.login label{color:#333}
.login input[type=text],.login input[type=password]{
  width:100%;border:1px solid #808080;padding:2px 3px;font-size:12px;
  font-family:inherit;background:#fff;
}
.row2{display:flex;gap:6px;align-items:center;margin-top:6px}
.tip{color:#777;font-size:11px;line-height:1.7}

/* win9x 立体按钮 */
.btn{
  display:inline-block;border:1px solid #808080;border-top-color:#fff;border-left-color:#fff;
  background:#d4d0c8;color:#000;padding:2px 12px;font-size:12px;cursor:pointer;
  font-family:inherit;line-height:1.4;
}
.btn:hover{color:#000;text-decoration:none}
.btn:active{border-color:#fff;border-top-color:#808080;border-left-color:#808080}
.btn.red{color:#cc0000;font-weight:bold}

/* 侧栏链接列 */
.navlist{list-style:none;margin:0;padding:0}
.navlist li{border-bottom:1px dotted #cfcfcf}
.navlist li:last-child{border-bottom:0}
.navlist a{display:block;padding:4px 6px 4px 18px;color:#1a1a1a;position:relative}
.navlist a:before{content:"●";color:#9bb;font-size:8px;position:absolute;left:6px;top:6px}
.navlist a:hover{background:#eef3ff;color:#cc0000;text-decoration:none}
.navlist a.cur{background:#000080;color:#fff;font-weight:bold}
.navlist a.cur:before{color:#ffe600}

/* ===== 列表（新闻/留言/寻人）===== */
.list{list-style:none;margin:0;padding:0}
.list li{padding:2px 0;border-bottom:1px dotted #e2e2e2;
  display:flex;gap:6px;align-items:baseline}
.list li:before{content:"·";color:#cc0000;font-weight:bold}
.list li .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.list li .dt{color:#999;font-size:10px;font-family:Verdana,sans-serif;flex:none}

/* ===== 班级头部信息卡 ===== */
.classhead{border:1px solid #b9c2d0;background:linear-gradient(180deg,#f3f6ff,#fff);
  padding:10px 12px;margin:0 0 10px}
.classhead h1{margin:0;font-size:20px;color:#cc0000;letter-spacing:1px}
.classhead .meta{margin-top:6px;color:#444;font-size:12px;line-height:1.9}
.classhead .meta b{color:#000080}
.classhead .declare{margin-top:8px;padding:8px 10px;background:#fffdf2;
  border:1px dashed #d8c98a;color:#5a4a18;line-height:1.9}
.classhead .declare .qt{color:#cc7a00;font-weight:bold}

/* 统计条 */
.statbar{background:#ECECEC;border:1px solid #d6d5cd;padding:4px 8px;
  font-size:11px;color:#444;text-align:center;margin:0 0 10px}
.statbar b{color:#cc0000;font-family:Verdana,sans-serif}

/* ===== 成员网格 ===== */
.members{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 8px}
@media(max-width:560px){.members{grid-template-columns:1fr}}
.mem{display:flex;align-items:center;gap:7px;padding:4px 6px;border:1px solid #eee;background:#fff}
.mem:hover{background:#f6f9ff;border-color:#cdd8ef}
.mem .av{width:34px;height:34px;flex:none;border:1px solid #cfcfcf;background:#f0f0f0;
  display:flex;align-items:center;justify-content:center;font-size:18px;color:#9aa;overflow:hidden}
.mem .info{flex:1;min-width:0;line-height:1.5}
.mem .nick{font-weight:bold;color:#1f3a93}
.mem .real{color:#888;font-size:11px}
.mem .dot{width:7px;height:7px;border-radius:50%;flex:none;margin-left:auto}
.mem .dot.on{background:#33aa33;box-shadow:0 0 4px #6c6}
.mem .dot.off{background:#bbb}
.mem .role{font-size:10px;color:#fff;background:#cc0000;padding:0 4px;border-radius:2px;margin-left:4px}
.mem .role.t{background:#000080}

/* ===== 留言板 ===== */
.msg{border-bottom:1px dashed #ddd;padding:7px 0}
.msg .head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.msg .who{font-weight:bold;color:#1f3a93}
.msg .when{color:#999;font-size:10px;font-family:Verdana,sans-serif}
.msg .body{margin-top:3px;color:#222;line-height:1.8;word-break:break-word}
.msg .body .face{color:#cc7a00}
.post{margin-top:10px;background:#f7f7f7;border:1px solid #ddd;padding:8px}
.post textarea{width:100%;height:54px;border:1px solid #808080;font-family:inherit;
  font-size:12px;padding:4px;resize:vertical}
.post .row2{justify-content:flex-end}

/* ===== 相册 ===== */
.album{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:560px){.album{grid-template-columns:repeat(2,1fr)}}
.photo{border:1px solid #c9c9c9;background:#fff;padding:5px;text-align:center}
.photo .ph{height:120px;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:13px;letter-spacing:1px;border:1px solid #0002}
.photo .cap{font-size:11px;color:#555;margin-top:5px;line-height:1.5}
.photo .cap b{color:#1a1a1a}

/* ===== 贺卡 ===== */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:560px){.cards{grid-template-columns:repeat(2,1fr)}}
.gcard{border:1px solid #c9c9c9;background:#fff;cursor:pointer}
.gcard:hover{border-color:#cc0000;box-shadow:0 2px 6px #0002}
.gcard .pic{height:96px;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:22px;letter-spacing:2px;text-shadow:1px 1px 0 #0004}
.gcard .nm{padding:4px 6px;font-size:11px;color:#333;text-align:center;border-top:1px solid #eee}

/* ===== 通讯录表格 ===== */
.txl{width:100%;border-collapse:collapse;font-size:12px}
.txl th,.txl td{border:1px solid #d6d5cd;padding:3px 6px;text-align:left}
.txl th{background:#000080;color:#fff;font-weight:bold;white-space:nowrap}
.txl tr:nth-child(even) td{background:#f5f7fc}
.txl .lock{color:#aaa}
.txl .on{color:#33aa33;font-weight:bold}

/* ===== 个人空间 ===== */
.profile{display:flex;gap:12px;flex-wrap:wrap}
.profile .pcard{width:160px;flex:none;border:1px solid #b9c2d0;background:#fff;text-align:center;padding:10px}
.profile .pcard .big{width:90px;height:90px;margin:0 auto;border:1px solid #cfcfcf;
  background:#f0f0f0;display:flex;align-items:center;justify-content:center;font-size:42px;color:#9aa}
.profile .pcard .nk{font-weight:bold;color:#cc0000;font-size:14px;margin-top:6px}
.profile .pinfo{flex:1;min-width:220px}
.kv{width:100%;border-collapse:collapse}
.kv td{padding:3px 6px;border-bottom:1px dotted #e2e2e2;vertical-align:top}
.kv td.k{color:#000080;width:72px;white-space:nowrap}

/* ===== 公告/友情链接/页脚 ===== */
.flink{font-size:11px;color:#555;line-height:2}
.flink a{margin-right:10px;white-space:nowrap}

.foot{margin:14px 0 0;border-top:2px solid #000;padding-top:8px;
  font-size:11px;color:#778488;text-align:center;line-height:1.9}
.foot a{color:#1f3a93}

/* ===== 底部年代状态条（仿当年）===== */
.botbar{
  position:fixed;left:0;right:0;bottom:0;z-index:90;
  background:#ECECEC;border-top:1px solid #fff;box-shadow:0 -1px 0 #b9b9b9;
  font-size:11px;color:#444;
  display:flex;align-items:center;gap:0 14px;flex-wrap:wrap;
  padding:4px 12px;
}
.botbar .b{color:#cc0000;font-family:Verdana,sans-serif}
.botbar .sp{margin-left:auto}

/* 返回博物馆 */
.back-museum{
  position:fixed;right:8px;bottom:30px;z-index:95;
  font-size:12px;background:#fffbe0;border:1px solid #c9b400;
  padding:3px 9px;color:#cc0000;box-shadow:1px 1px 3px #0003;
}
.back-museum:hover{background:#fff6c0;text-decoration:none}

/* ===== 认证问题弹窗 ===== */
.modal-mask{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:200;
  display:none;align-items:center;justify-content:center;padding:14px}
.modal-mask.show{display:flex}
.modal{width:360px;max-width:100%;background:#fff;border:2px solid #000080;
  box-shadow:0 6px 24px #0006;font-size:12px}
.modal .bar{background:#000080;color:#fff;font-weight:bold;padding:5px 10px;
  display:flex;justify-content:space-between;align-items:center}
.modal .bar .x{cursor:pointer;color:#fff;font-family:Verdana;padding:0 4px}
.modal .bd{padding:14px}
.modal .q{background:#fffdf2;border:1px dashed #d8c98a;color:#5a4a18;
  padding:8px 10px;margin:0 0 10px;line-height:1.8}
.modal .q b{color:#cc7a00}
.modal input[type=text]{width:100%;border:1px solid #808080;padding:4px;font-size:13px;
  font-family:inherit;margin-bottom:6px}
.modal .res{min-height:20px;margin:6px 0 0;line-height:1.7}
.modal .res.ok{color:#1a7f1a}
.modal .res.no{color:#cc0000}
.modal .hint{color:#999;font-size:11px;margin-top:8px;line-height:1.7}