/* gk3500 ui297 · presentation-only overlay (see docs/ui297-界面优化交接说明.md).
   No learning data, scoring, sync or storage behaviour lives here. */
:root{--ui-paper:#F8F3EB;--ui-canvas:#F3EFE7;--ui-white:#FFFDF8;--ui-ink:#242115;--ui-muted:#8B8374;--ui-line:#E5DCCD;--ui-olive:#625C3B;--ui-olive-dark:#4D4830;--ui-soft:rgba(98,92,59,.13);--ui-top:52px;--ui-tab-h:58px}

/* ---------- 1. Duplicate in-page search (global search covers it) ---------- */
html.ui-page-grouped .topbar-inner>input#search,
html.ui-page-reference .topbar-inner>input#search{display:none!important}

/* ---------- 2. Guide button: no longer floats over content ---------- */
html.ui-page-home #guideLaunch,html.ui-page-guide #guideLaunch{display:none!important}
.ui-guide-btn{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 14px;border-radius:999px;border:1px solid #d7ccb8;background:var(--ui-white);color:var(--ui-olive-dark);font:650 14px/1 -apple-system,"PingFang SC","Microsoft YaHei",sans-serif;cursor:pointer;flex:0 0 auto}
.ui-guide-btn:hover{border-color:var(--ui-olive);background:#fff}
.ui-guide-btn:focus-visible{outline:3px solid #8b9875;outline-offset:2px}
.ui-guide-q{display:none}
nav.course-topbar .course-home-short{display:none}
.topbar-inner>.ui-guide-btn{order:99}

/* ---------- 3. Learning surfaces: solid paper instead of painting ---------- */
html.ui-page-grouped body,html.ui-page-reference body,html.ui-page-assessment body{background:var(--ui-canvas)!important}
html.ui-page-grouped .group-section,html.ui-page-reference .group-section{background:#FBF8F1!important}
html.ui-page-grouped .compact-card{background:var(--ui-white)!important}
html.ui-page-grouped .usage-example{background:#FBF7EE!important}

/* ---------- 4. Word card: rating moved under the core meaning ---------- */
.review-mark-group.ui-mark-moved{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 2px}
.ui-dup-meaning{display:none!important}

/* ---------- 5. Home: per-unit progress ---------- */
.ui-unit-progress{display:flex;align-items:center;gap:10px;margin:10px 0 12px;font-size:13px;color:var(--ui-muted);position:relative;z-index:2}
.ui-unit-progress .ui-bar{flex:1;height:6px;border-radius:999px;background:rgba(98,92,59,.12);overflow:hidden}
.ui-unit-progress .ui-bar i{display:block;height:100%;border-radius:inherit;background:var(--ui-olive);min-width:0;transition:width .3s}
.ui-unit-progress .ui-txt{white-space:nowrap;font-variant-numeric:tabular-nums}
.ui-unit-progress.is-started .ui-txt{color:var(--ui-olive-dark);font-weight:650}

/* ---------- 6. Family maps inline ---------- */
.group-map.ui-has-thumb{flex-wrap:wrap}
.ui-map-thumb{display:block;flex:1 0 100%;order:9;margin:12px 0 2px;padding:0;border:1px solid var(--ui-line);border-radius:10px;background:var(--ui-white);overflow:hidden;cursor:zoom-in;max-height:360px;position:relative}
.ui-map-thumb img{display:block;width:100%;height:auto}
.ui-map-thumb::after{content:"点开看大图";position:absolute;right:10px;bottom:10px;padding:5px 10px;border-radius:999px;background:rgba(36,33,21,.72);color:#fff;font-size:12px;font-weight:650}
.ui-map-thumb:focus-visible{outline:3px solid #8b9875;outline-offset:2px}
.map-gallery.ui-map-gallery{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.map-gallery.ui-map-gallery a.map-chip{display:flex!important;flex-direction:column;gap:8px;padding:8px!important;border-radius:10px;height:auto!important;white-space:normal}
.map-gallery.ui-map-gallery a.map-chip img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:6px;background:var(--ui-paper)}
.ui-lightbox{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;background:rgba(20,20,19,.86)}
.ui-lightbox[hidden]{display:none}
.ui-lightbox-head{display:flex;align-items:center;gap:10px;padding:10px 12px calc(10px);padding-top:max(10px,env(safe-area-inset-top));color:#fff}
.ui-lightbox-head strong{flex:1;min-width:0;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-lightbox-head a,.ui-lightbox-head button{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:14px;display:inline-flex;align-items:center;text-decoration:none;cursor:pointer}
.ui-lightbox-head .ui-lb-close{width:40px;padding:0;justify-content:center;font-size:20px}
.ui-lightbox-body{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y pinch-zoom;padding:0 12px 24px}
.ui-lightbox-body img{display:block;margin:0 auto;width:100%;max-width:1080px;height:auto;border-radius:8px;background:#fff}
.ui-lightbox.is-zoomed .ui-lightbox-body img{width:auto;max-width:none}
html.ui-lock,html.ui-lock body{overflow:hidden!important}

/* ---------- 7. Notebook: empty state only ---------- */
html.ui-nb-empty .nb-panel .filter-row,html.ui-nb-empty #listCount{display:none!important}

/* ---------- 8. Bottom tab bar (phones) ---------- */
.ui-tabbar{display:none}

/* ---------- 9. Desktop learning layout ---------- */
@media (min-width:1100px){
  html.ui-page-grouped .layout{grid-template-columns:minmax(220px,260px) minmax(0,1fr) minmax(180px,210px)!important}
  html.ui-page-grouped .sidebar a,html.ui-page-grouped .sidebar button{white-space:normal!important;text-overflow:clip!important}
  html.ui-page-grouped .sidebar a *,html.ui-page-grouped .sidebar button *{white-space:normal!important;text-overflow:clip!important}
}

/* ================= Phones ================= */
@media (max-width:760px){
  html.ui-has-tabbar body{padding-bottom:calc(var(--ui-tab-h) + env(safe-area-inset-bottom))!important}
  /* one-row top bar */
  nav.course-topbar .topbar-inner{flex-wrap:nowrap!important;align-items:center;gap:8px!important;min-height:52px;padding:6px 12px!important}
  nav.course-topbar .course-home-link{flex:0 0 auto;white-space:nowrap}
  nav.course-topbar .course-home-full{display:none!important}
  nav.course-topbar .course-home-short{display:inline!important}
  nav.course-topbar .course-directory-button,
  nav.course-topbar .course-video-nav,
  nav.course-topbar .gk-notebook-link,
  nav.course-topbar .course-quick-access{display:none!important}
  nav.course-topbar .course-breadcrumb{display:block!important;flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:var(--ui-muted);order:2}
  nav.course-topbar .gk-search-trigger{order:3;flex:0 0 40px!important;width:40px!important;min-width:40px!important;height:40px;padding:0!important;font-size:0!important;justify-content:center;border-radius:999px!important;margin-left:auto}
  nav.course-topbar .ui-guide-btn{order:4}
  .ui-guide-btn{flex:0 0 40px;width:40px;height:40px;min-height:40px;padding:0;font-size:17px;font-weight:700}
  .ui-guide-q{display:inline}.ui-guide-label{display:none}
  .mobile-word-nav{top:var(--ui-top)!important}
  .compact-card,.group-section{scroll-margin-top:calc(var(--ui-top) + 64px)}

  /* tab bar */
  .ui-tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:45;height:calc(var(--ui-tab-h) + env(safe-area-inset-bottom));padding:0 4px env(safe-area-inset-bottom);background:rgba(251,248,241,.97);border-top:1px solid var(--ui-line);box-shadow:0 -6px 18px rgba(36,33,21,.06);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
  .ui-tabbar a,.ui-tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;border:0;background:none;color:#8C8578;font:600 11px/1.1 -apple-system,"PingFang SC","Microsoft YaHei",sans-serif;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .ui-tabbar svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .ui-tabbar [aria-current="page"]{color:var(--ui-olive)}
  .ui-tabbar [aria-current="page"] svg{stroke-width:2.1}
  .ui-tabbar a:focus-visible,.ui-tabbar button:focus-visible{outline:2px solid var(--ui-olive);outline-offset:-4px;border-radius:10px}
  .gk-notebook-status{bottom:calc(var(--ui-tab-h) + 12px + env(safe-area-inset-bottom))!important}

  /* larger touch targets */
  .review-mark-group .review-mark-btn{min-height:44px!important;min-width:64px;padding:0 14px!important;font-size:14px!important}
  .compact-title-row>.audio-btn{width:44px!important;height:44px!important;min-width:44px}

  /* flatter learning cards */
  html.ui-page-grouped main{margin:0 10px!important}
  html.ui-page-grouped .group-section{padding:16px 0!important;border:0!important;background:transparent!important;box-shadow:none!important;margin:18px 0 22px!important}
  html.ui-page-grouped .group-header,html.ui-page-grouped .group-learning,html.ui-page-grouped .group-map{margin-left:4px;margin-right:4px}
  html.ui-page-grouped .compact-card{padding:16px 14px!important;margin:12px 0!important;box-shadow:0 1px 0 rgba(255,255,255,.8),0 4px 14px rgba(36,33,21,.04)}
  html.ui-page-grouped .compact-head{grid-template-columns:28px minmax(0,1fr)!important}
  html.ui-page-grouped .learning-block{border-left:0!important;padding:14px 0 4px!important;margin-top:14px!important;border-top:1px solid var(--ui-line)!important}
  html.ui-page-grouped .sense-usage-group{padding:12px 0!important}
  html.ui-page-grouped .usage-example{padding:12px 13px!important;border:0!important;border-radius:8px}

  /* home: compact hero, units */
  html.ui-page-home header.hero{padding:18px 18px 16px!important;min-height:0!important}
  html.ui-page-home .hero-collage{display:none!important}
  html.ui-page-home header.hero h1{margin-top:6px}
  html.ui-page-home .course-unit-card{padding:14px 14px 12px!important}
  html.ui-page-home .course-unit-card .course-topic{margin:6px 0 2px!important;font-size:21px!important}
  html.ui-page-home .course-unit-card .links a{min-height:44px}

  /* assessment: consistent edges, one header */
  html.ui-page-assessment body>header.site-nav{display:none!important}
  html.ui-page-assessment main#pageShell{padding-left:14px!important;padding-right:14px!important}
  html.ui-page-assessment main#pageShell .hero h1{font-family:"Smiley Sans","得意黑","PingFang SC","Microsoft YaHei",sans-serif!important;font-size:30px!important;line-height:1.1!important}

  /* notebook: same top bar feel */
  html.ui-page-notebook header.nb-top{position:sticky;top:0;z-index:50;min-height:52px;background:rgba(248,243,235,.95);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--ui-line)}
  html.ui-page-notebook header.nb-top>a:not(.brand){display:none!important}
  html.ui-page-notebook header.nb-top .gk-search-trigger{width:40px!important;min-width:40px!important;height:40px;padding:0!important;font-size:0!important;justify-content:center;border-radius:999px!important;margin-left:auto}
}
@media (prefers-reduced-motion:reduce){.ui-unit-progress .ui-bar i{transition:none}}
@media (max-width:760px){
  nav.course-topbar .gk-search-trigger::before,nav.course-topbar .gk-search-trigger::after,
  html.ui-page-notebook header.nb-top .gk-search-trigger::before,html.ui-page-notebook header.nb-top .gk-search-trigger::after{display:none!important}
  nav.course-topbar .gk-search-trigger,html.ui-page-notebook header.nb-top .gk-search-trigger{background:#FFFDF8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234D4830' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cpath d='m15 15 5 5'/%3E%3C/svg%3E") center/20px 20px no-repeat!important;border:1px solid #d7ccb8!important}
}
@media (max-width:760px){html.ui-page-grouped .compact-head+.learning-block{border-top:0!important;padding-top:6px!important}}
.group-map.ui-has-thumb>.ui-map-thumb{grid-column:1/-1;width:100%;justify-self:stretch}
@media (max-width:760px){html.ui-page-notebook header.nb-top .gk-search-trigger{flex:0 0 40px!important;max-width:40px!important}}