.practice-page{position:relative;display:grid;gap:1.35rem;padding-bottom:9rem}.practice-page:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(circle at 12% 8%,rgb(232 238 246 / 80%),transparent 26rem),radial-gradient(circle at 88% 4%,rgb(241 230 218 / 72%),transparent 24rem),linear-gradient(180deg,#fbf8f2 0%,var(--paper) 62%,#f1eee8 100%)}.practice-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,.38fr);align-items:end;gap:2rem;padding:1.25rem 0 .6rem}.hero-copy h1{max-width:10ch;margin:.15rem 0 .75rem;font-size:clamp(3rem,7vw,5.8rem);letter-spacing:-.08em}.hero-copy .intro{max-width:42rem;margin:0;color:var(--fog-blue);font-size:clamp(1.05rem,2vw,1.28rem);line-height:1.75;font-weight:650}.hero-panel{display:grid;gap:.45rem;padding:1.15rem 1.2rem;border:1px solid color-mix(in srgb,var(--fog-blue-soft) 70%,white);border-radius:1.35rem;background:linear-gradient(145deg,#ffffffe0,#f3f7fbe0);box-shadow:var(--shadow)}.hero-panel strong{color:var(--ink);font-size:1.05rem}.hero-panel p{margin:0;color:var(--muted-ink);line-height:1.65}.status-dot{width:.72rem;height:.72rem;border-radius:999px;background:var(--sage);box-shadow:0 0 0 .42rem #7c927b24}.practice-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1rem}button,select{border:1px solid color-mix(in srgb,var(--fog-blue-soft) 85%,var(--line));border-radius:.9rem;padding:.8rem 1rem;color:var(--ink);background:var(--surface-strong);font:inherit;font-weight:750;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease}button:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--fog-blue) 38%,var(--fog-blue-soft));box-shadow:0 .7rem 1.6rem #343f4e14}button:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid rgb(84 109 142 / 22%);outline-offset:3px}.mode-hint{margin:0;padding:1rem 1.15rem;border:1px solid color-mix(in srgb,var(--fog-blue-soft) 78%,white);border-radius:1.05rem;color:var(--fog-blue);background:#ffffffb8;box-shadow:0 .7rem 1.8rem #343f4e0a;font-size:.95rem;font-weight:650;line-height:1.7}.processing-status{margin:0;padding:.9rem 1rem;border-radius:999px;color:var(--ink);background:var(--coach-warm-soft);font-size:.92rem;font-weight:800;white-space:nowrap}.error-card{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem;border:1px solid rgb(155 58 58 / 18%);border-radius:1rem;background:#fff6f4}.error-card p{margin:.25rem 0 0;color:#8e3a32}.manual-practice{display:grid;grid-template-columns:minmax(10rem,.24fr) minmax(0,1fr) auto auto;align-items:end;gap:1rem;padding:1.25rem;border:1px solid color-mix(in srgb,var(--line) 70%,white);border-radius:1.45rem;background:linear-gradient(135deg,#fffdf8f2,#fffffff5),var(--surface);box-shadow:var(--shadow)}.manual-copy{display:grid;gap:.35rem}.manual-copy span{color:var(--coach-warm);font-size:.78rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.manual-copy strong{color:var(--ink);line-height:1.55}.manual-practice label{display:grid}.manual-practice textarea{width:100%;min-height:6rem;resize:vertical;border:1px solid color-mix(in srgb,var(--fog-blue-soft) 70%,var(--line));border-radius:1.05rem;padding:1rem 1.05rem;color:var(--ink);background:var(--surface-strong);box-shadow:inset 0 .08rem .18rem #343f4e08;font:inherit;font-weight:500;line-height:1.7}.manual-practice textarea::placeholder{color:color-mix(in srgb,var(--muted-ink) 78%,white)}.manual-practice button[type=submit],.record-button{border-color:transparent;color:#fff;background:linear-gradient(135deg,#526985,#6f84a0);box-shadow:0 .85rem 1.8rem #546d8e38}.ghost-button{color:var(--fog-blue);background:var(--fog-blue-pale)}.result-desk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}.result-desk section{position:relative;min-width:0;min-height:13rem;overflow:hidden;padding:1.6rem;border:1px solid color-mix(in srgb,var(--line) 70%,white);border-radius:1.35rem;background:#ffffffe0;box-shadow:0 .9rem 2.4rem #343f4e12}.result-desk section:before{content:"";position:absolute;inset:0 0 auto;height:.28rem;background:linear-gradient(90deg,var(--fog-blue),var(--coach-warm-soft))}.result-desk h2{margin:0 0 1rem;font-family:Georgia,"Noto Serif SC",Songti SC,serif;font-size:1.2rem;letter-spacing:-.03em}.result-desk p,.result-desk li{color:var(--ink);font-size:1.02rem;line-height:1.78}.keyword-list{display:flex;flex-wrap:wrap;gap:.8rem}.keyword{display:grid;gap:.25rem;min-width:8.5rem;padding:.85rem;border:1px solid color-mix(in srgb,var(--fog-blue-soft) 85%,white);border-radius:1rem;background:linear-gradient(180deg,var(--fog-blue-pale),#ffffff)}.keyword strong{color:var(--ink)}.keyword span{color:var(--fog-blue);font-size:.82rem;font-weight:750}.keyword button{margin-top:.35rem;padding:.6rem .75rem;border-color:transparent;color:var(--ink);background:var(--surface-strong)}.record-dock{position:fixed;z-index:10;left:50%;bottom:1rem;transform:translate(-50%);display:flex;align-items:center;justify-content:space-between;gap:1rem;width:min(40rem,calc(100% - 1rem));padding:.82rem .9rem .82rem 1.1rem;border:1px solid rgb(255 255 255 / 72%);border-radius:1.25rem;background:#fffdf8d6;box-shadow:0 1rem 3rem #343f4e2e;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.record-dock span{color:var(--fog-blue);font-size:.88rem;font-weight:650}.audio-energy{width:8rem;height:.35rem;margin-top:.5rem;border-radius:1rem;background:repeating-linear-gradient(90deg,var(--fog-blue-soft) 0 .35rem,transparent .35rem .55rem)}.audio-energy i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--fog-blue),var(--sage));transition:width .15s ease}.record-error{margin:.35rem 0 0;color:#9b3a3a;font-size:.78rem}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(max-width:920px){.practice-hero,.practice-meta,.manual-practice{grid-template-columns:1fr}.processing-status{justify-self:start}}@media(max-width:760px){.practice-page{gap:1rem}.practice-hero{gap:1rem;padding-top:.4rem}.hero-copy h1{font-size:clamp(3.2rem,18vw,4.6rem)}.hero-panel,.manual-practice,.result-desk section{border-radius:1.15rem}.result-desk{grid-template-columns:1fr}.manual-practice{padding:1rem}.record-dock{bottom:.5rem}}:root{--paper: #f7f3ec;--surface: #fffdf8;--surface-strong: #ffffff;--fog-blue: #546d8e;--fog-blue-soft: #e8eef6;--fog-blue-pale: #f3f7fb;--coach-warm: #9a7659;--coach-warm-soft: #f1e6da;--sage: #7c927b;--ink: #2f3947;--muted-ink: #66758a;--line: #e7e1d8;--shadow: 0 1rem 3rem rgb(52 63 78 / 10%)}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font-family:Inter,Noto Sans SC,Microsoft YaHei,sans-serif;line-height:1.6}a{color:var(--fog-blue);text-decoration:none}a:hover{color:var(--coach-warm)}header{border-bottom:1px solid var(--fog-blue-soft);background:color-mix(in srgb,var(--surface) 92%,transparent)}.shell{width:min(70rem,calc(100% - 2rem));margin-inline:auto}header .shell{display:flex;align-items:center;justify-content:space-between;min-height:4rem;gap:1rem}.brand{color:var(--ink);font-family:Georgia,"Noto Serif SC",serif;font-size:1.15rem;font-weight:700}nav{display:flex;gap:1.25rem}main{padding-block:clamp(2rem,5vw,4rem)}.eyebrow{margin:0;color:var(--coach-warm);font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}h1{margin-block:.5rem;font-family:Georgia,"Noto Serif SC",serif;font-size:clamp(2.25rem,7vw,4.5rem);line-height:1.1}.intro{max-width:32rem;margin-bottom:0;color:var(--fog-blue)}