/* 未来之星 TFS · 老师中心 样式
   主题变量与首页 home/index.html 相同(localStorage tfs_theme)。
   大屏:16:9 舞台,1rem = 舞台宽度的 1%(由 index.html 的 fit() 设定);手机竖屏:html.m,整页竖向滚动。
   兼容 Chromium 66:不用 aspect-ratio / flex gap / inset / CSS min() max() clamp() / :focus-visible。 */
:root{
 --paper:#F2E7D0;--paper-2:#EAD9B8;--ink:#241813;--ink-soft:#5B4636;
 --cobalt:#143C5B;--cobalt-2:#1E6E8C;--turq:#2BA199;--terra:#C25A34;--vermilion:#C8341F;
 --gold:#E0A93E;--gold-soft:#F0CE84;--jade:#5C8A3A;--error:#B23A2E;
 --line:rgba(36,24,19,.14);--card:#fff;--card-soft:linear-gradient(180deg,#fffaf0,#f3e3c4);
 --serif:"Noto Serif SC","Songti SC",serif;--sans:"Noto Sans SC","Spline Sans","PingFang SC","Microsoft YaHei",sans-serif;
 --display:"Fraunces",Georgia,serif;--latin:"Spline Sans","Segoe UI",Arial,sans-serif;
 --shadow:0 .25rem 1.1rem rgba(20,12,8,.12);
}
html[data-theme="celadon"]{--paper:#E9EFEC;--paper-2:#D6E2DB;--ink:#16302E;--ink-soft:#46605B;--cobalt:#154C5C;--cobalt-2:#2C8193;--turq:#37AE9C;--terra:#C98A3C;--vermilion:#C24A2E;--gold:#C9A04A;--gold-soft:#E7D6A0;--jade:#4E8F6E;--line:rgba(22,48,46,.14);--card:#F7FBF9;--card-soft:linear-gradient(180deg,#fbfdfb,#e4eee9)}
html[data-theme="vermilion"]{--paper:#FBF0E2;--paper-2:#F3E1C9;--ink:#2C1410;--ink-soft:#603429;--cobalt:#9E2B23;--cobalt-2:#C0392B;--turq:#C58A36;--terra:#D7642C;--vermilion:#C8341F;--gold:#E2AC3F;--gold-soft:#F3D79A;--jade:#7C8A33;--line:rgba(44,20,16,.14);--card:#FFF8EE;--card-soft:linear-gradient(180deg,#fff7e8,#f6e3c8)}
html[data-theme="bamboo"]{--paper:#EEF2E2;--paper-2:#DEE6C9;--ink:#212A14;--ink-soft:#4C5A33;--cobalt:#3C6B3A;--cobalt-2:#5A8C3A;--turq:#3FA07A;--terra:#C2762F;--vermilion:#C24A2E;--gold:#D9A53E;--gold-soft:#EFD79A;--jade:#4E8B3A;--line:rgba(33,42,20,.14);--card:#FBFCF2;--card-soft:linear-gradient(180deg,#fcfdf3,#eaf0d6)}
html[data-theme="plum"]{--paper:#EFE9F0;--paper-2:#E0D5E4;--ink:#241326;--ink-soft:#54405A;--cobalt:#5B2D6E;--cobalt-2:#7E4B96;--turq:#3FA0A0;--terra:#C26A3A;--vermilion:#C03A6A;--gold:#D9A53E;--gold-soft:#EFD3A0;--jade:#6E8B3A;--line:rgba(36,19,38,.14);--card:#FBF7FC;--card-soft:linear-gradient(180deg,#fdfaff,#ece0f0)}
html[data-theme="candy"]{--paper:#FFF1F6;--paper-2:#FBDCE8;--ink:#3A1E2C;--ink-soft:#8A536A;--cobalt:#E0518B;--cobalt-2:#5BB8E8;--turq:#3CC9C0;--terra:#FF8A3D;--vermilion:#F0556B;--gold:#FFC02E;--gold-soft:#FFE39A;--jade:#5CC46A;--line:rgba(58,30,44,.14);--card:#fff;--card-soft:linear-gradient(180deg,#fff7fb,#ffe2ee)}
html[data-theme="ocean"]{--paper:#EAF6FB;--paper-2:#CFE9F4;--ink:#0E2A38;--ink-soft:#3D6577;--cobalt:#1597C9;--cobalt-2:#19B8C4;--turq:#2DD0C0;--terra:#FF8A4C;--vermilion:#FF6B5B;--gold:#FFC22E;--gold-soft:#FFE6A6;--jade:#3FB36E;--line:rgba(14,42,56,.14);--card:#fff;--card-soft:linear-gradient(180deg,#f4fbfe,#d8eef8)}
html[data-theme="jungle"]{--paper:#F1F8E3;--paper-2:#DCEEBE;--ink:#1F3310;--ink-soft:#4E6B2E;--cobalt:#4CAF3E;--cobalt-2:#7BC043;--turq:#34BFA0;--terra:#FF8F3C;--vermilion:#F2603A;--gold:#FFC22E;--gold-soft:#FBE59A;--jade:#46A23A;--line:rgba(31,51,16,.14);--card:#fff;--card-soft:linear-gradient(180deg,#f8fcec,#e6f3cf)}

*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{font-family:var(--sans);color:var(--ink);background:radial-gradient(120% 120% at 50% -10%,#2a2018,#15100c 60%,#0b0805);overflow:hidden;-webkit-tap-highlight-color:transparent}
button{font-family:inherit;color:inherit;border:0;background:none;cursor:pointer}
a{color:inherit}
b{font-weight:800}
[data-f]{outline:none}
body.kbd .f{outline:.26rem solid var(--gold);outline-offset:.18rem;box-shadow:0 0 0 .6rem rgba(224,169,62,.22)}

/* ---------- 舞台 ---------- */
#tv{position:absolute;background:var(--paper);border-radius:.9rem;overflow:hidden;display:flex;flex-direction:column;
 box-shadow:0 2rem 4.5rem rgba(0,0,0,.6),0 0 0 .4rem #0e0a07,0 0 0 .6rem #3a2c1d}
header.bar{flex:0 0 6.2rem;display:flex;align-items:center;padding:0 2rem;background:linear-gradient(180deg,var(--cobalt),#102f47);color:var(--paper);box-shadow:0 .2rem .8rem rgba(0,0,0,.25);position:relative;z-index:3}
.brand{display:flex;align-items:center;text-decoration:none;color:inherit;border-radius:.8rem;padding:.2rem .4rem;margin-left:-.4rem}
.brand img{height:4.4rem;width:4.4rem;border-radius:.9rem;background:#fff;padding:.25rem;object-fit:contain;margin-right:1rem}
.brand .z{font-family:var(--serif);font-weight:900;font-size:2.1rem;color:var(--gold-soft);line-height:1.15}
.brand .u{font-size:1rem;color:#cfe0e8;margin-top:.15rem}
.spacer{flex:1}
.tools{display:flex;align-items:center}
.hbtn{display:inline-block;margin-left:.7rem;padding:.65rem 1.2rem;border-radius:99rem;background:rgba(255,255,255,.12);color:#fff;font-weight:700;font-size:1.05rem;text-decoration:none;white-space:nowrap}
.hbtn:hover,.lang button:hover{background:var(--gold);color:#3a2300}
.lang{display:flex;margin-left:.9rem;padding:.3rem;border-radius:99rem;background:rgba(255,255,255,.12)}
.lang button{padding:.5rem 1rem;border-radius:99rem;font-weight:800;font-size:1.05rem;color:#cdd9df}
.lang button.on{background:var(--gold);color:#3a2300}

.body{flex:1;min-height:0;display:flex;position:relative;z-index:1}
#nav{flex:0 0 19rem;background:var(--paper-2);border-right:.12rem solid var(--line);overflow-y:auto;padding:1.3rem .9rem 1rem;display:flex;flex-direction:column}
.ni{display:flex;align-items:center;width:100%;text-align:left;padding:.62rem .8rem;border-radius:.8rem;margin-bottom:.3rem;font-size:1.13rem;font-weight:700;color:var(--ink);line-height:1.25}
.ni:hover{background:rgba(255,255,255,.55)}
.ni .ic{flex:none;width:2.2rem;font-size:1.35rem;text-align:center;margin-right:.55rem}
.ni .no{flex:none;margin-left:auto;padding-left:.5rem;font:600 .95rem var(--display);color:var(--ink-soft);opacity:.7}
.ni.on{background:var(--cobalt);color:#fff}
.ni.on .no{color:var(--gold-soft);opacity:1}
.navhint{margin-top:auto;padding:1rem .6rem 0;font-size:.85rem;line-height:1.5;color:var(--ink-soft)}
#main{flex:1;min-width:0;overflow-y:auto;padding:1.8rem 2.6rem 6rem;scrollbar-width:thin;scrollbar-color:rgba(36,24,19,.3) transparent}
#main::-webkit-scrollbar{width:.6rem}
#main::-webkit-scrollbar-thumb{background:rgba(36,24,19,.28);border-radius:99rem}

/* ---------- 节 ---------- */
.sec{padding-bottom:2.6rem;margin-bottom:2rem;border-bottom:.12rem dashed var(--line)}
.sec:last-child{border-bottom:0}
.sh{display:flex;align-items:center;margin-bottom:1rem}
.sh .sic{flex:none;width:4rem;height:4rem;border-radius:1.1rem;background:linear-gradient(150deg,var(--cobalt),var(--cobalt-2));display:flex;align-items:center;justify-content:center;font-size:2.1rem;margin-right:1rem;box-shadow:var(--shadow)}
.sh h2{font-family:var(--serif);font-weight:900;font-size:2.3rem;color:var(--cobalt);line-height:1.15}
.sh .zh{display:block;font-family:var(--sans);font-size:1rem;font-weight:700;color:var(--ink-soft);margin-top:.15rem}
.sh .no{margin-left:auto;font:600 3.4rem/1 var(--display);color:var(--cobalt);opacity:.12}
.blk{margin-bottom:1.2rem}
.lead{font-size:1.28rem;line-height:1.6;color:var(--ink-soft);max-width:64rem}
p,li,td{line-height:1.6}
kbd{display:inline-block;min-width:1.7em;padding:0 .45em;margin:0 .08em;border-radius:.35em;background:#fff;color:var(--ink);border:.09rem solid rgba(36,24,19,.28);border-bottom-width:.22rem;font:700 .9em/1.45 var(--latin);text-align:center;vertical-align:.06em;white-space:nowrap}

.grid2{display:grid;grid-template-columns:1fr 1fr;grid-gap:1.1rem}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:.9rem}
.grid4{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-gap:1rem}
.card{background:var(--card);border:.12rem solid var(--line);border-radius:1.1rem;padding:1.15rem 1.35rem;box-shadow:var(--shadow);font-size:1.08rem}
.card h4{display:flex;align-items:center;font-size:1.25rem;font-weight:800;color:var(--ink);margin-bottom:.45rem;line-height:1.3}
.card h4 .ic{flex:none;min-width:2.3rem;height:2.3rem;padding:0 .3rem;border-radius:.7rem;background:var(--paper);display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-right:.7rem;color:var(--cobalt);font-family:var(--serif);font-weight:900}
.card p{color:var(--ink-soft)}
.card p b{color:var(--ink)}

.steps .step{position:relative;padding-left:5rem}
.steps .step:last-child:nth-child(odd){grid-column:1 / -1}
.step .n{position:absolute;left:1.2rem;top:1.15rem;width:2.8rem;height:2.8rem;border-radius:50%;background:var(--cobalt);color:var(--gold-soft);font:600 1.5rem/2.8rem var(--display);text-align:center}

.tip{background:var(--card-soft);border-left:.5rem solid var(--gold)}
.warn{background:#fff7f0;border-left:.5rem solid var(--terra)}
.warn ul,.faq ul{padding-left:1.3rem}
.warn li,.faq li{margin:.3rem 0;color:var(--ink-soft)}
.warn li b,.faq li b{color:var(--ink)}

.path{display:flex;flex-wrap:wrap;align-items:center}
.path span{display:inline-block;padding:.4rem 1rem;border-radius:99rem;background:var(--card);border:.12rem solid var(--line);font-weight:700;font-size:1.05rem;margin:.2rem 0}
.path i{font-style:normal;margin:0 .55rem;color:var(--terra);font-weight:900}

.keysw{display:flex;align-items:flex-start}
.keysw svg{flex:none;width:9.5rem;margin-right:1.6rem}
.keysw table{flex:1}
table.kt{width:100%;border-collapse:collapse}
.kt td{padding:.5rem .8rem;border-top:.1rem solid var(--line);vertical-align:top;color:var(--ink-soft)}
.kt tr:first-child td{border-top:0}
.kt td.k{width:24%;white-space:nowrap;font-weight:800;color:var(--ink)}
.kt td.k kbd{font-size:1.05em}
.card h3{font-family:var(--serif);font-weight:900;font-size:1.35rem;color:var(--cobalt);margin-bottom:.5rem}

.dock{background:#1d1813;border-radius:1.1rem;padding:1rem 1.2rem .8rem;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;box-shadow:var(--shadow)}
.dk{text-align:center;margin:.3rem .3rem}
.dk b{display:inline-block;padding:.45rem .85rem;border-radius:.7rem;background:rgba(255,255,255,.1);color:#F0CE84;font-size:1.05rem;white-space:nowrap}
.dk small{display:block;margin-top:.4rem;font-size:.85rem;color:#cfc2a6;line-height:1.3;max-width:9rem}

.qz .row{display:flex;padding:.55rem 0;border-top:.1rem solid var(--line)}
.qz .row:first-of-type{border-top:0}
.qz .row b{flex:0 0 9rem;color:var(--cobalt)}
.qz .row span{flex:1;color:var(--ink-soft);line-height:1.6}

.flow h3{font-family:var(--serif);font-weight:900;font-size:1.35rem;color:var(--cobalt);margin-bottom:.7rem}
.fbar{display:flex;height:2.6rem;border-radius:.8rem;overflow:hidden;margin-bottom:.9rem}
.fbar i{display:flex;align-items:center;justify-content:center;font-style:normal;color:#fff;font-weight:800;font-size:.95rem;white-space:nowrap;overflow:hidden;border-right:.15rem solid var(--card)}
.fbar i:last-child{border-right:0}
.fl{display:flex;align-items:flex-start;padding:.45rem 0}
.fl .m{flex:none;width:3.6rem;height:2.2rem;border-radius:.6rem;color:#fff;font:700 1rem/2.2rem var(--latin);text-align:center;margin-right:.9rem}
.fl .t{flex:1;color:var(--ink-soft)}
.fl .t b{color:var(--ink);margin-right:.4rem}
.fl .tool{flex:none;margin-left:.8rem;padding:.15rem .7rem;border-radius:99rem;background:var(--paper);color:var(--cobalt);font-size:.9rem;font-weight:700;white-space:nowrap}
.c0{background:var(--cobalt)}.c1{background:var(--cobalt-2)}.c2{background:var(--turq)}.c3{background:var(--jade)}.c4{background:var(--gold)}.c5{background:var(--terra)}.c6{background:var(--vermilion)}

.lib .card{padding:.85rem 1rem;font-size:1rem}
.lib h4{font-size:1.1rem;margin-bottom:.25rem}
.lib h4 .ic{font-size:1.2rem;min-width:2rem;height:2rem}

.faq h4{color:var(--cobalt)}
.contact{border-left:.5rem solid var(--cobalt)}
.contact .who{font-size:1.25rem;font-weight:800;color:var(--ink);margin-bottom:.4rem}

.links{display:flex;flex-wrap:wrap}
.go{display:inline-block;margin:0 .8rem .6rem 0;padding:.7rem 1.4rem;border-radius:99rem;background:var(--cobalt);color:#fff;font-weight:800;font-size:1.08rem;text-decoration:none;box-shadow:var(--shadow)}
.go:hover{background:var(--gold);color:#3a2300}
.go.alt{background:var(--card);color:var(--cobalt);border:.14rem solid var(--cobalt)}

.vids{display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:1rem}
.vid{display:block;text-decoration:none;background:var(--card);border:.12rem solid var(--line);border-radius:1rem;overflow:hidden;box-shadow:var(--shadow);color:var(--ink)}
.vbox{position:relative;height:0;padding-top:56.25%;background:linear-gradient(140deg,#1d2a35,#143C5B 60%,#1E6E8C)}
.vbox > *{position:absolute;left:0;top:0;width:100%;height:100%}
.vbox video{background:#000}
.vbox .ph{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#cfe0e8}
.vbox .pl{width:3.6rem;height:3.6rem;border-radius:50%;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#fff;margin-bottom:.5rem}
.vbox .ph small{font-size:.9rem}
.vbox .du{left:auto;top:auto;right:.6rem;bottom:.5rem;width:auto;height:auto;padding:.1rem .5rem;border-radius:.4rem;background:rgba(0,0,0,.55);color:#fff;font:700 .85rem var(--latin)}
.vid .vt{padding:.7rem .9rem;font-weight:800;font-size:1.05rem;line-height:1.35}
.vid .vt small{display:block;margin-top:.2rem;font-weight:700;font-size:.9rem;color:var(--cobalt-2)}

/* ---------- 概览 ---------- */
.hero{display:flex;align-items:center;background:linear-gradient(135deg,var(--cobalt),#0f2e45 70%);color:#fff;border:0;padding:2rem 2.4rem;margin-bottom:1.4rem}
.hero .hz{flex:1}
.hero h1{font-family:var(--serif);font-weight:900;font-size:3.1rem;color:var(--gold-soft);line-height:1.15}
.hero p{font-size:1.35rem;color:#d7e6ee;margin-top:.5rem}
.hero .go{margin:1.2rem 0 0;background:var(--gold);color:#3a2300;font-size:1.2rem;padding:.8rem 1.7rem}
.hero .go:hover{background:#fff}
.hero .seal{flex:none;width:9rem;height:9rem;border-radius:2rem;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:5rem;margin-left:2rem}
.tile{display:block;text-align:left;background:var(--card);border:.12rem solid var(--line);border-radius:1.1rem;padding:1.1rem 1.2rem;box-shadow:var(--shadow);position:relative;overflow:hidden}
.tile:hover{border-color:var(--gold)}
.tile .ic{font-size:2.3rem;line-height:1}
.tile b{display:block;margin-top:.6rem;font-family:var(--serif);font-weight:900;font-size:1.4rem;color:var(--ink)}
.tile small{display:block;margin-top:.3rem;font-size:.98rem;line-height:1.45;color:var(--ink-soft)}
.tile .no{position:absolute;right:.9rem;top:.5rem;font:600 2.6rem/1 var(--display);color:var(--cobalt);opacity:.13}
.printfoot{display:none}

/* ---------- 手机竖屏 ---------- */
html.m,html.m body{height:auto}
html.m body{overflow:auto;background:var(--paper)}
html.m #tv{position:static;width:auto;height:auto;border-radius:0;box-shadow:none;overflow:visible;display:block}
html.m header.bar{flex-wrap:wrap;padding:.7rem 1rem}
html.m .brand img{height:2.8rem;width:2.8rem;margin-right:.6rem}
html.m .brand .z{font-size:1.35rem}
html.m .brand .u{font-size:.8rem}
html.m .spacer{display:none}
html.m .tools{display:flex;align-items:center;width:100%;margin-top:.5rem}
html.m .hbtn{margin:0 .4rem 0 0;padding:.4rem .8rem;font-size:.85rem}
html.m #hHome{display:none}   /* 手机上左上角徽标就能回首页,省出位置给语言切换 */
html.m .lang{margin-left:auto}
html.m .lang button{padding:.35rem .65rem;font-size:.85rem}
html.m .body{display:block}
html.m #nav{position:-webkit-sticky;position:sticky;top:0;z-index:5;flex-direction:row;overflow-x:auto;overflow-y:hidden;padding:.5rem .6rem;border-right:0;border-bottom:.12rem solid var(--line);white-space:nowrap;-webkit-overflow-scrolling:touch}
html.m .ni{width:auto;flex:none;margin:0 .35rem 0 0;padding:.45rem .75rem;font-size:.95rem}
html.m .ni .ic{width:auto;margin-right:.35rem;font-size:1.05rem}
html.m .ni .no,html.m .navhint{display:none}
html.m #main{overflow:visible;padding:1.1rem 1rem 3rem}
html.m .grid2,html.m .grid3,html.m .vids{grid-template-columns:1fr}
html.m .grid4{grid-template-columns:1fr 1fr;grid-gap:.6rem}
html.m .sh .sic{width:3rem;height:3rem;font-size:1.6rem;margin-right:.7rem}
html.m .sh h2{font-size:1.55rem}
html.m .sh .no{font-size:2.4rem}
html.m .lead{font-size:1.05rem}
html.m .card{font-size:1rem;padding:.95rem 1rem}
html.m .card h4{font-size:1.08rem}
html.m .steps .step{padding-left:3.9rem}
html.m .step .n{left:.9rem;top:.95rem;width:2.3rem;height:2.3rem;font-size:1.2rem;line-height:2.3rem}
html.m .keysw{display:block}
html.m .keysw svg{display:block;width:7rem;margin:0 auto 1rem}
html.m .kt td.k{width:30%;white-space:normal}
html.m .qz .row{display:block}
html.m .qz .row b{display:block}
html.m .fbar i{font-size:.75rem}
html.m .fl{flex-wrap:wrap}
html.m .fl .tool{margin:.3rem 0 0 4.5rem}
html.m .hero{display:block;padding:1.3rem 1.2rem}
html.m .hero h1{font-size:2rem}
html.m .hero p{font-size:1.05rem}
html.m .hero .seal{display:none}
html.m .tile{padding:.8rem .9rem}
html.m .tile .ic{font-size:1.7rem}
html.m .tile b{font-size:1.1rem}
html.m .tile small{font-size:.85rem}
html.m .dk small{max-width:6rem}

/* ---------- 打印(A4,当前语言) ---------- */
@media print{
 @page{size:A4;margin:13mm 12mm 14mm}
 html{font-size:8.6pt!important}
 html,body{height:auto!important;background:#fff!important;overflow:visible!important}
 #tv{position:static!important;width:auto!important;height:auto!important;display:block!important;box-shadow:none!important;border-radius:0!important;overflow:visible!important;background:#fff!important}
 header.bar{background:none!important;color:var(--ink)!important;box-shadow:none!important;border-bottom:.2rem solid var(--cobalt);padding:0 0 .6rem!important}
 .brand .z{color:var(--cobalt)!important}.brand .u{color:var(--ink-soft)!important}
 .tools,.hbtn,.lang,#nav,.links,.hero .go,.vids,.tiles{display:none!important}
 .body{display:block!important}
 #main{overflow:visible!important;padding:0!important}
 .sec{page-break-before:always;border:0;padding:0;margin:0}
 .sec:first-child{page-break-before:avoid}
 .card,.dock,.fl,.kt tr,.hero,.step{page-break-inside:avoid;break-inside:avoid}
 .card,.tile{box-shadow:none!important}
 .hero,.dock,.step .n,.sh .sic,.fbar i,.fl .m,kbd,.ni.on{-webkit-print-color-adjust:exact;print-color-adjust:exact}
 .printfoot{display:block;margin-top:2rem;font-size:.9rem;color:var(--ink-soft)}
 .vlist{display:block!important}
}
.vlist{display:none}
.vlist li{margin:.2rem 0}