/* S10 · 速记自测与微信衔接（/cross-channel/1）
   仅作用在 .s10-root 内，不改动任何既有全局样式与既有页面。 */
.s10-root{
  --s10-teal:#0b7775;--s10-teal-2:#1aaaa1;--s10-line:#dbe6ea;--s10-hover:#f2fbfa;
  --s10-ink:#11283a;--s10-muted:#526976;--s10-soft:#f7fbfb;
  color:var(--s10-ink);font-size:var(--yk-type-body);line-height:var(--yk-line-reading);
}
.s10-root *{box-sizing:border-box}
.s10-root h1,.s10-root h2,.s10-root h3,.s10-root p{margin:0}
.s10-root h1{font-size:var(--yk-type-page);line-height:var(--yk-line-heading);font-weight:var(--yk-weight-page);display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.s10-root h2{font-size:var(--yk-type-section);font-weight:var(--yk-weight-title);line-height:var(--yk-line-ui)}
.s10-root h3{font-size:var(--yk-type-body);font-weight:var(--yk-weight-title);line-height:var(--yk-line-ui)}
.s10-root a{color:inherit;text-decoration:none}
.s10-root button{font:inherit;cursor:pointer}
.s10-root svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.s10-root :is(a,button,summary,textarea):focus-visible{outline:3px solid var(--s10-teal);outline-offset:2px;border-radius:8px}
.s10-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.s10-crumb{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;font-size:var(--yk-type-meta);color:var(--s10-muted);margin-bottom:14px}
.s10-crumb span{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}
.s10-crumb i{font-style:normal;color:#a9b8c3}
.s10-crumb b{color:var(--s10-ink);font-weight:var(--yk-weight-page)}
.s10-crumb a{color:var(--s10-teal)}
.s10-crumb a:hover{text-decoration:underline}
.s10-back{border:1px solid var(--s10-line);border-radius:10px;padding:7px 14px;background:#fff;white-space:nowrap}
.s10-back:hover{background:var(--s10-hover);border-color:var(--s10-teal-2)}

.s10-title{margin-bottom:20px}
.s10-badge{font-size:var(--yk-type-micro);font-weight:var(--yk-weight-title);color:var(--s10-teal);background:#e7f5f3;border:1px solid #c6e7e3;border-radius:999px;padding:4px 10px;line-height:var(--yk-line-ui);white-space:nowrap}
.s10-lead{color:var(--s10-muted);font-size:var(--yk-type-body);margin-top:8px!important;line-height:var(--yk-line-reading)}

.s10-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,.95fr);gap:22px;align-items:start}
.s10-card{min-width:0;background:#fff;border:1px solid var(--s10-line);border-radius:12px;padding:22px 24px;box-shadow:0 1px 2px rgba(17,40,58,.03)}
.s10-card-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--s10-line)}
.s10-card-head h2{font-size:var(--yk-type-section);font-weight:var(--yk-weight-title);line-height:var(--yk-line-ui)}
.s10-note{border:1px solid var(--s10-line);background:#fff;border-radius:10px;padding:8px 14px;color:var(--s10-teal);font-weight:600;white-space:nowrap}
.s10-note:hover{background:var(--s10-hover);border-color:var(--s10-teal-2)}
.s10-note[aria-pressed="true"]{background:#e7f5f3;border-color:var(--s10-teal-2)}

.s10-block{padding:16px 0 0}
.s10-label{color:var(--s10-teal);font-size:var(--yk-type-meta);letter-spacing:.04em;margin-bottom:6px!important;font-weight:var(--yk-weight-title)}
.s10-material{background:var(--s10-soft);border-left:3px solid var(--s10-teal-2);border-radius:0 10px 10px 0;padding:12px 14px;font-size:var(--yk-type-body);min-width:0;overflow-wrap:anywhere;line-height:var(--yk-line-reading)}
.s10-ask{font-size:var(--yk-type-question);font-weight:var(--yk-weight-title);line-height:var(--yk-line-reading)}
.s10-hint{color:var(--s10-muted);font-size:var(--yk-type-meta);margin-top:6px!important}

.s10-field{position:relative;margin-top:16px}
.s10-field textarea{width:100%;display:block;min-height:104px;resize:vertical;border:1px solid var(--s10-line);border-radius:12px;padding:14px 16px 34px;font:inherit;line-height:var(--yk-line-reading);color:var(--s10-ink);background:#fff}
.s10-field textarea::placeholder{color:#526976}
.s10-field textarea:hover{border-color:var(--s10-teal-2)}
.s10-counter{position:absolute;right:14px;bottom:10px;font-size:var(--yk-type-meta);color:var(--s10-muted);background:#fff;padding:0 2px}

.s10-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.s10-primary,.s10-outline{min-height:44px;border-radius:10px;padding:10px 20px;font-size:var(--yk-type-control);font-weight:var(--yk-weight-title);border:1px solid transparent}
.s10-primary{background:var(--s10-teal);color:#fff;border-color:var(--s10-teal)}
.s10-primary:hover{background:#0a6a68}
.s10-outline{background:#fff;border-color:var(--s10-line);color:var(--s10-ink)}
.s10-outline:hover{background:var(--s10-hover);border-color:var(--s10-teal-2)}
.s10-local{margin-top:12px!important;font-size:var(--yk-type-meta);color:var(--s10-muted)}

.s10-ref{margin-top:16px;border-top:1px dashed var(--s10-line);padding-top:14px}
.s10-ref summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:var(--yk-weight-title);color:var(--s10-teal);list-style:none}
.s10-ref summary::-webkit-details-marker{display:none}
.s10-caret{transition:transform .18s}
.s10-ref[open] .s10-caret{transform:rotate(180deg)}
.s10-ref-body{margin-top:12px;display:grid;gap:10px;background:var(--s10-soft);border:1px solid var(--s10-line);border-radius:12px;padding:14px 16px;font-size:var(--yk-type-body);line-height:var(--yk-line-reading)}
.s10-ref-body b{color:var(--s10-teal);font-weight:700}
.s10-ref-note{font-size:var(--yk-type-meta);color:var(--s10-muted)}

.s10-rail h2{font-size:var(--yk-type-card);color:var(--s10-teal);font-weight:var(--yk-weight-title);line-height:var(--yk-line-ui)}
.s10-rail-lead{margin-top:8px!important;font-size:var(--yk-type-body);font-weight:var(--yk-weight-title)}
.s10-wechat{display:inline-flex;align-items:center;gap:4px;margin-top:14px;border:1px solid var(--s10-teal);background:var(--s10-hover);color:var(--s10-teal);border-radius:10px;padding:9px 16px;font-weight:var(--yk-weight-title)}
.s10-wechat:hover{background:#e7f5f3}
.s10-checked{margin-top:14px!important;color:var(--s10-teal);font-weight:var(--yk-weight-title);font-size:var(--yk-type-meta)}
.s10-note-line{margin-top:6px!important;color:var(--s10-muted);font-size:var(--yk-type-meta)}

.s10-phone{margin:18px 0 0}
.s10-phone-frame{width:min(320px,100%);margin:0 auto;padding:9px;border-radius:30px;background:linear-gradient(160deg,#1b3a45,#0d2229);box-shadow:0 10px 24px rgba(17,40,58,.16)}
.s10-phone-screen{background:#fff;border-radius:23px;padding:14px 16px 18px;min-height:296px}
.s10-phone-bar{display:flex;align-items:center;justify-content:space-between;font-size:var(--yk-type-micro);color:#526976}
.s10-phone-brand{margin-top:10px!important;font-size:var(--yk-type-meta);font-weight:var(--yk-weight-title);color:#056f74}
.s10-phone-meta{margin-top:2px!important;font-size:var(--yk-type-micro);color:#526976}
.s10-phone-material{margin-top:12px!important;background:#f2f7f4;border-radius:10px;padding:11px 12px;font-size:var(--yk-type-meta);line-height:var(--yk-line-ui);overflow-wrap:anywhere}
.s10-phone-ask{margin-top:12px!important;font-size:var(--yk-type-meta);font-weight:var(--yk-weight-title);display:grid;gap:4px}
.s10-phone-ask em{font-style:normal;font-size:var(--yk-type-micro);font-weight:var(--yk-weight-body);color:var(--s10-teal)}
.s10-phone-btn{display:block;margin-top:12px;text-align:center;background:#07c160;color:#fff;border-radius:9px;padding:10px 12px;font-size:var(--yk-type-control);font-weight:var(--yk-weight-title)}
.s10-phone-note{margin-top:10px!important;font-size:var(--yk-type-micro);color:#526976}
.s10-phone figcaption{margin-top:10px;text-align:center;font-size:var(--yk-type-micro);color:var(--s10-muted)}

.s10-bridge{margin-top:18px;border-top:1px solid var(--s10-line);padding-top:14px}
.s10-bridge h3{font-size:var(--yk-type-body);font-weight:var(--yk-weight-title)}
.s10-bridge p{color:var(--s10-muted);font-size:var(--yk-type-meta);margin-top:6px!important}

.s10-next{margin-top:22px;background:#fff;border:1px solid var(--s10-line);border-radius:12px;padding:18px 24px 20px;min-width:0}
.s10-next-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.s10-test-tag{font-size:var(--yk-type-micro);color:var(--s10-muted);border:1px dashed var(--s10-line);border-radius:999px;padding:2px 9px}
.s10-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-top:14px}
.s10-option{display:grid;gap:4px;text-align:left;background:#fff;border:1px solid var(--s10-line);border-radius:12px;padding:14px 16px;min-width:0}
.s10-option b{font-size:var(--yk-type-body);font-weight:var(--yk-weight-title);display:flex;align-items:center;gap:6px}
.s10-option b span{color:var(--s10-teal)}
.s10-option>span{font-size:var(--yk-type-meta);color:var(--s10-muted)}
.s10-option:hover{background:var(--s10-hover);border-color:var(--s10-teal-2)}
.s10-option.on{background:#e7f5f3;border-color:var(--s10-teal);box-shadow:inset 0 0 0 1px var(--s10-teal)}
.s10-option[aria-pressed="true"] b{color:var(--s10-teal)}
.s10-next-note{margin-top:12px!important;font-size:var(--yk-type-meta);color:var(--s10-muted)}

@media(max-width:1100px){
  .s10-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:760px){
  .s10-root{font-size:var(--yk-type-body)}
  .s10-root h1{font-size:var(--yk-type-page);line-height:var(--yk-line-heading)}
  .s10-card{padding:18px 16px}
  .s10-next{padding:16px}
  .s10-options{grid-template-columns:minmax(0,1fr)}
  .s10-primary,.s10-outline{width:100%;justify-content:center;text-align:center}
  .s10-material{font-size:var(--yk-type-body)}
}
@media(max-width:360px){
  .s10-phone-screen{padding:12px 13px 16px}
  .s10-phone-frame{padding:7px;border-radius:26px}
}