/* V7.0.6 · 成语故事样式：复用扩句训练背景，每页一条成语（释义 + 造句）。 */

/* ===== 竖屏外壳（同扩句训练） ===== */
.cn-idiom-page{background:linear-gradient(#f7e7b4,#f8fcf5 40%,#fff8df)}
.cn-idiom-hero{background:#f5dea3}
/* hero 图已绘制返回/主页，隐藏按钮外观但保留点击 */
.cn-idiom-page .cn-hero-hit{background:transparent;box-shadow:none}
.cn-idiom-page .cn-hero-hit>img{opacity:0}
.cn-idiom-body{position:relative;z-index:3;margin-top:-5px;padding:18px 20px max(34px,var(--sab));background:#fffdf8;border-radius:32px 32px 0 0;min-height:650px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:14px}

/* 标题行 */
.cn-idiom-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.cn-idiom-heading h1{margin:4px 0 0;font-size:29px}
.cn-idiom-topic{color:#7d695f;font-weight:800}
.cn-idiom-status b{padding:8px 13px;border-radius:999px;background:#edf7ef;color:#397c48;white-space:nowrap}

/* 卡片：竖屏上下堆叠 */
.cn-idiom-card{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:14px;overflow:hidden}

/* 卷轴（成语主视觉） */
.cn-idiom-scroll{position:relative;border:3px solid #d8b36a;border-radius:22px;padding:22px 18px 20px;background:linear-gradient(160deg,#fcf4e0,#f1e0b6);box-shadow:inset 0 0 0 6px rgba(255,255,255,.45),0 12px 28px rgba(120,86,30,.16);display:grid;place-items:center}
.cn-idiom-scroll-tag{position:absolute;top:8px;left:12px;font-size:13px;font-weight:900;color:#a1702f;letter-spacing:3px}
.cn-idiom-chars{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 6px}
.cn-idiom-char{font-family:KaiTi,STKaiti,"Kaiti SC","STSong",serif;font-size:clamp(46px,11.5vw,94px);line-height:1.08;color:#5a2a1c;font-weight:900;text-shadow:0 2px 0 rgba(255,255,255,.55)}
.cn-idiom-seal{position:absolute;right:10px;bottom:8px;width:42px;height:42px;transform:rotate(-6deg)}
.cn-idiom-seal svg{display:block;width:100%;height:100%}

/* 释义 / 造句 */
.cn-idiom-texts{min-height:0;display:grid;gap:12px;align-content:start;overflow-y:auto;scrollbar-width:none}
.cn-idiom-texts::-webkit-scrollbar{display:none}
.cn-idiom-panel{border:1px solid #ecdcb6;border-radius:18px;padding:13px 15px;display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}
.cn-idiom-meaning{background:#fff8ec}
.cn-idiom-sentence{background:#f2f9ef;border-color:#cfe6c9}
.cn-idiom-flag{padding:6px 12px;border-radius:11px;font-weight:900;font-size:15px;margin-top:2px;letter-spacing:1px;white-space:nowrap}
.cn-idiom-flag.warm{background:#e8843c;color:#fff}
.cn-idiom-flag.green{background:#4f9d63;color:#fff}
.cn-idiom-panel p{margin:0;color:#4a3b2a;font-size:17px;line-height:1.7;font-weight:650}
.cn-idiom-sentence p{color:#33452c}
.cn-idiom-hl{background:linear-gradient(transparent 58%,#ffd877 58%);color:#b3261e;font-weight:900;border-radius:3px;padding:0 2px}
.cn-idiom-quote{font-family:KaiTi,STKaiti,serif;font-size:21px;color:#c98a2f;font-weight:900;vertical-align:-2px}
.cn-idiom-quote.end{color:#7fa85f}

/* 翻页 */
.cn-idiom-nav{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cn-idiom-nav button{min-height:52px;border:1px solid #ddceb2;border-radius:17px;background:#fffaf0;color:#684934;font-size:16px;font-weight:900}
.cn-idiom-nav button:disabled{opacity:.35}
/* 状态区可同时显示“今日进度 + 总序号” */
.cn-idiom-status{display:flex;align-items:center;gap:8px}
.cn-idiom-today{background:#fff1d4!important;color:#b06a16!important}
/* 当日训练最后一条的完成按钮 */
.cn-idiom-finish{min-height:52px;border:0;border-radius:17px;background:linear-gradient(135deg,#5cbe6e,#3e9c53);color:#fff;font-size:16px;font-weight:900;box-shadow:0 9px 20px rgba(63,157,83,.3)}
.cn-idiom-finish:active{transform:scale(.97)}

/* ===== 横屏（iPad 为主） ===== */
html.device-landscape .cn-idiom-page{position:relative;width:var(--app-w);height:var(--app-h);max-width:none;min-height:0;aspect-ratio:auto;margin:0;overflow:hidden;background:#f8f5eb url('assets/ipad-landscape/chinese-expand-training-bg.png') center/cover no-repeat;box-shadow:none}
html.device-landscape .cn-idiom-hero{position:absolute;inset:0 0 auto;height:29%;background:transparent}
html.device-landscape .cn-idiom-hero>img{opacity:0}
html.device-landscape .cn-idiom-body{position:absolute;z-index:3;left:1%;right:1%;top:28.5%;bottom:1.3%;min-height:0;margin:0;padding:2.2% 4.2% 1.6%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:1.4%;border-radius:38px;background:rgba(255,253,248,.97);overflow:hidden}
html.device-landscape .cn-idiom-heading{min-height:0}
html.device-landscape .cn-idiom-heading h1{margin-top:4px;font-size:clamp(27px,3.2vw,46px)}
html.device-landscape .cn-idiom-topic{font-size:clamp(13px,1.6vw,22px)}
html.device-landscape .cn-idiom-status>b{font-size:clamp(16px,1.9vw,26px);padding:9px 18px}
/* 卡片改为左右两栏 */
html.device-landscape .cn-idiom-card{grid-template-rows:none;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:2%}
html.device-landscape .cn-idiom-scroll{height:100%;min-height:0;padding:3% 4%}
html.device-landscape .cn-idiom-char{font-size:clamp(42px,5.4vw,100px)}
html.device-landscape .cn-idiom-seal{width:clamp(34px,3.4vw,52px);height:clamp(34px,3.4vw,52px)}
html.device-landscape .cn-idiom-texts{gap:clamp(7px,1vh,13px)}
html.device-landscape .cn-idiom-panel{padding:clamp(9px,1.3vh,15px) clamp(12px,1.4vw,20px);gap:clamp(8px,1.2vw,16px);border-radius:16px}
html.device-landscape .cn-idiom-flag{font-size:clamp(13px,1.3vw,18px);padding:6px clamp(9px,1.1vw,15px)}
html.device-landscape .cn-idiom-panel p{font-size:clamp(14px,1.42vw,20px);line-height:1.5}
html.device-landscape .cn-idiom-nav{min-height:44px;gap:12px}
html.device-landscape .cn-idiom-nav button{min-height:44px;font-size:clamp(13px,1.4vw,18px)}
html.device-landscape .cn-idiom-finish{min-height:44px;font-size:clamp(13px,1.4vw,18px)}

/* iPad 竖屏：成语页铺满整宽（覆盖 .cn-page 的 820 限宽），避免两侧蓝色漏边；白色正文居中限宽便于阅读 */
@media(min-width:700px) and (orientation:portrait){
  .cn-page.cn-idiom-page{width:100vw;max-width:none;margin:0}
  .cn-idiom-body{max-width:880px;margin-left:auto;margin-right:auto}
}

/* ===== 竖屏窄屏手机：菜单图按宽铺满后高度不足，底部用图片底边米色(#FDF8EC)补齐，避免蓝带；不拉伸 section、不改变热区百分比定位 ===== */
@media(orientation:portrait){
  #app:has(.cn-entry-reference),body:has(.cn-entry-reference){background:#FDF8EC!important}
}