:root{--selected-ui:'assets/ui-selected/'}
.uiPng{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}

/* 只替换控件素材，沿用 V5.12 原布局 */
.roundBtn.hasPng{padding:0;background:transparent!important;box-shadow:none!important}
.roundBtn.hasPng .uiPng{filter:drop-shadow(0 5px 9px rgba(28,91,144,.12))}
.chevPng{width:30px;height:30px;justify-self:end;object-fit:contain}

.studyIcon.hasArtwork{padding:3px;background:transparent}
.studyIcon.hasArtwork img{width:100%;height:100%;object-fit:contain}
.studyCard{min-height:116px}
.studyCard .studyName{margin-top:1px}

.tab.assetTab,.knowledgeTabs .assetTab{position:relative;overflow:hidden;background-position:center!important;background-repeat:no-repeat!important;background-size:100% 100%!important;display:flex;align-items:center;justify-content:center;gap:7px;color:#717c91;box-shadow:none;border:0}
.tab.assetTab.words{background-image:url('assets/ui-selected/buttons/button_tab_word_inactive.png')}
.tab.assetTab.sentences{background-image:url('assets/ui-selected/buttons/button_tab_sentence_inactive.png')}
.tab.assetTab.words.on{background-image:url('assets/ui-selected/buttons/button_tab_word_active.png');color:#fff}
.tab.assetTab.sentences.on{background-image:url('assets/ui-selected/buttons/button_tab_sentence_active.png');color:#fff}
.tabs.fromKnowledge,.tabs.threeTabs{grid-template-columns:repeat(3,minmax(0,1fr))}
.tab.assetTab.meaning{background-image:url('assets/ui-selected/buttons/button_tab_meaning_inactive.png')}
.knowledgeTabs .assetTab.words{background-image:url('assets/ui-selected/buttons/button_tab_word_inactive.png')}
.knowledgeTabs .assetTab.sentences{background-image:url('assets/ui-selected/buttons/button_tab_sentence_inactive.png')}
.knowledgeTabs .assetTab.meaning{background-image:url('assets/ui-selected/buttons/button_tab_meaning_active.png');color:#fff}
.assetTab img{width:24px;height:24px;object-fit:contain}.assetTab.disabled{opacity:.48}

.playBtn.hasPng,.miniPlay.hasPng{padding:0;background:transparent}.playBtn.hasPng img{width:42px;height:42px}.miniPlay.hasPng img{width:34px;height:34px}
.reviewBtn.withIcon{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:52px;padding:8px 13px 8px 9px;border:1.5px solid #a8d9fb;background:linear-gradient(145deg,#f8fdff,#e9f7ff);box-shadow:0 6px 14px rgba(31,116,181,.12);overflow:visible}.reviewBtn.withIcon .reviewPencil{width:34px;height:34px;object-fit:contain}.reviewBtn.withIcon .reviewRays{position:absolute;left:-14px;top:-15px;width:34px;height:34px;object-fit:contain}.reviewBtn.withIcon .arrowMini{width:22px;height:22px;object-fit:contain}
.kpHeaderIcon img{display:block;width:32px;height:32px;object-fit:contain}
.kpHeader .kpPager{margin-left:auto;flex:0 0 auto;color:#647b9c;font-size:14px;font-weight:900;white-space:nowrap}
.kpPageNav{display:grid;grid-template-columns:52px 1fr 52px;align-items:center;gap:12px;margin:16px 2px 2px;color:#6b819e;font-size:14px;font-weight:850;text-align:center}
.kpPageBtn{width:48px;height:48px;border:0;border-radius:50%;background:#f1f8ff;box-shadow:0 4px 12px rgba(28,111,183,.12);display:grid;place-items:center;cursor:pointer}
.kpPageBtn img{width:24px;height:24px;object-fit:contain}.kpPageBtn:disabled{opacity:.3;cursor:default;box-shadow:none}
.knowledgeLearn .kpArticle{border:1.5px solid #d6eaf7;background:linear-gradient(145deg,#fbfdff 0%,#f1f9ff 100%);border-radius:24px;padding:24px 22px 18px;color:#183f73;font-size:17px;line-height:1.85;overflow:visible;box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.knowledgeLearn .kpArticle h3{margin:4px 0 18px;color:#123f7c;font-size:21px;line-height:1.45;font-weight:950}
.knowledgeLearn .kpArticle p{margin:12px 0;overflow-wrap:anywhere;word-break:normal}
.knowledgeLearn .kpTableWrap{display:block;width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;margin:14px 0;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.knowledgeLearn .kpTable,.knowledgeLearn .kpTable tbody,.knowledgeLearn .kpTable tr,.knowledgeLearn .kpTable td{background:none!important;background-color:transparent!important;background-image:none!important}
.knowledgeLearn .kpTable{width:max-content!important;min-width:100%!important;max-width:none!important;table-layout:auto;border-collapse:collapse}
.knowledgeLearn .kpTable td{max-width:none;border:1px solid rgba(142,172,204,.38);padding:9px 12px;vertical-align:top;white-space:nowrap!important;overflow-wrap:normal!important;word-wrap:normal!important;word-break:keep-all!important}
.knowledgeLearn .kpTable tr:first-child td{color:#1679c9;font-weight:900}
.knowledgeLearn .kpTable.kpTextNote,.knowledgeLearn .kpTable.kpTextNote tbody,.knowledgeLearn .kpTable.kpTextNote tr{display:block;width:100%}
.knowledgeLearn .kpTable.kpTextNote{width:100%!important;min-width:0!important;max-width:100%!important}
.knowledgeLearn .kpTable.kpTextNote td{display:block;width:100%;max-width:100%;border:0;padding:3px 0;background:transparent;font-weight:850;line-height:1.75;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important}
.knowledgeLearn .kpTable.kpNoteBlue td{color:#147dd1}.knowledgeLearn .kpTable.kpNoteGreen td{color:#2b9a54}.knowledgeLearn .kpTable.kpNoteOrange td{color:#d67818}
@media(max-width:430px){.knowledgeLearn .kpArticle{padding:20px 16px 15px;font-size:16px}.knowledgeLearn .kpArticle h3{font-size:19px}.knowledgeLearn .kpTable td{padding:8px 5px;font-size:14px;line-height:1.55}}

/* 练习：保留题号，移除绿色进度条 */
.quizBar{display:none!important}.quizProgress{line-height:1.1}
.quizTitle.assetTitle{position:relative;color:#123f91;padding:0 3px 7px}.quizTitle.assetTitle:after{content:"";position:absolute;left:0;right:-8px;bottom:1px;height:6px;border-radius:99px;background:#ffc32d;transform:rotate(-2deg)}
.quizHeadIcon{width:48px;height:48px;object-fit:contain}
.quizTop.fixedReferenceTop{min-height:0;aspect-ratio:837/455;background:#65c7f5 url('assets/ui-selected/quiz_top_fixed_reference.jpg') center top/100% auto no-repeat;overflow:hidden}
.quizTop.fixedReferenceTop .topbar{position:absolute;inset:0;z-index:8;pointer-events:none}.quizTopHit{position:absolute;top:3%;width:14%;height:22%;border:0;background:transparent;pointer-events:auto;cursor:pointer}.quizTopBack{left:1%}.quizTopHome{right:1%}
.quizTop .topbar{z-index:6;pointer-events:none}.quizTop .roundBtn{pointer-events:auto}
.quizWoodSign{position:absolute;left:4%;bottom:-2px;width:min(57%,330px);aspect-ratio:1;z-index:2}.quizWoodSign>img{width:100%;height:100%;object-fit:contain}.quizWoodMain,.quizWoodSub{position:absolute;left:15%;right:15%;display:grid;place-items:center;text-align:center;font-weight:950}.quizWoodMain{top:36%;height:19%;font-size:clamp(18px,4.2vw,30px);color:#fff;text-shadow:0 3px 2px rgba(109,53,9,.7)}.quizWoodSub{top:59%;height:13%;font-size:clamp(13px,3vw,20px);color:#6d3511}.quizTitlePng{display:block;width:150px;height:58px;object-fit:contain;object-position:left center}.quizHead .wrongTitle{font-size:24px;font-weight:950;color:#d66a16}
.option.assetOption{display:grid;grid-template-columns:48px 1fr 28px;align-items:center;gap:10px;padding:9px 13px;min-height:66px}
.optionBadge{width:46px;height:46px;object-fit:contain}.optionText{min-width:0}.stateBadge{width:26px;height:26px;object-fit:contain;display:none}.option.correct .stateBadge,.option.wrong .stateBadge{display:block}
.binaryOption{grid-template-columns:46px 1fr!important}.binaryOption .optionText{font-size:18px;font-weight:900}.wordAudioBtn img{width:44px!important;height:44px!important}
.explainHeading{display:flex;align-items:center;gap:7px}.explainHeading img{width:25px;height:25px;object-fit:contain}
.arrowOnly.hasPng{width:54px;height:54px;padding:0}.arrowOnly.hasPng img{width:100%;height:100%;object-fit:contain}

@media(max-width:430px){.studyCard{min-height:100px}.studyIcon.hasArtwork{width:92px;height:78px}.assetTab{font-size:14px!important;gap:4px}.assetTab img{width:21px;height:21px}.tabs.threeTabs .assetTab{font-size:13px!important}.option.assetOption{grid-template-columns:43px 1fr 24px;padding:8px 10px}.optionBadge{width:41px;height:41px}.quizHeadIcon{width:42px;height:42px}.quizTitlePng{width:125px;height:50px}}

/* Uiverse-style selector adapted for the textbook and extension learning pages. */
.tabs.radio-inputs.learning-radio-inputs{
position:relative;
display:flex;
flex-wrap:wrap;
border:0;
border-radius:1rem;
background:linear-gradient(145deg,#e6e6e6,#fff);
box-sizing:border-box;
box-shadow:5px 5px 15px rgba(0,0,0,.15),-5px -5px 15px rgba(255,255,255,.8);
padding:.5rem;
width:min(300px,100%);
margin:0 auto 16px;
font-size:14px;
gap:.5rem;
}
.learning-radio-inputs .radio{flex:1 1 0;text-align:center;position:relative;min-width:0}
.learning-radio-inputs .radio input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:2}
.learning-radio-inputs .radio .name{display:flex;cursor:pointer;align-items:center;justify-content:center;min-height:42px;border-radius:.7rem;border:0;padding:.7rem .45rem;color:#2d3748;font-weight:700;font-family:inherit;background:linear-gradient(145deg,#fff,#e6e6e6);box-shadow:3px 3px 6px rgba(0,0,0,.1),-3px -3px 6px rgba(255,255,255,.7);transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease;overflow:hidden;white-space:nowrap;position:relative;isolation:isolate}
.learning-radio-inputs .radio input:checked+.name{background:linear-gradient(145deg,#3b82f6,#2563eb);color:#fff;font-weight:800;text-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:inset 2px 2px 5px rgba(0,0,0,.2),inset -2px -2px 5px rgba(255,255,255,.1),3px 3px 8px rgba(59,130,246,.3);transform:translateY(2px)}
.learning-radio-inputs .radio:hover .name{background:linear-gradient(145deg,#f0f0f0,#fff);transform:translateY(-1px);box-shadow:4px 4px 8px rgba(0,0,0,.1),-4px -4px 8px rgba(255,255,255,.8)}
.learning-radio-inputs .radio:hover input:checked+.name{background:linear-gradient(145deg,#3b82f6,#2563eb);transform:translateY(1px)}
.learning-radio-inputs .radio input:focus-visible+.name{outline:3px solid rgba(37,99,235,.35);outline-offset:3px}
.learning-radio-inputs .radio .name::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.5) 0%,transparent 50%);opacity:0;pointer-events:none}
.learning-radio-inputs .radio input:checked+.name::before{display:none}
.learning-radio-inputs .radio .name::after{content:"";position:absolute;inset:-2px;border-radius:inherit;padding:2px;background:linear-gradient(45deg,rgba(96,165,250,.62),rgba(37,99,235,.62));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;pointer-events:none}
.learning-radio-inputs .radio input:checked+.name::after{display:none}
@media(max-width:360px){.tabs.radio-inputs.learning-radio-inputs{width:100%;padding:.4rem;gap:.4rem}.learning-radio-inputs .radio .name{font-size:13px;padding:.65rem .3rem}}
@media(prefers-reduced-motion:reduce){.learning-radio-inputs .radio .name,.learning-radio-inputs .radio input:checked+.name,.learning-radio-inputs .radio input:checked+.name::before,.learning-radio-inputs .radio input:checked+.name::after{animation:none!important;transition:none!important}.learning-radio-inputs .radio input:checked+.name::after{opacity:.72}}

/* V5.28 · 柔和、克制的全站按钮动态反馈。 */
button,[role="button"]{transition:transform .16s ease,filter .16s ease,box-shadow .16s ease}
button.ui-soft-pressed,[role="button"].ui-soft-pressed{transform:scale(.975);filter:brightness(.985)}
button:focus-visible,[role="button"]:focus-visible{outline:3px solid rgba(33,145,232,.28);outline-offset:3px}
@media(prefers-reduced-motion:reduce){button,[role="button"]{transition:none!important}.ui-soft-pressed{transform:none!important}}

/* V6.62 cross-device layout and narrow portrait hardening. */
.sentenceAudioBtn{flex:0 0 auto}
.home-screen,.home-screen body,.home-screen #app{min-height:100%;background:#1499ef}.home-screen body,.home-screen #app,.home-screen .home{min-height:var(--app-h);min-height:var(--app-h)}.home-screen .home{overflow:hidden}.home-screen .homeCanvas{height:100vh;height:var(--app-h)}
.item>div:nth-child(2){min-width:0}
.word,.sentence,.zh{overflow-wrap:anywhere}
.learnBody,.unitWrap,.quizBody{padding-bottom:max(28px,var(--sab))}

@media(max-width:699px) and (orientation:portrait){
  .home{min-height:var(--app-h)}
  .homeCanvas{height:100vh;height:var(--app-h);min-height:620px}
  .homePicture,.homeImg{width:100%;height:100%}
  .homeImg{object-fit:fill;object-position:center top}
  .item{grid-template-columns:32px minmax(0,1fr) 42px;gap:7px;padding:10px 8px}
  .itemNo{width:29px;height:29px}
  .playBtn{width:40px;height:40px}
  .playBtn svg{width:20px;height:20px}
  .wordTop{gap:5px 8px}
  .word{font-size:17px}
  .phon{font-size:13px}
  .sentence{font-size:15px;line-height:1.5}
  .zh{font-size:13px;line-height:1.45}
  .controls{align-items:flex-start}
}

@media(orientation:landscape) and (max-height:600px){
  .home,.homeCanvas{height:100vh;height:var(--app-h);min-height:0}
  .homePicture,.homeImg{width:100%;height:100%}
  .homeImg{object-fit:fill}
  .learnBody{padding-left:max(16px,var(--sal));padding-right:max(16px,var(--sar))}
  .item{min-height:62px;padding-top:8px;padding-bottom:8px}
}

@media(min-width:700px) and (orientation:portrait){
  .home,.homeCanvas{height:100vh;height:var(--app-h);min-height:0}
  .homePicture,.homeImg{width:100%;height:100%}
  .homeImg{object-fit:fill}
}

@media(min-width:900px) and (min-height:601px) and (orientation:landscape){
  .home,.homeCanvas{height:100vh;height:var(--app-h);min-height:0}
  .homePicture,.homeImg{width:100%;height:100%}
  .homeImg{object-fit:fill}
}

@supports not (height:var(--app-h)){
  @media(max-width:699px) and (orientation:portrait){.homeCanvas{height:100vh}.home{min-height:var(--app-h)}}
}