/* ============================================================================
   CLIB FDE · 全站苹果语言原型 · 共用设计系统
   令牌全部来自 clib-ui 规范；本文件只做「组件 + 八个苹果元素」的落地
   八个元素：1 双链接瓷砖 2 Bento 3 粘性舞台 4 Liquid Glass
             5 选配色即改预览 6 分段控件 7 大字遮罩入场 8 规格对比表
   ========================================================================== */

:root{
  --deep:#2B3F9E; --brand:#4F6BED; --brand-3:#7B93FF; --brand-1:#C9D3FF; --brand-0:#EEF1FD;
  --label:#1D1D1F; --label-2:#6E6E73; --label-3:#86868B;
  --line:#E5E5EA; --hair:#ECECF0; --page:#F5F5F7; --card:#FFF;
  --ok:#34C759; --warn:#FF9F0A; --err:#FF3B30; --err-ink:#B42318; --gold:#D9A94E;
  --success:var(--ok); --danger:var(--err);
  --s4:4px; --s8:8px; --s12:12px; --s16:16px; --s24:24px; --s32:32px; --s48:48px; --s64:64px; --s80:80px; --content:1080px; --wide:1200px;
  --r-lg:24px; --r-md:18px; --r-sm:14px;
  --nav-h:48px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0;background:var(--card);color:var(--label);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","HarmonyOS Sans SC",system-ui,sans-serif;
  font-synthesis:none;font-variant-numeric:tabular-nums;overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
button{font:inherit;line-height:1.2;text-wrap:pretty}
button:not(:disabled):active{transform:scale(.98)}
:where(a[href],button,[role="button"],summary){
  transition-property:color,background-color,border-color,opacity,transform,box-shadow;
  transition-duration:.15s;
  transition-timing-function:ease;
}
:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--brand);outline-offset:2px}
h1,h2,h3,h4,p,ol,ul{margin:0}
ul,ol{list-style:none;padding:0}
img{max-width:100%;height:auto;display:block}

/* 文字阶梯（clib-ui 二）--------------------------------------------- */
.h1{font-size:56px;font-weight:600;line-height:1.07;letter-spacing:-.015em;text-wrap:balance}
.h1s{font-size:40px;font-weight:600;line-height:1.12;letter-spacing:-.006em;text-wrap:balance}
.h2{font-size:40px;font-weight:600;line-height:1.12;letter-spacing:-.006em;text-wrap:balance}
.h3{font-size:17px;font-weight:600;line-height:1.18;letter-spacing:-.006em;text-wrap:balance}
.h4{font-size:17px;font-weight:600;line-height:1.3;letter-spacing:-.022em}
.sub{font-size:15px;font-weight:400;line-height:1.19;letter-spacing:.011em;text-wrap:balance}
.body{font-size:17px;font-weight:400;line-height:1.47;letter-spacing:-.022em}
.small{font-size:15px;font-weight:400;line-height:1.4}
.foot{font-size:13px;font-weight:400;line-height:1.38}
.navtext{font-size:12px;font-weight:400;line-height:1}
.eyebrow{font-size:13px;font-weight:400;line-height:1.38;color:var(--label-2)}
.eyebrow.brand{color:var(--brand);font-weight:500}
.muted{color:var(--label-2)}
.num{font-variant-numeric:tabular-nums}
b,strong{font-weight:600}

/* 版心 ------------------------------------------------------------- */
.wrap{max-width:var(--content);margin:0 auto;padding:0 var(--s24, 24px)}
.wrap-wide{max-width:var(--wide)}
.band{padding:var(--s64) 0}
.band-s{padding:var(--s64) 0}
.band-page{background:var(--page)}
.band-deep{background:linear-gradient(160deg,var(--deep) 0%,var(--brand) 100%);color:#fff}
.band-deep .muted,.band-deep .eyebrow{color:rgba(255,255,255,.72)}
.center{text-align:center}
.stack>*+*{margin-top:var(--s16)}
.stack-l>*+*{margin-top:var(--s24)}
.col{display:flex;flex-direction:column}
.row{display:flex;align-items:center;gap:var(--s16)}

/* 导航（元素 4：只有功能层用玻璃）----------------------------------- */
.nav{
  position:sticky;top:0;z-index:60;height:var(--nav-h);
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--hair);
}
.band-deep+.nav,.nav.on-deep{background:rgba(20,28,70,.6);border-bottom-color:rgba(255,255,255,.12);color:#fff}
.nav-in{
  position:relative;display:grid;align-items:center;gap:var(--s24);height:100%;
  grid-template-columns:auto minmax(0,1fr) minmax(220px,320px) 84px;
  grid-template-areas:"brand primary search account";
}
.brand{display:flex;align-items:center;gap:var(--s8);font-size:17px;font-weight:600;letter-spacing:-.022em;white-space:nowrap}
.brand em{font-style:normal;font-weight:400;color:var(--label-2);font-size:12px}
.brand-lockup{grid-area:brand;flex:none;gap:var(--s8)}
.brand-lockup img{width:32px;max-width:none;height:32px;border-radius:999px;object-fit:contain}
.brand-wordmark{display:flex;align-items:baseline;gap:var(--s4);font-size:17px;font-weight:600;line-height:1;letter-spacing:-.022em;white-space:nowrap}
.brand-wordmark b{color:var(--label);font-weight:600}
.brand-wordmark span{color:var(--brand);font-weight:600}
.brand-wordmark em{color:var(--label-2);font-size:12px;font-style:normal;font-weight:400}
.nav-items{grid-area:primary;display:flex;justify-content:center;min-width:0;gap:var(--s24);margin-left:0}
.nav-items a{display:inline-flex;align-items:center;min-height:44px;color:inherit;font-weight:500;opacity:.86}
.nav-items a:hover{opacity:1;color:var(--brand)}
.nav-items a[aria-current="page"]{opacity:1;font-weight:500;color:var(--brand)}
.nav-cta{color:var(--brand);white-space:nowrap}
.nav-account-slot{
  grid-area:account;display:flex;flex:none;align-items:center;justify-content:center;
  width:84px;min-width:84px;height:44px;contain:layout;
}
.nav-account-slot .nav-cta{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}
.site-account-trigger{
  position:relative;display:grid;flex:none;place-items:center;width:32px;height:32px;
  padding:0;border:1px solid var(--brand-1);border-radius:50%;background:var(--brand-0);
  color:var(--brand);cursor:pointer;font:inherit;
  transition:background-color .15s ease,border-color .15s ease;
}
.site-account-trigger::after{position:absolute;inset:-6px;content:"";border-radius:50%}
.site-account-trigger:hover{background:var(--brand-1);border-color:var(--brand-3)}
.site-account-trigger:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.site-account-trigger[aria-expanded="true"]{background:var(--brand-1);border-color:var(--brand-3)}
.nav .site-account-trigger:active{transform:none}
.site-account-avatar{display:grid;place-items:center;width:100%;height:100%;border-radius:inherit;overflow:hidden}
.site-account-avatar.is-text{font-size:13px;font-weight:600;line-height:1}
.site-account-avatar svg{width:18px;height:18px}
.site-account-avatar img{width:100%;height:100%;object-fit:cover}
.site-account-menu{
  position:absolute;z-index:70;top:calc(100% + var(--s8));right:0;width:min(280px,calc(100vw - 32px));
  padding:var(--s8);border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);
  box-shadow:0 24px 64px rgba(29,29,31,.18);transform-origin:top right;
  animation:site-account-menu-enter .15s ease-out;
}
.site-account-menu[hidden]{display:none}
.site-account-menu-head{display:grid;gap:var(--s4);padding:var(--s12);border-bottom:1px solid var(--hair)}
.site-account-menu-head b{font-size:15px;font-weight:600;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.site-account-menu-head span{color:var(--label-2);font-size:13px;line-height:1.38;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.site-account-menu a,.site-account-menu button{
  display:flex;align-items:center;width:100%;min-height:44px;padding:0 var(--s12);
  border:0;border-radius:var(--r-sm);background:transparent;color:var(--label);
  font:inherit;font-size:15px;font-weight:400;line-height:1.4;text-align:left;cursor:pointer;
}
.site-account-menu a:hover,.site-account-menu button:hover{background:var(--page)}
.site-account-menu a:focus-visible,.site-account-menu button:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.site-account-menu [data-site-account-logout]{margin-top:var(--s4);border-top:1px solid var(--hair);border-radius:0 0 var(--r-sm) var(--r-sm);color:var(--err)}
.site-account-notice-dot{width:6px;height:6px;margin-left:auto;flex:none;border-radius:50%;background:var(--err)}
.site-account-notice-dot[hidden]{display:none}
@keyframes site-account-menu-enter{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.site-account-trigger,.site-account-menu{animation:none;transition:none}}

/* Global quick entries reuse the existing button system. */
.site-quick-actions{
  position:fixed;right:max(16px,calc((100vw - var(--wide))/2 - 56px));bottom:24px;z-index:45;
  display:flex;flex-direction:column;align-items:flex-end;gap:8px;
}
.site-quick-toggle{
  display:grid;place-items:center;width:44px;min-width:44px;height:44px;padding:0;border-radius:50%;
  border:1px solid rgba(255,255,255,.72);background:rgba(225,227,232,.68);color:var(--label);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  box-shadow:0 10px 28px -14px rgba(29,29,31,.26),inset 0 1px 0 rgba(255,255,255,.72);
  cursor:pointer;
}
.site-quick-toggle:hover{background:rgba(214,217,223,.82);border-color:rgba(255,255,255,.9)}
.site-quick-toggle:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.site-quick-toggle svg{width:18px;height:18px}
.site-quick-menu{
  display:grid;gap:var(--s8);min-width:184px;padding:var(--s8);
  border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);
  box-shadow:0 24px 64px rgba(29,29,31,.18);transform-origin:bottom right;
  animation:site-account-menu-enter .15s ease-out;
}
.site-quick-menu[hidden]{display:none}
.site-quick-actions .site-quick-action{
  display:inline-flex;align-items:center;justify-content:flex-start;gap:var(--s8);width:100%;min-width:168px;height:44px;padding:0 var(--s16);
  border:1px solid transparent;border-radius:var(--r-sm);background:transparent;color:var(--label);
  font-size:15px;white-space:nowrap;
}
.site-quick-actions .site-quick-action:hover,.site-quick-actions .site-quick-action:focus-visible{background:var(--page);border-color:var(--hair);color:var(--label)}
.site-quick-actions .site-quick-action[data-state="loading"]{color:var(--label-2);cursor:progress}
.site-quick-actions .site-quick-action[data-state="loading"]::after{
  width:12px;height:12px;flex:none;border:1.5px solid rgba(29,29,31,.18);border-top-color:var(--label);
  border-radius:50%;content:"";animation:site-quick-spin .8s linear infinite;
}
.site-quick-actions .site-quick-action[data-state="error"]{border-color:rgba(255,59,48,.42);background:rgba(255,235,234,.8);color:var(--err-ink)}
.site-quick-actions .site-quick-action[data-state="denied"]{border-color:rgba(255,159,10,.5);background:rgba(255,246,230,.82);color:var(--label)}
.site-quick-actions .site-quick-action[aria-disabled="true"]{pointer-events:none}
.site-quick-icon{display:grid;flex:none;place-items:center;width:16px;height:16px}
.site-quick-icon svg{width:16px;height:16px;display:block}
.site-quick-label{min-width:0;overflow:hidden;text-overflow:ellipsis}
@keyframes site-quick-spin{to{transform:rotate(360deg)}}
.site-search-panel{display:none;width:min(760px,100%);max-height:min(58vh,520px);margin:0 auto;padding:var(--s16);overflow:auto;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);box-shadow:0 20px 52px -34px rgba(29,29,31,.36)}
.site-search-dialog[data-open="true"] .site-search-panel{display:grid;gap:var(--s16)}
.site-search-panel .site-search-state{margin:0}
.site-search-center{
  position:relative;z-index:2;grid-area:search;right:auto;left:auto;transform:none;
  display:flex;align-items:center;gap:var(--s8);width:min(320px,calc(100vw - 760px));min-width:220px;height:30px;
  padding:0 var(--s12);border:0;border-radius:999px;background:rgba(255,255,255,.9);
  box-shadow:inset 0 0 0 1px var(--line);
  color:var(--label-2);transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease;
}
.site-search-center::after{position:absolute;inset:-7px 0;content:"";border-radius:999px;pointer-events:none}
.site-search-center:focus-within{background:var(--card);box-shadow:inset 0 0 0 1px var(--brand),0 0 0 4px var(--brand-0);color:var(--deep)}
.site-search-center .ico{width:14px;height:14px;flex:none}
.site-search-center .site-search-input{
  width:100%;height:44px;min-width:0;margin-block:-7px;padding:0;border:0;outline:0;background:transparent;
  color:var(--label);font:inherit;font-size:13px;font-weight:400;line-height:1.4;letter-spacing:0;
}
.site-search-center .site-search-input::placeholder{color:var(--label-2);opacity:1}
.site-search-center .site-search-input::-webkit-search-cancel-button{
  width:18px;height:18px;margin-left:var(--s8);cursor:pointer;
}
.library-dialog.site-search-dialog{
  position:absolute;top:calc(100% + 14px);left:50%;right:auto;width:min(440px,calc(100vw - 32px));
  max-width:none;max-height:none;margin:0;padding:0;transform:translateX(-50%);
  overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none;pointer-events:none;
}
.site-search-dialog[data-open="false"]{display:none}
.site-search-dialog .library-dialog-head{display:none}
.site-search-dialog .site-search-body{
  display:block;max-height:none;padding:0;overflow:visible;pointer-events:auto;
}
.site-search-toolbar{display:none}
.site-search-modal-field{flex:1 1 auto;min-width:0;height:44px;padding:0 var(--s16);font-size:15px}
.site-search-modal-field .site-search-input{height:44px}
.site-search-toolbar .btn{flex:none}
.site-search-panel{width:100%;max-height:min(440px,calc(100vh - var(--nav-h) - 32px));padding:var(--s8);overflow:auto;pointer-events:auto}
.site-search-dialog[data-open="true"] .site-search-panel{display:grid;gap:var(--s8)}
.site-search-state{margin:0;padding:var(--s8) var(--s12);color:var(--label-2);font-size:13px;line-height:1.38}
.site-search-state[data-error]{color:var(--err)}
.site-search-results{display:grid;gap:var(--s8)}
.site-search-group>h3{margin:0;padding:var(--s8) var(--s12) var(--s4);font-size:12px;font-weight:500;line-height:1.38;color:var(--label-2)}
.site-search-list{display:grid;gap:var(--s4)}
.site-search-result{
  display:grid;gap:2px;min-height:44px;padding:var(--s8) var(--s12);border:1px solid transparent;
  border-radius:var(--r-sm);background:transparent;color:var(--label);text-decoration:none;
  transition:border-color .15s ease,background-color .15s ease;
}
.site-search-result:hover,.site-search-result:focus-visible,.site-search-result.is-active{border-color:transparent;background:var(--brand-0);outline:0}
.site-search-result strong{font-size:15px;font-weight:500;line-height:1.4;overflow-wrap:anywhere}
.site-search-result span{color:var(--label-2);font-size:13px;line-height:1.38}
.site-search-empty{
  display:grid;justify-items:start;gap:var(--s16);margin:0;padding:var(--s24);
  border:1px dashed var(--line);border-radius:var(--r-sm);color:var(--label-2);font-size:15px;line-height:1.47;
}
.library-dialog.site-auth-dialog{width:min(560px,calc(100vw - 24px))}
.site-auth-dialog .library-dialog-body{padding:var(--s24) var(--s32) var(--s32)}
.site-auth-dialog .seg{margin:0 0 var(--s24)}
.site-auth-dialog .auth-form{margin-top:0}
.library-dialog.site-support-dialog{width:min(560px,calc(100vw - 24px))}
.site-support-dialog .library-dialog-body{gap:var(--s16)}
.library-dialog.site-institute-dialog{width:min(860px,calc(100vw - 24px))}
.site-institute-dialog .library-dialog-body{gap:var(--s16)}
.site-institute-search,.site-institute-control{width:100%;min-height:44px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);padding:10px 14px;color:var(--label);font:inherit;font-size:15px;outline:0}
.site-institute-search:focus{border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-0)}
.site-institute-control:focus{border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-0)}
.site-institute-dialog input[type="file"]::file-selector-button{min-height:32px;margin-right:var(--s12);padding:0 var(--s16);border:0;border-radius:999px;background:var(--brand);color:#fff;font:inherit;font-size:13px;font-weight:500;cursor:pointer}
.site-institute-dialog .row-actions{display:flex;flex-wrap:wrap;justify-content:flex-start;white-space:normal}
.site-institute-dialog .library-dialog-model{width:100%;grid-template-columns:minmax(150px,.7fr) minmax(0,1.3fr);border:1px solid transparent;border-bottom-color:var(--hair);border-radius:var(--r-sm);background:transparent;padding:var(--s12);color:var(--label);font:inherit;text-align:left;cursor:pointer}
.site-institute-dialog .library-dialog-model:hover,.site-institute-dialog .library-dialog-model:focus-visible{border-color:var(--line);background:var(--fill)}
.site-institute-dialog .library-dialog-model[aria-pressed="true"]{border-color:var(--brand);background:var(--brand-0)}
.site-institute-form{display:grid;gap:var(--s12)}
.site-institute-form label{display:grid;gap:var(--s8);font-size:13px;color:var(--label-2)}
.site-institute-code{width:100%;min-height:180px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);padding:12px;color:var(--label);font:inherit;font-size:15px;line-height:1.5;resize:vertical;outline:0}
.site-institute-code:focus{border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-0)}
.site-institute-dialog video{display:block;width:100%;max-width:560px;border-radius:var(--r-sm);background:var(--fill)}
.site-support-dialog .auth-field{display:grid;gap:var(--s8);font-size:13px;color:var(--label-2)}
.site-support-dialog .auth-field input,.site-support-dialog .auth-field textarea{width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);color:var(--label);font:inherit;font-size:15px}
.site-support-dialog .auth-field textarea{min-height:112px;resize:vertical}
.site-support-dialog .auth-field input:focus,.site-support-dialog .auth-field textarea:focus{border-color:var(--brand);outline:0;box-shadow:0 0 0 4px var(--brand-0)}
.site-support-contact{margin:0;color:var(--label-2);font-size:13px;line-height:1.55}
.site-onboarding-dialog{
  width:min(640px,calc(100vw - 24px));max-height:calc(100dvh - 24px);margin:auto;padding:0;overflow:auto;
  border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);color:var(--label);
  box-shadow:0 32px 96px -42px rgba(29,29,31,.48);
}
.site-onboarding-dialog::backdrop{background:rgba(29,29,31,.38);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.site-onboarding-shell{display:grid;gap:var(--s24);padding:var(--s32)}
.site-onboarding-head{display:grid;gap:var(--s16)}
.site-onboarding-progress{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s8)}
.site-onboarding-progress i{display:block;height:3px;border-radius:999px;background:var(--hair)}
.site-onboarding-progress i[data-on="true"]{background:var(--brand)}
.site-onboarding-body{min-height:204px}
.site-onboarding-lead{margin:0 0 var(--s24);color:var(--label-2);font-size:17px;line-height:1.47}
.site-onboarding-path{display:grid;border-top:1px solid var(--hair)}
.site-onboarding-path li{
  display:grid;grid-template-columns:36px minmax(0,1fr);align-items:center;gap:var(--s12);
  min-height:60px;border-bottom:1px solid var(--hair);
}
.site-onboarding-path li:last-child{border-bottom:0}
.site-onboarding-seq{color:var(--brand);font-size:13px;font-weight:500;line-height:1}
.site-onboarding-path p{font-size:15px;line-height:1.47}
.site-onboarding-state{margin:-16px 0 0;color:var(--label-2);font-size:13px;line-height:1.38}
.site-onboarding-state[data-error]{color:var(--err-ink)}
.site-onboarding-state:empty{display:none}
.site-onboarding-foot{display:flex;align-items:center;justify-content:flex-end;gap:var(--s8)}
.site-onboarding-foot .btn{min-width:104px}
.site-onboarding-foot .btn-ghost{margin-right:auto}
.site-tutor-dialog{
  position:fixed;inset:auto 24px calc(24px + env(safe-area-inset-bottom)) auto;width:min(420px,calc(100vw - 32px));
  height:min(640px,calc(100dvh - 96px));max-height:calc(100dvh - 32px);margin:0;
}
.site-tutor-shell{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto auto;height:100%;min-height:0;background:var(--card)}
.site-tutor-head{display:flex;align-items:flex-start;gap:var(--s12);padding:var(--s16);border-bottom:1px solid var(--hair)}
.site-tutor-mark{
  display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:50%;
  background:var(--brand);color:var(--card);font-size:12px;font-weight:600;line-height:1;
}
.site-tutor-heading{display:grid;flex:1;min-width:0;gap:var(--s4)}
.site-tutor-title{margin:0;font-size:17px;font-weight:600;line-height:1.3;letter-spacing:-.022em}
.site-tutor-context,.site-tutor-quota{margin:0;color:var(--label-2);font-size:12px;line-height:1.38;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.site-tutor-quota[data-state="empty"]{color:var(--err-ink)}
.site-tutor-close{flex:none;align-self:flex-start}
.site-tutor-body{display:flex;flex-direction:column;gap:var(--s8);min-height:0;padding:var(--s16);overflow:auto;background:var(--page)}
.site-tutor-message{max-width:88%;padding:10px 12px;border-radius:var(--r-sm);font-size:15px;line-height:1.47;white-space:pre-wrap;overflow-wrap:anywhere}
.site-tutor-message-bot{align-self:flex-start;border:1px solid var(--hair);background:var(--card);border-top-left-radius:var(--s4)}
.site-tutor-message-user{align-self:flex-end;background:var(--brand);color:var(--card);border-top-right-radius:var(--s4)}
.site-tutor-message-action{display:grid;gap:var(--s8)}
.site-tutor-message-action p{margin:0}
.site-tutor-message-actions{display:flex;flex-wrap:wrap;gap:var(--s8)}
.site-tutor-message-actions .btn{height:44px}
.site-tutor-chips{display:flex;flex-wrap:wrap;gap:var(--s8);padding:0 var(--s16) var(--s12);background:var(--card)}
.site-tutor-chip{max-width:100%;height:44px;overflow:hidden;text-overflow:ellipsis}
.site-tutor-form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:var(--s8);padding:var(--s12) var(--s16);border-top:1px solid var(--hair);background:var(--card)}
.site-tutor-input{
  width:100%;min-height:48px;max-height:112px;padding:12px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--page);color:var(--label);font:inherit;font-size:17px;line-height:1.47;resize:none;
}
.site-tutor-input:focus{border-color:var(--brand);outline:0;box-shadow:0 0 0 4px var(--brand-0)}
.site-tutor-send[data-state="loading"]{cursor:progress;opacity:.68}
.site-tutor-note{padding:0 var(--s16) var(--s12);background:var(--card);color:var(--label-2);font-size:12px;line-height:1.38;text-align:center}
.library-dialog.site-roleplay-dialog{width:min(760px,calc(100vw - 24px));max-height:calc(100vh - 32px)}
.site-roleplay-dialog .library-dialog-body{gap:var(--s16)}
.site-roleplay-dialog > [role="status"]{margin:0;padding:0 var(--s32) var(--s12)}
.site-roleplay-transcript{min-height:220px;max-height:340px;padding:var(--s16);border:1px solid var(--hair);border-radius:var(--r-sm);background:var(--page)}
.site-roleplay-score{display:grid;gap:var(--s8);padding:var(--s16);border:1px solid var(--hair);border-radius:var(--r-sm);background:var(--fill)}
.site-roleplay-score-row{display:grid;grid-template-columns:64px minmax(0,1fr);gap:var(--s12);font-size:13px;line-height:1.47}
.site-roleplay-score-row span{color:var(--label-2)}
@media (max-width:600px){
  .site-quick-actions{right:16px;bottom:calc(16px + env(safe-area-inset-bottom));gap:8px}
  .site-quick-actions .site-quick-action{width:44px;height:44px;padding:0}
  .site-roleplay-dialog .library-dialog-body{padding:var(--s16)}
  .site-roleplay-dialog > [role="status"]{padding:0 var(--s16) var(--s12)}
  .site-roleplay-transcript{max-height:300px}
  .site-roleplay-score-row{grid-template-columns:1fr}
  .site-search-panel{max-height:min(50vh,420px);padding:var(--s12)}
  .library-dialog.site-search-dialog{
    position:fixed;top:calc(var(--nav-h) + var(--s8));right:var(--s16);left:var(--s16);
    width:auto;transform:none;
  }
  .site-auth-dialog .library-dialog-body{padding:var(--s16)}
  .library-dialog.site-institute-dialog{width:calc(100vw - 16px)}
  .site-institute-dialog .library-dialog-body{padding:var(--s16)}
  .site-institute-dialog .library-dialog-model{grid-template-columns:1fr}
  .site-search-dialog .site-search-body{padding:0}
  .site-onboarding-shell{padding:var(--s24) var(--s16)}
  .site-onboarding-body{min-height:0}
  .site-onboarding-foot .btn{flex:1;min-width:0}
  .site-tutor-dialog{inset:auto 12px calc(12px + env(safe-area-inset-bottom)) 12px;width:auto;height:min(680px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);border-radius:var(--r-md)}
  .site-tutor-head{padding:var(--s12)}
  .site-tutor-body{padding:var(--s12)}
  .site-tutor-chips{padding:0 var(--s12) var(--s12)}
  .site-tutor-form{padding:var(--s12)}
}
@media (prefers-reduced-motion:reduce){
  .site-quick-actions .site-quick-action{transition:none}
  .site-quick-actions .site-quick-action[data-state="loading"]::after{animation:none}
}

/* 按钮与链接 ------------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--s8);
  height:44px;padding:0 var(--s24);border-radius:999px;border:0;cursor:pointer;
  background:var(--deep);color:#fff;font-size:17px;font-weight:500;letter-spacing:-.022em;white-space:nowrap;
  transition:background-color .18s ease,transform .18s ease;
}
.btn:hover{background:var(--brand)}
.btn:active{transform:scale(.98)}
.btn:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.btn-ghost{background:transparent;color:var(--label);border:1px solid var(--line)}
.btn-ghost:hover{background:var(--page);color:var(--label)}
.btn-s{position:relative;height:36px;padding:0 var(--s16);font-size:15px;border-radius:999px}
.link{position:relative;display:inline-flex;align-items:center;gap:var(--s4);color:var(--deep);font-size:17px;letter-spacing:-.022em;white-space:nowrap}
.link::after{position:absolute;inset:-12px -8px;content:""}
.link:hover{text-decoration:underline}
.link svg{width:12px;height:12px;flex:none}
.band-deep .link{color:#fff}
.feature-impact{text-wrap:balance}
.actions{display:flex;align-items:center;gap:var(--s24);flex-wrap:wrap}

/* 图标（元素沿用：只用品库形状，不手绘）---------------------------- */
.ico{width:14px;height:14px;flex:none}

/* 元素 1：双链接瓷砖 ---------------------------------------------- */
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s24)}
.tile{
  background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:var(--s32);display:flex;flex-direction:column;min-height:220px;
  transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s cubic-bezier(.2,.7,.2,1);
}
.tile:hover{transform:translateY(-4px);box-shadow:0 24px 48px -32px rgba(29,29,31,.24)}
.tile h3{margin-top:var(--s8)}
.tile p{margin-top:var(--s16);color:var(--label-2)}
.tile .actions{margin-top:auto;padding-top:var(--s24)}
.tile.on-dark{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.tile.on-dark p{color:rgba(255,255,255,.72)}

/* 元素 2：Bento 非对称网格 ---------------------------------------- */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--s24)}
.cell{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:var(--s32);overflow:hidden}
.cell .eyebrow{margin-bottom:var(--s8)}
.cell p.muted{margin-top:var(--s16)}
.c-2{grid-column:span 2}.c-3{grid-column:span 3}.c-4{grid-column:span 4}.c-6{grid-column:span 6}
.c-tall{grid-row:span 2}

/* 元素 3：粘性舞台（滚动叙事）------------------------------------- */
.stage{display:grid;grid-template-columns:1fr 1fr;gap:var(--s64);align-items:start}
.stage-art{position:sticky;top:calc(var(--nav-h) + var(--s32))}
.stage-panel{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:var(--s32)}
.stage-track>*+*{margin-top:var(--s64)}
.stage-step{min-height:220px}
.stage-step .eyebrow{color:var(--brand);font-weight:500}
.stage-step h3{margin-top:var(--s8)}
.stage-step p{margin-top:var(--s16);color:var(--label-2)}
.prog{height:4px;border-radius:999px;background:var(--hair);overflow:hidden;margin-top:var(--s24)}
.prog i{display:block;height:100%;width:0;background:var(--brand);transition:width .3s linear}
.daylist{margin-top:var(--s24)}
.daylist li{display:flex;align-items:center;gap:var(--s8);padding:var(--s8) 0;border-bottom:1px solid var(--hair);font-size:15px}
.daylist li:last-child{border-bottom:0}
.daylist li[data-on="true"]{color:var(--label);font-weight:500}
.daylist li[data-on="false"]{color:var(--label-2)}
.dot{width:18px;height:18px;border-radius:50%;border:1px solid var(--line);flex:none;display:grid;place-items:center}
.dot.done{background:var(--brand-0);border-color:var(--brand-1)}
.dot.done svg{width:10px;height:10px;color:var(--brand)}
.dot.now{border:2px solid var(--brand)}
.chip{margin-left:auto;font-size:12px;color:var(--label-2);border:1px solid var(--line);border-radius:999px;padding:4px 8px;white-space:nowrap;flex:none}

/* 元素 5：选配色即改预览 ------------------------------------------ */
.picker{display:grid;grid-template-columns:1fr 1fr;gap:var(--s48);align-items:start}
.swatches{display:flex;gap:var(--s8);margin-top:var(--s24)}
.swatch{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);cursor:pointer;background:var(--card);display:grid;place-items:center;font-size:12px;font-weight:600;color:var(--label-2);transition:transform .18s ease,border-color .18s ease}
.role-code[data-role="delta"],.swatch[data-role="delta"]{font-size:13px;font-weight:600;line-height:1}
.swatch[aria-pressed="true"]{border-color:var(--brand);color:var(--brand);transform:scale(1.06)}
.swatch:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.preview{border:1px solid var(--hair);border-radius:var(--r-lg);padding:var(--s32);background:var(--card);transition:border-color .3s ease}
.preview[data-role="gate"]{border-color:var(--brand-1);background:var(--brand-0)}
.preview .role-name{font-size:40px;font-weight:600;letter-spacing:-.006em}
.preview .role-desc{margin-top:var(--s8);color:var(--label-2)}
.preview .role-meta{margin-top:var(--s24);display:flex;gap:var(--s24);font-size:13px;color:var(--label-2)}

/* 元素 6：分段控件 + 滑动指示器 ----------------------------------- */
.seg{position:relative;display:inline-flex;padding:2px;border-radius:24px;background:var(--page);border:1px solid var(--hair)}
.seg button{
  position:relative;z-index:2;height:36px;padding:0 var(--s16);border:0;background:transparent;cursor:pointer;
  font:inherit;font-size:15px;color:var(--label-2);border-radius:24px;white-space:nowrap;
}
.seg button[aria-selected="true"]{color:var(--label);font-weight:500}
.seg .ind{position:absolute;z-index:1;top:2px;bottom:2px;border-radius:24px;background:var(--card);border:1px solid var(--hair);transition:transform .24s cubic-bezier(.2,.7,.2,1),width .24s cubic-bezier(.2,.7,.2,1)}
.panel[hidden]{display:none}

/* 元素 7：大字遮罩入场 -------------------------------------------- */
.mask{display:block;overflow:hidden}
.mask>span{display:block}
/* 初始隐藏态一律由 JS 用 gsap.set 写入，CSS 不藏内容：
   JS 没跑 / GSAP 挂了 / 打印 / 减少动态 —— 内容都直接可见 */

/* 元素 8：规格对比表 ---------------------------------------------- */
.spec{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);overflow:hidden}
.spec th,.spec td{padding:var(--s16) var(--s24);text-align:left;border-bottom:1px solid var(--hair);font-size:15px;vertical-align:middle}
.spec td{text-wrap:pretty}
.spec thead th{position:sticky;top:var(--nav-h);background:var(--page);font-size:12px;font-weight:600;color:var(--label-2);letter-spacing:0;z-index:5}
.spec tbody tr:last-child td{border-bottom:0}
.spec td.t{font-weight:500}
.spec td.r,.spec th.r{text-align:right}
.spec .pill{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:4px 8px;font-size:12px;color:var(--label-2)}
.pill{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:4px 8px;font-size:12px;line-height:1.38;color:var(--label-2)}

/* 搜索结果行 / 列表行 --------------------------------------------- */
.searchbar{display:flex;align-items:center;gap:var(--s8);height:52px;padding:0 var(--s24);border:1px solid var(--line);border-radius:999px;color:var(--label-2);font-size:17px}
.searchbar:focus-within{border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-0)}
.searchbar input{border:0;outline:0;font:inherit;color:var(--label);background:transparent;width:100%;min-width:0}
.searchbar input::placeholder{color:var(--label-2)}
.chips{display:flex;gap:var(--s8);flex-wrap:wrap;margin-top:var(--s16)}
.chips button{position:relative;border:1px solid var(--line);background:var(--card);border-radius:14px;height:28px;padding:0 var(--s8);font:inherit;font-size:13px;line-height:1;color:var(--label-2);cursor:pointer}
.chips button:hover{border-color:var(--brand-3);color:var(--brand)}

/* 画廊（横向吸附）------------------------------------------------- */
.gallery{display:flex;gap:var(--s24);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:var(--s16);scrollbar-width:none}
.gallery::-webkit-scrollbar{display:none}
.gallery>*{scroll-snap-align:start;flex:0 0 clamp(260px,32%,360px)}

/* 主从（列表 + 详情）--------------------------------------------- */
.split{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:var(--s32);align-items:start}
.jobs-list li+li{margin-top:var(--s8)}
.job{border:1px solid var(--hair);border-radius:var(--r-md);padding:var(--s16) var(--s24);cursor:pointer;background:var(--card);transition:border-color .18s ease,background-color .18s ease}
.job:hover{border-color:var(--brand-1);background:var(--brand-0)}
.job[aria-selected="true"]{border-color:var(--brand);background:var(--brand-0)}
.job .meta{margin-top:var(--s4);font-size:13px;color:var(--label-2);text-wrap:balance}

/* 卡片 / 证书 / 进度环 -------------------------------------------- */
.cert{border:1px solid var(--hair);border-radius:var(--r-md);padding:var(--s24)}
.cert .no{font-size:12px;color:var(--label-2);letter-spacing:.04em}
.cert .name{margin-top:var(--s8);font-size:17px;font-weight:600}
.cert .meta{margin-top:var(--s4);font-size:13px;color:var(--label-2)}
.seal{margin-top:var(--s16);display:inline-block;border:1px solid var(--gold);border-radius:999px;padding:4px var(--s8);font-size:12px;color:var(--label)}
.rings{display:flex;gap:var(--s32);flex-wrap:wrap;margin-top:var(--s24)}
.ring{display:flex;align-items:center;gap:var(--s8)}
.ring svg{width:52px;height:52px;flex:none}
.ring b{display:block;font-size:17px;font-weight:600}
.ring span{font-size:13px;color:var(--label-2)}

/* 页脚（目录式，秩序）-------------------------------------------- */
.foot-band{border-top:1px solid var(--hair);background:var(--page);padding:var(--s48) 0 var(--s32)}
.foot-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s32)}
.foot-cols h4{font-size:12px;font-weight:600;color:var(--label);margin-bottom:var(--s8)}
.foot-cols a{display:block;font-size:12px;line-height:1.45;color:var(--label-2);padding:4px 0}
.foot-cols a:hover{color:var(--brand)}
p,li,dd,td,th{line-break:strict;overflow-wrap:break-word;word-break:normal}
p,li,dd,td,th,.small,.foot{text-wrap:pretty}
h1,h2,h3,h4{text-wrap:balance;overflow-wrap:break-word;word-break:normal}
.foot-base{margin-top:var(--s32);padding-top:var(--s16);border-top:1px solid var(--hair);display:flex;gap:var(--s24);flex-wrap:wrap;font-size:12px;line-height:1.45;color:var(--label-2)}
.foot-base .copy{margin-left:auto}
.foot-band[data-footer-authority] .foot-cols{grid-template-columns:repeat(5,minmax(0,1fr));max-width:1080px;margin:0 auto;text-align:center}
.foot-band[data-footer-authority] .foot-cols a{text-align:center}
.foot-band[data-footer-authority] .foot-base{justify-content:center}
.foot-band[data-footer-authority] .foot-base .copy{margin-left:0}
.footer-tools{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--s24);margin-top:var(--s32)}
.footer-socials{display:flex;flex-wrap:nowrap;justify-content:center;gap:var(--s12);margin:0}
.footer-socials a{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;color:var(--label-2)}
.footer-socials a:hover{background:var(--brand-0);color:var(--brand)}
.footer-socials svg{width:18px;height:18px}
.pwa-install-card{display:inline-flex;align-items:center;justify-content:flex-start;gap:var(--s8);min-height:44px;max-width:100%;margin:0;padding:0;border:0;border-radius:var(--r-sm);background:transparent;color:var(--label);text-align:left;cursor:pointer;transition:background-color .18s ease,color .18s ease}
.pwa-install-card:hover{background:transparent;color:var(--brand)}
.pwa-install-card:active{transform:scale(.98)}
.pwa-install-card:focus-visible{outline:2px solid var(--brand);outline-offset:4px}
.pwa-install-card:disabled{cursor:default;opacity:.68}
.pwa-install-card>svg{display:grid;flex:none;place-items:center;width:32px;height:32px;padding:var(--s8);border-radius:50%;background:var(--page);color:var(--label-2);transition:background-color .18s ease,color .18s ease}
.pwa-install-card:hover>svg{background:var(--brand-0);color:var(--brand)}
.pwa-install-copy{display:grid;gap:0;min-width:0}
.pwa-install-copy strong{font-size:13px;font-weight:500;line-height:1.38;color:inherit}
.pwa-install-status{font-size:12px;line-height:1.38;color:var(--label-2)}
@media(max-width:900px){.foot-band[data-footer-authority] .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){
  .foot-band{padding:var(--s32) 0 var(--s24)}
  .foot-band[data-footer-authority] .foot-cols,
  .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s16) var(--s24)}
  .foot-cols h4{margin-bottom:var(--s4)}
  .foot-cols a{padding:2px 0}
  .footer-tools{gap:var(--s12);margin-top:var(--s24)}
  .footer-socials{gap:var(--s8)}
  .pwa-install-card>svg{width:28px;height:28px;padding:var(--s4)}
  .pwa-install-copy strong{font-size:12px}
  .pwa-install-status{font-size:12px}
  .foot-base .copy{margin-left:0}
}

/* 动效：统一入场 + 全部可关 -------------------------------------- */
.reveal{transition:opacity .48s cubic-bezier(.2,.7,.2,1),transform .48s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
@media print{.reveal{opacity:1!important;transform:none!important}.mask>span{transform:none!important}.stage-art{position:static}}

/* Keep the compact quick-entry launcher out of desktop content at folded widths. */
@media (min-width:901px) and (max-width:1319px){
  main .wrap,
  footer .wrap{padding-right:80px}
}

/* 窄屏 ------------------------------------------------------------ */
@media  (max-width: 900px) {
  :root{--nav-h:92px}
  .nav{height:var(--nav-h)}
  .brand-lockup img{width:28px;height:28px}
  .h1{font-size:34px;line-height:1.12}
  .h1s,.h2{font-size:28px}
  .sub{font-size:17px}
  .h3{font-size:22px;line-height:1.18}
  .band{padding:var(--s48) 0}.band-s{padding:var(--s32) 0}
  .stage,.picker,.split{grid-template-columns:1fr;gap:var(--s32)}
  .stage-art{position:static}
  .stage-track>*+*{margin-top:var(--s48)}
  .bento{grid-template-columns:1fr}
  .c-2,.c-3,.c-4,.c-6{grid-column:span 1}
  .tiles{grid-template-columns:1fr}
  .foot-cols{grid-template-columns:repeat(2,1fr)}
  .nav-in{
    gap:0 var(--s16);
    grid-template-columns:auto minmax(0,1fr) 88px 64px;
    grid-template-areas:"brand brand search account" "primary primary primary primary";
    grid-template-rows:47px 45px;
    padding-top:1px;
  }
  .brand em{display:none}
  .nav-items{
    min-width:0;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;
    -webkit-overflow-scrolling:touch;gap:var(--s16);padding:0 0 var(--s4);
  }
  .nav-items::-webkit-scrollbar{display:none}
  .nav-items a,.nav-cta{white-space:nowrap;flex:none}
  .nav-account-slot{width:64px;min-width:64px}
  .site-search-center{
    position:relative;right:auto;left:auto;width:92px;min-width:92px;flex:none;margin-left:0;transform:none;background:var(--page);
  }
  .site-search-center .site-search-input{font-size:12px}
  .spec th,.spec td{padding:var(--s16) var(--s16)}
  .gallery>*{flex:0 0 78%}
}

@media (max-width: 600px) {
  .brand-lockup img{width:26px;height:26px}
  button,
  select,
  summary,
  textarea,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]) {
    min-height: 44px !important;
  }
  button,
  input[type="text"],
  input[type="search"],
  input[type="number"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  select {
    min-width: 44px !important;
  }
  .chips button,
  .seg button {
    height: auto;
    min-height: 44px !important;
  }
  .site-search-center,
  .site-search-center .site-search-input {
    height: 30px;
    min-height: 30px !important;
  }
  .site-search-center .site-search-input {
    height: 44px;
    min-height: 44px !important;
    margin-block: -7px;
  }
  .site-quick-actions{right:16px;bottom:calc(16px + env(safe-area-inset-bottom))}
  .site-quick-menu{min-width:168px}
}