/* 每日开口练习：沿用全局风景，只使用半透明内容层。 */
#v-t-practice{padding:22px 22px 105px}
.practice-running,.practice-complete{max-width:436px;margin:0 auto}
.practice-scene{padding:9px 7px 2px}
.practice-label{display:block;margin-bottom:14px;color:#8f7a70;font-size:14px;letter-spacing:1px}
.practice-scene>p{font-size:19px;line-height:1.8;color:#403532;letter-spacing:.4px}
.practice-line-card{position:relative;display:flex;align-items:center;justify-content:center;min-height:158px;margin-top:25px;padding:32px 24px 23px;border-radius:18px;background:linear-gradient(145deg,rgba(252,235,227,.94),rgba(255,247,241,.88));box-shadow:0 5px 18px rgba(151,79,55,.08);overflow:hidden}
.practice-line-card::after{content:'“';position:absolute;right:17px;bottom:-27px;color:rgba(178,73,62,.08);font-family:Georgia,serif;font-size:112px;line-height:1}
.practice-line-card>span{position:absolute;left:18px;top:13px;color:#b27159;font-size:10px;letter-spacing:2px}
.practice-line-card p{position:relative;z-index:1;color:#a83e35;font-size:21px;font-weight:700;line-height:1.65;letter-spacing:.8px;text-align:left;width:100%}
.practice-line-card.swap p{animation:practice-line-in .4s ease-out}
@keyframes practice-line-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.practice-method{display:flex;align-items:baseline;justify-content:center;gap:4px;min-height:34px;margin:10px 4px 0;color:#7e6258;font-size:15px;letter-spacing:.3px}
.practice-method span{white-space:nowrap}
.practice-method strong{color:#9f4439;font-size:17px;font-weight:750;letter-spacing:.5px}
.practice-timer{position:relative;width:130px;height:130px;margin:18px auto 7px;color:var(--red)}
.practice-timer svg{display:block;width:100%;height:100%;transform:rotate(-90deg)}
.practice-timer circle{fill:none;stroke-width:6}
.practice-timer-track{stroke:#ecdcd5}
.practice-timer-progress{stroke:var(--red);stroke-linecap:round;stroke-dasharray:326.73;stroke-dashoffset:0;transition:stroke-dashoffset .15s linear}
.practice-timer>div{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--red-deep)}
.practice-timer strong{font-size:39px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.practice-timer small{font-size:14px;margin:15px 0 0 3px}
.practice-timer.running{animation:practice-breathe 1.5s ease-in-out infinite}
@keyframes practice-breathe{50%{transform:scale(1.025)}}
.practice-count{text-align:center;margin:7px 0 18px;color:#8f8580;font-size:15px;letter-spacing:.5px}
.practice-record-status{display:flex;align-items:center;justify-content:center;gap:8px;min-height:32px;margin:-6px 0 10px;color:#8d7165;font-size:12px;line-height:1.5;text-align:center}
.practice-record-status[hidden]{display:none}
.practice-record-status i{width:7px;height:7px;border-radius:50%;background:#c99583;box-shadow:0 0 0 4px rgba(201,149,131,.12);flex:0 0 auto}
.practice-record-status.live{color:#a43d34}
.practice-record-status.live i{background:#b84136;animation:practice-record-pulse 1.05s ease-out infinite}
@keyframes practice-record-pulse{0%{box-shadow:0 0 0 0 rgba(184,65,54,.28)}70%,100%{box-shadow:0 0 0 8px rgba(184,65,54,0)}}
.practice-playback{display:none}
.practice-playback-ui{display:flex;align-items:center;gap:13px;margin:1px 0 12px;padding:11px 14px 11px 12px;border:1px solid rgba(206,146,123,.24);border-radius:18px;background:linear-gradient(135deg,rgba(255,252,248,.88),rgba(249,232,223,.72));box-shadow:0 5px 16px rgba(128,76,57,.07)}
.practice-playback-ui[hidden]{display:none}
.practice-play-toggle{display:flex;align-items:center;justify-content:center;width:43px;height:43px;padding:0;border:0;border-radius:50%;background:linear-gradient(145deg,#bf5445,#a83c34);box-shadow:0 5px 11px rgba(166,62,49,.2);cursor:pointer;flex:0 0 auto}
.practice-play-toggle span{width:0;height:0;margin-left:3px;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid #fff9f5}
.practice-play-toggle.playing span{width:11px;height:12px;margin-left:0;border:0;background:linear-gradient(90deg,#fff9f5 0 34%,transparent 34% 66%,#fff9f5 66%)}
.practice-play-main{min-width:0;flex:1}
.practice-play-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:3px;color:#9b796c}
.practice-play-meta strong{color:#774f43;font-size:12px;font-weight:700;letter-spacing:.5px}
.practice-play-meta span{font-size:10px;font-variant-numeric:tabular-nums;white-space:nowrap}
.practice-play-track{position:relative;display:block;width:100%;height:19px;padding:0;border:0;background:transparent;cursor:pointer}
.practice-play-track::before,.practice-play-track i{content:'';position:absolute;left:0;top:8px;height:3px;border-radius:999px}
.practice-play-track::before{right:0;background:rgba(176,111,89,.18)}
.practice-play-track i{z-index:1;width:0;background:linear-gradient(90deg,#ca6a55,#aa4037)}
.practice-play-track b{position:absolute;z-index:2;left:0;top:4px;width:11px;height:11px;border:2px solid #fff8f3;border-radius:50%;background:#b94c3f;box-shadow:0 1px 5px rgba(127,61,47,.22);transform:translateX(-50%)}
.practice-review-actions{display:grid;grid-template-columns:1fr 1.25fr;gap:9px;margin-top:4px}
.practice-review-actions[hidden]{display:none}
.practice-review-actions button{min-height:50px;padding:0 10px;border-radius:15px;font-family:inherit;font-size:13px;font-weight:700;letter-spacing:.3px;cursor:pointer}
#practice-rerecord{border:1.5px solid rgba(175,71,58,.62);background:rgba(255,252,248,.62);color:#9d4438}
#practice-next{border:0;background:linear-gradient(110deg,#b84b3d,#aa3d35);color:#fff8f2;box-shadow:0 5px 13px rgba(161,64,49,.13)}
.practice-start,.practice-full-btn,.practice-back-btn{display:block;width:100%;min-height:56px;border-radius:17px;font-family:inherit;font-size:17px;font-weight:700;letter-spacing:2px;cursor:pointer}
.practice-start[hidden]{display:none}
.practice-start,.practice-full-btn{border:0;background:linear-gradient(110deg,#b84b3d,#aa3d35);color:#fff8f2;box-shadow:0 5px 13px rgba(161,64,49,.16)}
.practice-start:disabled{opacity:.82;cursor:default}
.practice-tip{text-align:center;margin-top:12px;color:#aa9388;font-size:11px;line-height:1.7}

.practice-complete{text-align:center;padding-top:4px}
.practice-complete-chip{display:inline-flex;align-items:center;gap:9px;padding:9px 23px;border-radius:999px;background:rgba(248,225,215,.88);color:#784b3f;font-size:15px;letter-spacing:1px}
.practice-complete-chip span{color:#b75743}
.practice-complete-bubble{position:relative;margin:26px 29px 0;padding:24px 24px;border-radius:34px;background:linear-gradient(145deg,rgba(249,227,217,.92),rgba(255,242,234,.88));color:#633c31;font-size:22px;font-weight:700;line-height:1.65;text-align:left}
.practice-complete-bubble::after{content:'';position:absolute;right:28px;bottom:-17px;border-width:18px 0 0 25px;border-style:solid;border-color:transparent transparent transparent rgba(255,240,232,.9);transform:rotate(11deg)}
.practice-character-wrap{position:relative;height:258px;margin-top:2px;overflow:visible}
.practice-character-wrap img{position:absolute;right:-6px;bottom:-7px;width:91%;height:235px;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 5px 10px rgba(105,65,45,.05))}
.practice-character-wrap p{position:absolute;z-index:2;left:40px;top:62px;color:#80533f;font-family:"Kaiti SC","STKaiti",serif;font-size:14px;line-height:1.8;letter-spacing:1px;text-align:left;transform:rotate(-5deg)}
.practice-character-wrap p span{color:#bc5a47}
.practice-full-card{display:flex;align-items:center;gap:19px;padding:20px;border:1px solid rgba(235,218,207,.8);border-radius:17px;background:rgba(255,253,249,.86);box-shadow:0 5px 17px rgba(108,69,51,.06);text-align:left}
.practice-full-icon{display:flex;align-items:center;justify-content:center;width:55px;height:63px;border-radius:7px;background:linear-gradient(145deg,#e7a28c,#bd5d4b);color:#fff8f2;font-size:23px;font-family:"Songti SC",serif;box-shadow:-9px -8px 0 rgba(238,193,177,.45);flex-shrink:0}
.practice-full-card p{color:#633e34;font-size:13px;line-height:1.8}
.practice-full-card strong{font-size:14px}
.practice-product-note{display:flex;align-items:center;justify-content:center;gap:12px;margin:22px 0 15px;color:#a78c7f;font-size:11px;letter-spacing:.5px}
.practice-product-note span{width:38px;height:1px;background:linear-gradient(90deg,transparent,#d7a68e)}
.practice-product-note span:last-child{transform:rotate(180deg)}
.practice-back-btn{margin-top:11px;border:1.5px solid var(--red);background:rgba(255,252,248,.55);color:var(--red-deep)}
.practice-product-label{margin-top:12px;color:#b09b90;font-size:10px;letter-spacing:1px}

@media(max-width:420px){
  #v-t-practice{padding:18px 18px 98px}.practice-scene{padding:7px 4px 0}.practice-label{font-size:12px;margin-bottom:10px}.practice-scene>p{font-size:16px;line-height:1.75}.practice-line-card{min-height:138px;margin-top:20px;padding:29px 19px 20px}.practice-line-card p{font-size:18px}.practice-method{font-size:14px}.practice-method strong{font-size:16px}.practice-timer{width:112px;height:112px;margin-top:10px}.practice-timer strong{font-size:34px}.practice-count{font-size:13px;margin:6px 0 15px}.practice-record-status{font-size:11px}.practice-review-actions button{min-height:48px;font-size:12px}.practice-start,.practice-full-btn,.practice-back-btn{min-height:50px;font-size:15px}.practice-complete-bubble{margin:22px 18px 0;padding:21px;border-radius:29px;font-size:18px}.practice-character-wrap{height:224px}.practice-character-wrap img{height:205px;width:96%}.practice-character-wrap p{left:25px;top:52px;font-size:12px}.practice-full-card{padding:17px;gap:15px}.practice-full-card p{font-size:11.5px}.practice-full-card strong{font-size:12.5px}
}

@media(prefers-reduced-motion:reduce){.practice-line-card.swap p,.practice-timer.running,.practice-record-status.live i{animation:none}}
