/* Daywake product visuals and the bilingual landing page's section compositions. */
.nav__logo img { width: 32px; height: 32px; border-radius: var(--r-sm); }
.nav__logo { white-space: nowrap; }
.nav__toggle svg { display: block; }
.hero__proof { margin-top: var(--s-5); }
.hero__art { background: #e2ebe3; }
.hero__art .product-window { padding-right: var(--ly-cut-room); min-height: 100%; }
.product-window { color: #243832; background: #f2f6ef; border: 1px solid #d2dfd4; border-radius: var(--r-lg); overflow: clip; }
.window-bar { display: flex; align-items: center; gap: var(--s-4); padding: var(--s-3) var(--s-5); background: #e8efe6; border-bottom: 1px solid #d2dfd4; font-size: var(--t-small); }
.window-dots { display: flex; gap: var(--s-2); }
.window-dots i { width: 8px; height: 8px; border-radius: 50%; background: #cc6962; }
.window-dots i:nth-child(2) { background: #c8a758; }
.window-dots i:nth-child(3) { background: #7ca072; }
.window-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); min-height: 0; }
.window-sidebar { background: #e8efe6; padding: var(--s-4); display: grid; align-content: start; gap: var(--s-2); font-size: var(--t-small); }
.window-sidebar > * { border-radius: var(--r-sm); padding: var(--s-2); text-align: left; white-space: nowrap; border: 0; color: inherit; background: transparent; font: inherit; }
.window-sidebar .is-current, .window-sidebar button[aria-pressed="true"] { background: #d4e3d8; color: #235c4d; font-weight: 500; }
.window-sidebar button { cursor: pointer; }
.window-sidebar button:hover { background: #dce8db; }
.window-content { min-width: 0; padding: var(--s-5); }
.window-content h3 { font-size: var(--t-card); margin: 0 0 var(--s-4); letter-spacing: -.02em; color: inherit; }
.window-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); margin-bottom: var(--s-4); }
.window-metrics > div, .window-chart, .window-list, .window-clock { min-width: 0; background: #fff; padding: var(--s-4); border: 1px solid #dbe5dc; border-radius: var(--r-md); }
.window-metrics dt, .window-chart figcaption { color: #526a61; font-size: var(--t-label); }
.window-metrics dd { font-family: var(--font-mono); font-size: clamp(18px, 2vw, 28px); margin: var(--s-1) 0 0; white-space: nowrap; }
.window-chart { margin: 0; }
.window-chart figcaption { margin-bottom: var(--s-3); }
.window-bars { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--s-2); align-items: end; height: clamp(78px, 16svh, 150px); border-bottom: 1px solid #b8cbbd; padding: 0 var(--s-2); }
.window-bars i { height: var(--level); border-radius: 4px 4px 0 0; background: #a5c1ac; }
.window-bars i:last-child { background: #397064; }
.window-chart-labels { display: flex; justify-content: space-between; color: #526a61; font-size: var(--t-label); margin-top: var(--s-2); }
.window-list { display: grid; gap: var(--s-3); }
.window-list label { display: flex; align-items: center; gap: var(--s-3); }
.window-list input { accent-color: #397064; }
.window-list input:checked + span { text-decoration: line-through; color: #526a61; }
.window-clock { display: grid; place-items: center; gap: var(--s-4); min-height: 200px; font: 400 clamp(32px, 5vw, 64px)/1 var(--font-mono); }
.window-clock .btn { font: 500 14px/1.2 var(--font-text); }
.window-note { color: #29463d; background: #f8fcf7; border: 1px solid #d2dfd4; box-shadow: 0 12px 36px #15362d24; border-radius: var(--r-md); padding: var(--s-4) var(--s-5); left: var(--s-6); bottom: var(--s-6); width: min(280px, 75%); font-size: var(--t-small); }
.window-note span { display: block; margin-top: var(--s-2); color: #526a61; }
.section-intro { margin: var(--s-3) 0 var(--s-7); max-width: 58ch; }
.demo-frame { min-height: min(485px, 53svh); }
.demo-frame .window-body { min-height: min(435px, 47svh); }
.demo-frame .window-sidebar { padding: var(--s-5); }
.demo-frame .window-content { padding: var(--s-6); }
.demo-frame .window-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.demo-frame .window-bars { height: clamp(80px, 18svh, 190px); }
.feature-layout { align-items: start; }
.feature-visual { position: relative; min-width: 0; margin: 0; min-height: clamp(280px, 49svh, 540px); padding: var(--s-5); border-radius: var(--r-lg); display: grid; align-items: center; background: #e2ebe3; overflow: clip; }
.feature-visual > img { position: relative; z-index: 1; width: 100%; height: auto; border-radius: var(--r-md); border: 1px solid #cbd8ce; box-shadow: 0 12px 28px #15362d1a; }
.feature-layout .feature-copy { padding-top: var(--s-5); }
.feature-list { list-style: none; padding: 0; margin: 0; }
.feature-list li { padding: var(--s-4) 0; border-bottom: 1px solid var(--line); }
.feature-list strong { display: block; margin-bottom: var(--s-1); font-size: var(--t-card); }
.feature-list span { display: block; line-height: 1.5; }
.tool-line { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); margin-top: var(--s-5); font-size: var(--t-small); }
.tool-line span { display: inline-flex; align-items: center; gap: var(--s-2); }
.tool-line img { width: 20px; height: 20px; object-fit: contain; }
.plan-grid > .card, .download-grid > .card { grid-column: span 4; display: flex; flex-direction: column; align-items: flex-start; padding: var(--s-6); }
.plan-grid > .card { min-height: 292px; }
.plan-grid h3, .download-grid h3 { margin: 0 0 var(--s-3); }
.plan-grid p, .download-grid p { margin: 0 0 var(--s-5); }
.plan-grid ul { padding-left: 1.1em; margin: 0; }
.plan-grid li { margin: var(--s-2) 0; }
.member-actions { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-top: var(--s-5); }
.member-note { margin: var(--s-4) 0 0; font-size: var(--t-small); }
.download-grid > .card { min-height: 250px; }
.download-grid .btn { margin-top: auto; }
.download-links { display: flex; flex-wrap: wrap; gap: var(--s-4) var(--s-5); margin-top: var(--s-6); }
.download-spec { font: 400 var(--t-small)/1.6 var(--font-mono); }
.info-dialog { color: var(--ink); background: var(--bg); width: min(520px, calc(100% - 32px)); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--s-6); }
.info-dialog::backdrop { background: #16282270; }
.info-dialog h2 { font-size: var(--t-h3); margin: 0 0 var(--s-4); }
.info-dialog form { margin-top: var(--s-5); }
.close--word .wordmark { font: var(--display-weight) clamp(76px, 17vw, 240px)/.9 var(--font-display); letter-spacing: -.07em; margin: var(--s-4) 0 0; }
.footer__legal button { background: transparent; color: inherit; border: 0; padding: 0; font: inherit; cursor: pointer; }
[hidden] { display: none !important; }
@media (min-width: 1024px) {
  .hero--collage .hero__text { align-self: center; }
  .feature-visual { margin-top: calc(-1 * var(--s-4)); }
}
@media (max-width: 1023px) {
  .feature-layout > * { grid-column: 1 / -1; }
  .feature-layout .feature-copy { padding-top: 0; }
  .feature-visual { min-height: 260px; }
  .plan-grid > .card, .download-grid > .card { padding: var(--s-5); }
}
@media (max-width: 639px) {
  .hero__art .window-sidebar { display: none; }
  .hero__art .window-body { grid-template-columns: 1fr; }
  .hero__art .window-content { padding: var(--s-4); }
  .hero__art .window-metrics > div { padding: var(--s-3); }
  .section-intro { margin-bottom: var(--s-6); }
  .demo-frame { min-height: 0; }
  .demo-frame .window-body { display: block; min-height: 0; }
  .demo-frame .window-sidebar { grid-template-columns: repeat(4, minmax(0, 1fr)); padding: var(--s-2); gap: 0; }
  .demo-frame .window-sidebar button { font-size: var(--t-label); text-align: center; }
  .demo-frame .window-content { padding: var(--s-4); }
  .demo-frame .window-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .demo-frame .window-metrics > div:nth-child(3) { display: none; }
  .feature-visual { min-height: 224px; padding: var(--s-3); }
  .feature-list li { padding: var(--s-3) 0; }
  .plan-grid > .card, .download-grid > .card { grid-column: 1 / -1; min-height: 0; }
  .plan-grid > .card { padding: var(--s-4); }
  .plan-grid h3 { font-size: var(--t-card); margin-bottom: var(--s-1); }
  .plan-grid p, .download-grid p { margin-bottom: var(--s-3); }
  .plan-grid li { margin: 0; }
  .download-grid h3 { font-size: var(--t-card); margin-bottom: var(--s-1); }
  .download-grid > .card { padding: var(--s-4); }
  .download-grid .btn { width: 100%; }
  .member-actions { gap: var(--s-2); }
  .member-actions .btn { flex: 1 1 auto; padding-inline: var(--s-3); }
  .download-links { margin-top: var(--s-4); }
}
@media (max-width: 420px) and (max-height: 750px) {
  .hero__proof { margin-top: var(--s-3); }
  .hero__art { margin-top: var(--s-4); min-height: 176px; }
  .hero__art .window-chart { display: none; }
}

/* Keep the keyboard-only shortcut out of the header layout until focused. */
.skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: absolute; top: var(--s-4); left: var(--gut); z-index: 2; background: var(--bg); padding: var(--s-3); }
.hero__art .window-metrics dd { font-size: clamp(16px, 1.5vw, 22px); }
@media (min-width: 1024px) {
  .hero--collage .hero__text { align-self: start; }
}
@media (max-width: 639px) {
  .hero__art .window-bars { height: 76px; }
  .hero__art .window-content h3, .hero__art .window-metrics { margin-bottom: var(--s-2); }
  .hero__art .window-chart { padding: var(--s-3); }
}

@media (min-width: 640px) {
  .plan-grid > .card, .download-grid > .card { min-height: clamp(272px, 39svh, 442px); }
}
@media (max-width: 639px) {
  .download-grid p { margin-bottom: var(--s-2); }
}

.purchase-return > .wrap { padding-block: clamp(48px, 12svh, 120px); }
.purchase-return h1 { margin-top: var(--s-7); }
.purchase-return p { max-width: 58ch; }
.purchase-return .btn-row { margin-top: var(--s-6); }

/* The download icons identify the operating-system rows at a glance. */
.platform-icon { display: block; margin-bottom: var(--s-4); color: var(--action); }
.download-grid .btn { margin-top: var(--s-3); }
.window-bars { display: block; width: 100%; padding: 0; }
.window-bars rect { fill: #a5c1ac; }
.window-bars rect:last-child { fill: #397064; }
.hero__art .window-metrics > div { background: transparent; border: 0; border-radius: 0; padding: var(--s-2) 0; }
.hero__art .window-chart { background: transparent; border: 0; padding-inline: 0; }
.hero--collage .hero__text > h1:first-child { text-box: normal; }
.feature-layout .feature-copy { padding-top: 0; }
.feature-visual { margin-top: 0; }
@media (min-width: 640px) and (max-width: 1023px) {
  .nav__toggle { margin-inline-end: 0; }
  .demo-frame { min-height: min(570px, 49svh); }
}
@media (max-width: 639px) {
  .platform-icon { width: 24px; height: 24px; margin-bottom: 0; }
  .download-grid > .card { display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: var(--s-3); align-items: center; }
  .download-grid .card > p, .download-grid .card > .btn { grid-column: 2; }
  .tool-line { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 640px) and (max-height: 820px) {
  .demo-frame, .demo-frame .window-body { min-height: 0; }
  .demo-frame .window-content { padding: var(--s-4); }
  .demo-frame .window-bars { height: 86px; }
}
@media (max-width: 639px) {
  #downloads .section-intro { margin-bottom: var(--s-4); }
  .download-grid > .card { padding: var(--s-3) var(--s-4); }
}

@media (max-width: 639px) {
  .hero .btn-row { margin-top: var(--s-5); }
  .hero__proof { margin-top: var(--s-4); }
  .hero__art { margin-top: var(--s-5); }
  .member-actions .btn { width: auto; flex: 1 1 0; }
  .member-note { margin-top: var(--s-2); }
  .download-grid .card > .btn { margin-top: var(--s-2); }
  .download-links { gap: var(--s-3) var(--s-4); }
}

html[lang="zh-CN"] .hero h1 { word-break: keep-all; overflow-wrap: anywhere; }

/* The shared frame supplies its edge treatment; the app keeps its own chrome and panes. */
.demo-frame.frame { display: block; padding: 0; }
.demo-frame .window-metrics > div { background: transparent; border: 0; border-radius: 0; padding: var(--s-2) 0; }
.demo-frame .window-metrics > div + div { border-inline-start: 1px solid #dbe5dc; padding-inline-start: var(--s-3); }