/* V3.9 UI adapter. Visual authority: chenzao/DESIGN.md (2026-09-14+).
   Canvas geometry, scheduling and state remain in the existing modules. */
:root {
  color-scheme:light;
  --nav-max-width:354px; --nav-gutter:18px;
  --floating-right:max(var(--nav-gutter),calc((100% - var(--nav-max-width))/2));
  --font-ui:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
  --font-brand:"Songti SC","STSong","SimSun",serif;
  --brand:#d70050; --ink:#272722; --sub:#706d65; --line:#e1ded6;
  --cream:#f8f7f3; --surface:#fffdf9; --green:#252522; --red:var(--brand);
  --blush:#f7edf0; --selected:#252522; --track:#eae8e5;
  --radius-module:20px; --radius-control:12px; --page-gutter:18px;
  --text-page:24px; --text-section:20px; --text-card:16px; --text-body:14px; --text-small:12px;
  --brand-wash:radial-gradient(ellipse at 100% 0%,rgba(215,0,80,.10) 0%,rgba(215,0,80,.025) 32%,transparent 65%),radial-gradient(ellipse at 96% 12%,#f0e5f1 0%,transparent 47%),radial-gradient(ellipse at 76% 0%,#fff0d9 0%,transparent 57%),#f8f7f3;
  --schedule-rose:radial-gradient(ellipse at 100% 0%,#fbe3ec 0%,rgba(251,227,236,.85) 18%,transparent 68%),radial-gradient(ellipse at 94% 94%,#d70050 0%,rgba(215,0,80,.8) 22%,transparent 72%),radial-gradient(ellipse at 4% 8%,#f3aec9 0%,transparent 68%),linear-gradient(110deg,#fbe3ec 0%,#f3aec9 100%);
}
body{background:#eae8e2;font:400 var(--text-body)/22px var(--font-ui);color:var(--ink)}
button,input,select,textarea{font-family:var(--font-ui);letter-spacing:0}
button{color:inherit;-webkit-tap-highlight-color:transparent}
button:disabled{cursor:default}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[contenteditable]:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
::selection{background:#f7d4e1;color:var(--ink)}
.shell{width:min(390px,100%);background:var(--cream);box-shadow:none}
.body{padding:8px var(--page-gutter) calc(120px + env(safe-area-inset-bottom))}
.shell[data-page="main"] .top{display:none}
.shell[data-page="main"] .body{padding-top:max(16px,env(safe-area-inset-top))}
.top{height:54px;padding:0 18px;background:#f8f7f3ed;border-color:var(--line)}
.top .brand{font-size:14px;font-weight:600;letter-spacing:0}
.top .back{width:44px;height:44px;font-size:30px;color:var(--ink)}
.top .tiny{font-size:10px}
h1,.h1{font:600 var(--text-page)/34px var(--font-ui);letter-spacing:0}
h2{font:600 var(--text-section)/28px var(--font-ui);letter-spacing:0}
h3{font:500 var(--text-card)/24px var(--font-ui);letter-spacing:0}
.hero{padding:20px 0 16px;background:none}
.hero .h1{margin:6px 0 8px}
.hero .eyebrow{font-size:11px;font-weight:500;letter-spacing:.12em;color:var(--sub)}
.lead,.hint,.card p,.note{font-size:var(--text-body);line-height:22px;color:var(--sub)}
.tiny,.sub,.date,.muted{font-size:var(--text-small);line-height:18px;color:var(--sub)}
.v39-hero{margin:-16px -18px 0;padding:32px 18px 18px;background:var(--brand-wash)}
.v39-hero .eyebrow{font-size:28px;line-height:34px;font-weight:400;letter-spacing:0;color:var(--ink)}
.v39-hero .h1{font:600 27px/40.5px var(--font-brand);margin:8px 0 14px}
.v39-hero .lead{margin:0;font-size:12px;line-height:18px}
.seg,.seg.wish-switch{background:var(--track);border-radius:999px;padding:3px;gap:3px;margin:16px 0 24px}
.seg button,.seg.wish-switch button{min-height:38px;padding:9px 8px;border-radius:999px;color:var(--sub);font-size:13px;line-height:18px;font-weight:400}
.seg .sel,.seg.wish-switch button.sel{color:var(--surface);background:var(--selected);box-shadow:none;font-weight:600}
.btn{min-height:44px;padding:12px 18px;font-size:14px;line-height:20px;font-weight:500;background:var(--selected);box-shadow:none}
.btn.red{background:var(--brand)}
.btn.green{background:var(--selected)}
.btn.line{background:transparent;border-color:var(--line);color:var(--ink)}
.btn.light{background:var(--track);color:var(--ink)}
.btn.sm{min-height:44px;padding:10px 14px;font-size:13px}
.link{min-height:44px;padding:10px 0;font-size:12px;line-height:20px;color:var(--sub)}
.card{margin:16px 0;padding:18px;border:1px solid var(--line);border-radius:var(--radius-module);background:var(--surface);box-shadow:none}
.card p{margin:8px 0}
.card .btn.full + .btn.full{margin-top:10px}
.row{gap:12px}
.row>div{min-width:0}
.vb-section-head{align-items:center;margin:0 0 16px}
.vb-section-head .tiny{margin-top:4px}
.vb-section-head>.btn{flex-shrink:0}

/* Existing 1080 x 1920 canvas and all editing controls retain their behavior. */
.v40-board{border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:none;padding:8px}
.v40-board canvas{border-radius:12px}
.v40-direct-hint,.v40-board-feedback{font-size:12px;line-height:18px;color:var(--sub)}
.v40-toolbar{gap:8px;grid-template-columns:repeat(2,minmax(0,1fr));margin:16px 0 24px}
.v40-toolbar .btn{min-height:44px;padding:10px 4px;font-size:12px;line-height:20px}
.v40-editor{border-color:var(--line);background:var(--surface);border-radius:20px;padding:18px}
.v40-editor h3{font:600 20px/28px var(--font-ui);color:var(--ink)}
.v40-editor>p,.v40-section>p{font-size:12px;line-height:18px;color:var(--sub)}
.v40-section{border-color:var(--line);padding:18px 0}
.v40-section>b{font-size:14px;line-height:22px;font-weight:500;color:var(--ink)}
.v40-section select,.v40-section textarea{min-height:44px;border-color:var(--line);border-radius:12px;font-size:14px;line-height:22px;color:var(--ink)}
.v40-template-row button,.v40-header-controls button,.v40-inline-edit{min-height:44px;background:var(--cream);color:var(--ink);border-color:var(--line);border-radius:12px;font-size:12px}
.v40-template-row button.active{background:var(--selected);color:var(--surface);border-color:var(--selected);font-weight:500}
.v40-switches label,.v40-word-edit label,.v40-select-list label{color:var(--ink);font-size:13px;line-height:20px;min-height:36px}
input[type="checkbox"],input[type="radio"],.v40-switches input,.v40-word-edit input,.v40-select-list input{accent-color:var(--brand)}
.v40-list-row{flex-wrap:wrap;background:var(--cream);border-radius:12px;gap:6px;padding:8px}
.v40-row-title{flex-basis:calc(100% - 54px);color:var(--ink);font-size:13px}
.v40-list-row button{min-width:36px;min-height:36px;background:var(--track);color:var(--ink);font-size:12px;padding:6px 9px}
.v40-select-list label small{color:var(--sub);font-size:12px;white-space:normal}
.v40-pending{background:#fff0d9;border-color:#e6d9bc;font-size:13px;line-height:22px}
.v40-pending button{color:var(--ink);min-height:44px;font-size:13px}

/* Discovery and personal wishes. */
.vision-wishes-head{margin-top:24px}
.wish-h-list{gap:12px;margin-top:12px}
.wish-h-row,.wish-h-row.no-photo{padding:12px;border-color:var(--line);background:var(--surface);border-radius:20px;box-shadow:none;gap:14px}
.wish-h-row.no-photo{padding:18px}
.wish-h-title{font-size:16px;font-weight:500;line-height:24px;color:var(--ink)}
.wish-h-meta,.wish-h-hint,.wish-h-word-mark{font-family:var(--font-ui);font-size:12px;line-height:18px;color:var(--sub);letter-spacing:0}
.wish-h-state,.status{font-size:12px;line-height:18px;padding:4px 9px;color:#40523a;background:#eef2ea}
.wish-h-state.waiting,.status.gray{color:var(--sub);background:var(--track)}
.wish-h-state.done,.status.gold{color:#805d2f;background:#fff0d9}
.wish-filter{gap:8px;margin:16px 0}
.wish-filter button{min-height:44px;font-size:13px;line-height:18px;background:var(--track);color:var(--sub)}
.wish-filter button.selected{background:var(--selected);color:var(--surface);font-weight:600}
.v39-pool-head{margin:0 0 16px}
.v39-pool-head h1{font:600 20px/28px var(--font-ui)}
#ideaQuery{height:46px;margin:0 0 24px;background:var(--surface)}
.search-empty{margin:0;padding:24px 18px;border:1px solid var(--line);border-radius:20px;background:var(--surface);font-size:14px;line-height:22px;color:var(--sub);text-align:center}
.v39-recent-head{margin:20px 0 10px}
.v39-recent-head b{font-size:14px;font-weight:500}
.v39-recent-head button{width:36px;height:36px;color:var(--ink);border-color:var(--line);background:transparent}
.v39-recent-card{border-color:var(--line);background:var(--surface);padding:12px;border-radius:20px}
.v39-recent-card b{font-size:16px;line-height:24px;font-weight:500}
.v39-recent-card small,.v39-recent-card em{font-size:12px;line-height:18px;color:var(--sub)}
.v39-text-art{background:var(--blush);color:var(--brand)}
.v39-curated-title{margin:24px 0 16px}
#ideaFalls .v39-reference-card .waterfall-img{border-radius:20px;padding:16px}
#ideaFalls .v39-reference-card .waterfall-img b{font:600 18px/27px var(--font-brand)}
.cover,.v39-cover-card,.course-hero{border-radius:20px}
.cover h1{font:600 24px/34px var(--font-ui)}
.v39-wish-intro{margin:18px 0 24px}
.v39-wish-intro small{color:var(--sub);font-size:12px}
.v39-start-card,.v39-memory-intro{background:var(--brand-wash)}
.v39-memory-intro{padding:18px;border:1px solid var(--line);border-radius:20px;color:var(--ink)}
.v39-memory-intro h2{font:600 20px/28px var(--font-ui)}
.v39-memory-intro p{font-size:14px}
.v37-prog{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:18px}
.v39-metrics{gap:8px}
.v39-metrics div{background:var(--cream);padding:14px 4px}
.v39-metrics strong{color:var(--ink);font-size:30px;line-height:38px;font-weight:500;font-variant-numeric:tabular-nums}
.v39-metrics small,.v39-task-main small,.v39-node small{font-size:12px;line-height:18px;color:var(--sub)}
.v39-task-main b,.v39-node b{font-size:14px;line-height:22px;font-weight:500}
.v39-task-row{flex-wrap:wrap;padding:14px 0;border-color:var(--line)}
.v39-task-row .mini{min-height:36px;padding:8px;font-size:12px;border-radius:10px;color:var(--ink);background:var(--track)}
.v39-task-main{flex-basis:calc(100% - 42px)}
.check{width:24px;height:24px;border:1px solid #918e84;border-radius:6px;background:var(--surface);position:relative}
.check::before{content:"";position:absolute;inset:-10px}
.check.done{background:var(--selected);border-color:var(--selected);color:white}
.v39-node.current{background:#eef2ea;border-radius:12px}
.v39-node.complete{opacity:1}
.v39-node.complete b{color:var(--sub)}
.progress-track{height:5px;background:var(--track)}
.progress-track div{background:var(--selected)}
.v39-linked,.v39-recommend,.v39-course-next{background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:14px}
.v39-linked small,.v39-recommend small,.v39-course-next small{color:var(--sub);font-size:12px;line-height:18px}
.entry{border-color:var(--line)}
.entry>div{min-width:0;flex:1}
.entry p{font-size:14px;line-height:24px;color:var(--ink);overflow-wrap:anywhere}
.entry img{border-radius:12px}
.v39-history-entry{border-color:var(--line);background:var(--surface);color:var(--ink);border-radius:20px}
.v39-history-entry small{color:var(--sub);font-size:12px;line-height:18px}
.v39-history-entry>span:first-child{color:var(--brand)}

/* Calendar positions and durations are intentionally unchanged. */
.date-head{gap:8px;margin:12px 0 8px;align-items:center}
.date-head h1{font:600 21px/32px var(--font-ui)}
.date-head small{color:var(--sub);font-size:12px;white-space:nowrap}
.view-toggle{gap:1px;padding:3px;background:var(--track);flex-shrink:0}
.view-toggle button{padding:6px 10px;min-height:30px;font-size:12px}
.view-toggle button.sel{background:var(--surface);color:var(--ink)}
.shell[data-tab="today"] .body>.lead{font-size:12px;margin:0 0 16px}
.calendarstrip{border-bottom:1px solid var(--line);padding-bottom:8px;gap:2px}
.day{min-width:0;flex:1;padding:7px 0;font-size:12px;color:var(--sub);border-radius:12px}
.day strong{width:32px;height:32px;display:grid;place-items:center;margin:5px auto 0;font-size:16px;font-weight:500;color:var(--ink);border-radius:50%}
.day.sel{background:transparent;color:var(--ink);font-weight:600}
.day.sel strong{background:var(--selected);color:var(--surface)}
.hour-axis{margin-left:42px;border-color:var(--line)}
.hour-line{background:var(--line)}
.hour-label{left:-42px;font-size:12px;color:var(--sub)}
.hour-event{border-radius:4px;padding:8px 10px;box-shadow:none;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:20px 18px;align-content:start;column-gap:8px;row-gap:4px}
.hour-event.official{background:var(--schedule-rose);border:0;border-left:4px solid #ab0040;color:#303030}
.hour-event.event{background:var(--surface);color:var(--ink);border-color:var(--line);border-left-color:#918e84}
.hour-event.course{background:#f0e5f1;color:#483c4b;border-color:#95759f}
.hour-event.habit{background:#eef2ea;color:#40523a;border-color:#79916d}
.hour-event .event-check{grid-column:1/-1;min-width:0}
.hour-event .event-check b{font-size:14px;font-weight:500;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hour-event .event-time,.hour-event .event-origin{font-size:12px;line-height:18px;opacity:1}
.hour-event .event-time{margin:0;white-space:nowrap}
.hour-event .event-origin{min-height:0;margin:0;padding:0;color:inherit;max-width:100%;display:block;text-align:left}
.hour-event .check{width:20px;height:20px;margin-right:1px}
.now-line,.now-line:before{background:var(--brand)}
.floating-add{background:var(--surface);border:1px solid var(--line);color:var(--ink);box-shadow:0 4px 14px #28241d10;bottom:calc(82px + env(safe-area-inset-bottom))}
.hour-help{font-size:12px;line-height:18px;color:var(--sub)}

/* Content, membership and reading share the same semantic type roles. */
.course-head{margin:24px 0 16px}
.course-head p,.course-head span{font-size:12px;line-height:18px;color:var(--sub)}
.course-head span{color:var(--brand)}
.course-list{gap:12px;margin-bottom:24px}
.course-row{gap:14px;padding:14px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:none}
.course-cover{width:96px;height:125px;border-radius:10px}
.course-info h3{font-size:16px;line-height:24px;font-weight:500;color:var(--ink)}
.course-info p,.course-meta small,.member-cost{font-size:12px;line-height:18px;color:var(--sub)}
.course-meta b,.member-cost{color:var(--brand)}
.course-info>small{font-size:12px;color:var(--sub)}
.book{font:500 16px/24px var(--font-ui)}
.course-hero-tag{color:var(--ink);font-size:12px;font-weight:500}
.course-facts{font-size:12px;line-height:18px;color:var(--sub)}
.course-facts span{background:var(--track)}
.course-pay,.course-progress,.lesson-list{border-color:var(--line);border-radius:20px;background:var(--surface)}
.price-large,.member-price{font-size:30px;line-height:38px;font-weight:500;font-variant-numeric:tabular-nums}
.member-price{color:var(--brand)}
.course-pay small,.course-section-title small,.lesson-desc small{font-size:12px;line-height:18px;color:var(--sub)}
.lesson-desc b{font-size:14px;line-height:22px;font-weight:500}
.lesson-number{background:var(--track);color:var(--sub)}
.lesson-number.complete{background:var(--selected);color:white}
.lesson-schedule{color:var(--ink);background:var(--track);min-height:44px;font-size:12px}
.course-link-card{background:#eef2ea;border-radius:20px}
.course-link-card p{font-size:14px;color:var(--sub)}
.v37-study-card{font-size:16px;line-height:28px}
.v37-mine-grid{gap:12px;margin:24px 0}
.v37-mine-link{border-color:var(--line);background:var(--surface);border-radius:20px;padding:20px 18px;font-size:16px;line-height:24px;font-weight:500}
.v37-mine-link small{color:var(--sub);font-size:12px;line-height:18px;margin-top:8px}
.mine-menu-icon{display:inline-flex;width:24px;height:24px;vertical-align:middle;margin-right:10px;color:var(--ink)}
.mine-menu-icon svg{width:24px;height:24px;fill:currentColor}
.shell[data-tab="mine"][data-page="main"] .hero{margin:-16px -18px 0;padding:32px 18px 18px;background:var(--brand-wash)}
.shell[data-tab="mine"][data-page="main"] .body>.card{background:var(--surface);padding:22px 18px}
.shell[data-tab="mine"] .card .status{color:var(--brand);background:var(--blush);margin-bottom:12px}

/* Forms and bottom sheets. */
.field{min-height:46px;border:1px solid var(--line);background:var(--surface);border-radius:12px;color:var(--ink);font-size:14px;line-height:22px;padding:11px 13px}
.field::placeholder{color:var(--sub);opacity:1}
.label{font-size:14px;line-height:22px;font-weight:500;color:var(--ink)}
.modal{background:rgba(30,27,28,.38);padding:0 16px max(16px,env(safe-area-inset-bottom))}
.sheet{width:min(394px,100%);border-radius:20px;border:1px solid var(--line);padding:22px 18px 24px;background:var(--cream);max-height:calc(100dvh - 48px);box-shadow:0 12px 40px #28241d18}
.sheet h2{font:600 20px/28px var(--font-ui);margin:0 0 12px}
.sheet .hint{font-size:14px;line-height:22px}
.sheet>.btn.full{margin-top:10px}
.v39-privacy{padding:14px;background:#f0eeea;border-radius:12px;font-size:14px;line-height:22px}
.v39-privacy small{font-size:12px;line-height:18px;color:var(--sub)}
.v39-cheer{color:#80546a;font-size:12px}
.v39-edit-row{border-color:var(--line);background:var(--surface);padding:12px}
.v39-mini-row button{min-height:36px;min-width:36px;color:var(--ink);background:var(--track);font-size:12px}
.v39-export-choice button{font-size:14px;min-height:44px;color:var(--ink);border-color:var(--line);background:var(--track)}
.v39-export-choice button.selected{background:var(--selected);border-color:var(--selected);color:white}
.v39-export-actions .btn,.v39-manual-actions .btn{font-size:14px}
.bookpage{border-color:var(--line);border-radius:20px;background:var(--surface);box-shadow:none}
.bookpage h2{font:600 20px/28px var(--font-ui);color:var(--ink)}
.bookpage p{font-size:16px;line-height:28px;color:var(--ink)}
.v39-book-line b{font-size:14px;line-height:22px}
.v39-book-line small{color:var(--sub);font-size:12px}
.v39-footnote{font-size:12px;line-height:18px;margin:32px 0 0;color:var(--sub)}
.toast{max-width:calc(100vw - 32px);width:max-content;white-space:normal;text-align:center;font-size:14px;line-height:22px;background:var(--selected);bottom:90px}

/* Reference Phosphor icons and translucent floating navigation. */
.nav{bottom:max(10px,env(safe-area-inset-bottom));width:min(var(--nav-max-width),calc(100% - 2 * var(--nav-gutter)));min-height:56px;padding:4px;gap:0;border:1px solid #ffffffb3;border-radius:999px;background:rgba(255,254,250,.72);backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%);box-shadow:0 5px 24px #28241d10}
.nav button{min-height:46px;gap:3px;padding:3px 0;font-size:12px;line-height:18px;font-weight:400;color:var(--sub)}
.nav button.active{background:#deddd68a;color:var(--ink);font-weight:500}
.nav .ico{margin:0;width:21px;height:21px;line-height:1}
.nav svg{width:21px;height:21px;display:block;fill:currentColor}
@media(max-width:360px){
  .vb-section-head{flex-wrap:wrap}
  .vb-section-head>div{flex:1 1 160px}
  .date-head h1{font-size:20px}
  .date-head small{display:block;line-height:18px}
  .course-cover{width:82px;height:118px}
  .course-row{gap:12px;padding:12px}
  .row{flex-wrap:wrap}
  .v40-toolbar{grid-template-columns:1fr 1fr}
  .v40-toolbar>.btn:first-child{grid-column:auto}
  .v40-header-controls{grid-template-columns:1fr}
  .v39-recommend{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}