/* Clean main screen (html[data-ui=v2], 2026-10-25): Joe, his current answer, then the input. */
html[data-ui="v2"] header { flex-wrap: wrap; row-gap: 10px; }
html[data-ui="v2"] header .tag { font-size: 13px; }
html[data-ui="v2"] .v2nav { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
html[data-ui="v2"] .v2nav > .quiet, html[data-ui="v2"] .v2menu > summary { border: 1px solid var(--line); background: var(--paper); border-radius: 20px; padding: 8px 14px; color: var(--ink); font-size: 14px; cursor: pointer; line-height: 1.3; }
html[data-ui="v2"] .v2menu { position: relative; }
html[data-ui="v2"] .v2menu > summary { list-style: none; }
html[data-ui="v2"] .v2menu > summary::-webkit-details-marker { display: none; }
html[data-ui="v2"] .v2menu:not(#v2Settings) > summary::after { content: " ▾"; color: var(--muted); }
html[data-ui="v2"] .v2menu[open] > summary { border-color: var(--sage); }
html[data-ui="v2"] .v2pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; width: max-content; min-width: 230px; max-width: min(340px, calc(100vw - 32px)); background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 10px; box-shadow: 0 12px 30px #17323833; display: flex; flex-direction: column; gap: 6px; }
html[data-ui="v2"] #v2Practice .v2pop a { display: block; margin: 0; text-align: left; }
html[data-ui="v2"] #v2Lessons .v2pop { max-height: 60vh; overflow: auto; }
html[data-ui="v2"] #v2Lessons #lessonHistory { display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--muted); }
html[data-ui="v2"] #v2Lessons #lessonHistory button { white-space: normal; text-align: left; border-radius: 10px; }
html[data-ui="v2"] #v2Settings .v2pop { width: min(340px, calc(100vw - 32px)); max-height: 70vh; overflow: auto; font-size: 14px; }
html[data-ui="v2"] #v2Settings .toggle { margin: 0; display: flex; gap: 8px; align-items: center; }
html[data-ui="v2"] #v2Settings details { margin-top: 4px; padding-top: 8px; }
html[data-ui="v2"] #v2Settings .recordLimit { margin: 4px 0; }
html[data-ui="v2"] .v2popTitle { margin: 0 0 2px; font-weight: 700; }
html[data-ui="v2"] .v2links { margin: 6px 0 0; color: var(--muted); }
html[data-ui="v2"] .v2links .link { background: none; border: 0; padding: 0; color: var(--ink); text-decoration: underline; cursor: pointer; font: inherit; }
html[data-ui="v2"] .v2sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
html[data-ui="v2"] #disclosure { font-size: 12.5px; padding: 6px 12px; margin: 12px 0; }
html[data-ui="v2"] #disclosure #howItWorks, html[data-ui="v2"] #disclosure #aboutToggle { font-size: 12.5px; }
html[data-ui="v2"] .toolbar { display: none; }
html[data-ui="v2"] #stage { margin-bottom: 8px; }
html[data-ui="v2"] .v2video { position: absolute; bottom: 10px; right: 10px; z-index: 3; border: 0; border-radius: 999px; padding: 6px 12px; font-size: 12.5px; font-weight: 600; background: rgba(20,20,19,.72); color: #fff; cursor: pointer; }
html[data-ui="v2"] .v2video[aria-pressed="false"] { background: var(--paper); color: var(--ink); border: 1px solid var(--line); }
html[data-ui="v2"] #messages { max-height: none; overflow: visible; min-height: 0; padding: 0 2px; }
html[data-ui="v2"] #messages .message.v2old { display: none; }
html[data-ui="v2"] .v2earlier { display: block; width: 100%; margin: 2px 0 4px; border: 1px dashed var(--line); background: transparent; color: var(--muted); border-radius: 12px; padding: 7px 12px; font-size: 13.5px; cursor: pointer; }
html[data-ui="v2"] .v2earlier[aria-expanded="true"] { border-style: solid; }
html[data-ui="v2"] #starters .starterGrid, html[data-ui="v2"] #starters > p:not(.lastTime) { display: none; }
html[data-ui="v2"] .v2ask h2 { font: 700 26px/1.2 Georgia, serif; margin: 10px 0 4px; }
html[data-ui="v2"] .v2ask p { margin: 0 0 8px; color: var(--muted); font-size: 16px; }
html[data-ui="v2"] #starters .lastTime { font-size: 14px; }
html[data-ui="v2"] .v2resume { margin: 4px 0 8px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); border-radius: 20px; padding: 8px 14px; font-size: 14px; cursor: pointer; }
html[data-ui="v2"] #composer { margin-top: 8px; }
html[data-ui="v2"] .v2row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 10px 0 4px; font-size: 14px; color: var(--muted); }
html[data-ui="v2"] .v2row select { font-size: 14px; }
html[data-ui="v2"] .v2keep { display: flex; gap: 8px; flex-wrap: wrap; }
html[data-ui="v2"] .v2keep:not(:has(button:not([hidden]))) { display: none; }
html[data-ui="v2"] .v2keep button { border: 1px solid var(--line); background: var(--paper); color: var(--ink); border-radius: 18px; padding: 7px 12px; font-size: 13px; }
html[data-ui="v2"] .v2more { flex-basis: 100%; border: 0; margin: 0; padding: 0; }
html[data-ui="v2"] .v2more > summary { color: var(--ink); font-size: 14px; }
html[data-ui="v2"] .v2more #quickActions { padding-top: 8px; }
html[data-ui="v2"] #v2Welcome { border: 1px solid var(--sage); background: var(--paper); border-radius: 14px; padding: 10px 14px; margin: 0 0 8px; font-size: 15px; }
html[data-ui="v2"] #v2Welcome p { margin: 0 0 8px; }
html[data-ui="v2"] #v2Welcome div { display: flex; gap: 8px; flex-wrap: wrap; }
html[data-ui="v2"] #v2Welcome button { border: 1px solid var(--line); background: var(--paper); color: var(--ink); border-radius: 18px; padding: 7px 14px; font-size: 14px; cursor: pointer; }
html[data-ui="v2"] #v2Welcome button.primary { background: var(--rust); border-color: var(--rust); color: #fff; font-weight: 600; }
html[data-ui="v2"] [data-feedback="app"] { margin-top: 18px; }
@media (max-width: 650px) {
  html[data-ui="v2"] header .tag { display: none; }
  html[data-ui="v2"] .v2nav { margin-left: 0; width: 100%; }
  html[data-ui="v2"] .v2nav > .quiet, html[data-ui="v2"] .v2menu > summary { padding: 7px 11px; font-size: 13.5px; }
  html[data-ui="v2"] #v2Settings { margin-left: auto; }
  html[data-ui="v2"] .v2pop { position: fixed; left: 16px; right: 16px; top: auto; width: auto; max-width: none; }
  html[data-ui="v2"] .v2ask h2 { font-size: 23px; }
}
html[data-ui="v2"] details.v2menu, html[data-ui="v2"] details.v2more { border-top: 0; margin-top: 0; padding-top: 0; color: inherit; }
html[data-ui="v2"] details.v2menu > .v2pop { color: var(--ink); }
html[data-ui="v2"] #stage.idle #idleLoop, html[data-ui="v2"] #stage.live #avatarCanvas { max-height: 38vh; }
html[data-ui="v2"] #avatarVideo { max-height: 38vh; }
@media (max-width: 650px) {
  html[data-ui="v2"] #stage.idle #idleLoop, html[data-ui="v2"] #stage.live #avatarCanvas, html[data-ui="v2"] #avatarVideo { max-height: 28vh; }
  html[data-ui="v2"] header .mark { width: 40px; height: 40px; font-size: 20px; }
  html[data-ui="v2"] header h1 { font-size: 23px; }
  html[data-ui="v2"] #disclosure #howItWorks { display: none; }
}
html[data-ui="v2"] header > div:not(.mark) { flex: 1 1 220px; min-width: 0; }
html[data-ui="v2"] .v2nav { flex: 0 1 auto; }
@media (min-width: 651px) {
  html[data-ui="v2"] #stage.idle #idleLoop, html[data-ui="v2"] #stage.live #avatarCanvas, html[data-ui="v2"] #avatarVideo { max-height: 34vh; }
}
html[data-ui="v2"] .v2link { border-top: 1px solid var(--line); padding-top: 8px; margin-top: 4px; }
html[data-ui="v2"] .v2linkrow { display: flex; gap: 6px; align-items: center; }
html[data-ui="v2"] .v2linkrow input { flex: 1; min-width: 0; font: 13px ui-monospace, SFMono-Regular, Menlo, monospace; padding: 6px 8px; }
html[data-ui="v2"] .v2linkNote { margin: 6px 0 0; color: var(--muted); font-size: 13px; }
/* This week's practice (weekly.js): Joe's homework for the class, under his picture. */
html[data-ui="v2"] #v2Week { border: 1px solid var(--line); border-left: 4px solid var(--rust); background: var(--paper); border-radius: 14px; padding: 0; margin: 0 0 10px; }
html[data-ui="v2"] #v2Week.v2weekDone { border-left-color: var(--sage); }
html[data-ui="v2"] #v2Week > summary { list-style: none; cursor: pointer; padding: 10px 14px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
html[data-ui="v2"] #v2Week > summary::-webkit-details-marker { display: none; }
html[data-ui="v2"] #v2Week > summary::after { content: "▾"; margin-left: auto; color: var(--muted); }
html[data-ui="v2"] #v2Week[open] > summary::after { content: "▴"; }
html[data-ui="v2"] .v2weekKicker { flex-basis: 100%; font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rust); }
html[data-ui="v2"] .v2weekDone .v2weekKicker { color: var(--sage); }
html[data-ui="v2"] .v2weekTitle { font: 700 19px/1.25 Georgia, serif; color: var(--ink); }
html[data-ui="v2"] .v2weekCount { font-size: 13px; color: var(--muted); }
html[data-ui="v2"] .v2weekBody { padding: 0 14px 12px; font-size: 15px; }
html[data-ui="v2"] .v2weekBody > p { margin: 0 0 6px; }
html[data-ui="v2"] .v2weekLabel { color: var(--muted); font-size: 13.5px; }
html[data-ui="v2"] .v2weekBody ol { margin: 6px 0 0; padding: 0; list-style: none; counter-reset: wk; display: flex; flex-direction: column; gap: 10px; }
html[data-ui="v2"] .v2weekBody li { border-top: 1px solid var(--line); padding-top: 10px; }
html[data-ui="v2"] .v2weekBody label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; line-height: 1.4; }
html[data-ui="v2"] .v2weekBody input[type=checkbox] { width: 20px; height: 20px; flex: none; margin: 1px 0 0; accent-color: var(--sage); }
html[data-ui="v2"] .v2weekBody input:checked + span { color: var(--muted); text-decoration: line-through; text-decoration-color: var(--line); }
html[data-ui="v2"] .v2weekBody a { margin-left: 30px; font-size: 14px; }
html[data-ui="v2"] .v2weekGo { display: block; margin: 8px 0 0 30px; border: 1px solid var(--rust); background: var(--rust); color: #fff; border-radius: 18px; padding: 7px 14px; font-size: 14px; font-weight: 600; cursor: pointer; }
html[data-ui="v2"] .v2weekNote { margin: 10px 0 0; font-size: 12.5px; color: var(--muted); }
