.ex-sec{border-top:1px solid var(--line);background:var(--paper)}.ex-sec .f-label,.ex-sec .f-h2 .soft{color:var(--cobalt)}.ex-body{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:48px;margin-top:40px}.ex-body.ex-single{grid-template-columns:minmax(0,1fr);max-width:1080px}.ex-pick-q{margin:0 0 16px;font-size:12px;letter-spacing:0;color:var(--text-3)}.ex-tabs{display:grid;gap:6px}.ex-tab{display:grid;grid-template-columns:40px minmax(0,1fr) 16px;gap:12px;align-items:center;justify-content:start;height:auto;min-height:76px;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--fg);font:inherit;text-align:start;white-space:normal;transition:background-color .2s ease,border-color .2s ease,transform .2s ease}.ex-tab:hover{border-color:var(--cobalt);background:rgb(var(--cobalt-rgb) / .04);transform:translateY(-2px)}.ex-tab[aria-selected=true]{border-color:var(--field);background:var(--field);color:var(--on-cobalt);box-shadow:var(--sh-1)}.ex-tab-icon{display:grid;place-items:center;width:40px;height:40px;background:rgb(var(--cobalt-rgb) / .08);color:var(--cobalt);border-radius:6px}.ex-tab[aria-selected=true] .ex-tab-icon{background:var(--on-cobalt-line);color:var(--on-cobalt)}.ex-tab-copy{display:grid;gap:4px}.ex-tab-need{font-size:15px;font-weight:600;line-height:1.35}.ex-tab-name{font-size:12px;color:var(--text-3)}.ex-tab[aria-selected=true] .ex-tab-name{color:var(--on-cobalt-2)}.ex-tab-arrow{opacity:0;transition:opacity .2s ease}.ex-tab[aria-selected=true] .ex-tab-arrow,.ex-tab:hover .ex-tab-arrow{opacity:1}[dir=rtl] .ex-tab-arrow,[dir=rtl] .ex-change svg{transform:rotate(180deg)}.ex-panel{min-width:0;animation:ex-enter .38s var(--ease-enter) both}.ex-panel-heading{display:flex;gap:16px;align-items:baseline;margin-bottom:20px}.ex-step{font-size:14px;color:var(--cobalt)}.ex-name{margin:0;font-size:26px;font-weight:640;letter-spacing:0;line-height:1.3}.ex-grid{display:grid;gap:22px;margin:0}.ex-cell{min-width:0}.ex-cell dt{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;font-weight:600;letter-spacing:0;color:var(--text-3)}.ex-cell dd{margin:0;font-size:16px;line-height:1.6;color:var(--fg)}.ex-what{display:grid;grid-template-columns:148px minmax(0,1fr);align-items:center;gap:24px;padding:24px;background:var(--field);color:var(--on-cobalt);border-radius:8px}.ex-what dt{color:var(--on-cobalt-2)}.ex-what dd{font-size:19px;font-weight:520;line-height:1.55;color:var(--on-cobalt)}.ex-visual{display:block;width:148px;aspect-ratio:1;overflow:hidden;border-radius:6px}.ex-visual img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.ex-today{padding:0 0 18px;border-bottom:1px solid var(--line)}.ex-ba{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr);align-items:stretch;gap:12px}.ex-before,.ex-after{padding:20px;border-radius:6px}.ex-before{background:hsl(var(--ex-problem-surface));border-inline-start:3px solid hsl(var(--ex-problem))}.ex-before dt{color:hsl(var(--ex-problem))}.ex-after{background:hsl(var(--ex-success-surface));border-inline-start:3px solid hsl(var(--ex-success))}.ex-after dt{color:hsl(var(--ex-success))}.ex-change{display:grid;place-items:center;color:var(--cobalt)}.ex-example{border-inline-start:2px solid var(--cobalt);padding-inline-start:18px}.ex-example dt{color:var(--cobalt)}.ex-acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}@keyframes ex-enter{0%{opacity:.4;transform:translateY(10px)}to{opacity:1;transform:none}}@media (max-width: 1100px){.ex-body{gap:28px}.ex-what{grid-template-columns:104px minmax(0,1fr);gap:18px;padding:20px}.ex-visual{width:104px}}@media (max-width: 860px){.ex-body{grid-template-columns:minmax(0,1fr);gap:24px;margin-top:28px}.ex-tabs{display:flex;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:10px;scrollbar-width:thin;scrollbar-color:var(--cobalt) var(--paper-2)}.ex-tab{flex:0 0 min(270px,calc(100vw - 72px));scroll-snap-align:start}.ex-name{font-size:23px}.ex-what dd{font-size:17px}}@media (max-width: 520px){.ex-what{grid-template-columns:76px minmax(0,1fr);gap:14px;padding:16px;align-items:start}.ex-visual{width:76px}.ex-what dd{font-size:16px}.ex-ba{grid-template-columns:minmax(0,1fr);gap:8px}.ex-change{height:24px}.ex-change svg,[dir=rtl] .ex-change svg{transform:rotate(90deg)}.ex-acts .btn-wa{width:100%;white-space:normal}}@media (max-width: 359px){.ex-what{grid-template-columns:minmax(0,1fr)}.ex-visual{width:88px}}@media (prefers-reduced-motion: reduce){.ex-panel{animation:none}.ex-tab,.ex-tab-arrow{transition:none}.ex-tab:hover{transform:none}}
