.x-page{flex-direction:column;gap:20px;display:flex}.x-narrow{max-width:420px;margin:24px auto 0}.x-page h1{margin:0;font-size:1.5rem;font-weight:600;line-height:1.25}.x-page h2{margin:0 0 8px;font-size:1.125rem;font-weight:600}.x-page p{margin:0}.x-muted{color:var(--muted)}.x-small{font-size:.8125rem}.x-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.x-row-between{justify-content:space-between}.x-stack{flex-direction:column;gap:12px;display:flex}.x-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.x-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);padding:14px 16px}.x-section{flex-direction:column;gap:12px;display:flex}.x-btn,.x-link-btn{min-height:44px;color:var(--text);border:1px solid var(--line);border-radius:var(--radius-card);text-align:center;background:0 0;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-weight:500;text-decoration:none;display:inline-flex}.x-btn:hover,.x-link-btn:hover{border-color:var(--text)}.x-btn:disabled{opacity:.5;cursor:not-allowed}.x-btn-primary{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}.x-btn-primary:hover{border-color:var(--primary);opacity:.9}.x-btn-danger{color:var(--accent)}.x-field{flex-direction:column;gap:4px;display:flex}.x-field>label,.x-label{color:var(--muted);font-size:.875rem;font-weight:500}.x-input,.x-textarea,.x-select{background:var(--surface);width:100%;min-height:44px;color:var(--text);border:1px solid var(--line);border-radius:var(--radius-card);padding:0 12px}.x-textarea{resize:vertical;min-height:120px;padding:10px 12px}.x-hint{color:var(--danger-text);font-size:.8125rem}.x-error{border:1px solid var(--accent);border-radius:var(--radius-card);color:var(--accent);flex-direction:column;align-items:flex-start;gap:8px;padding:12px 16px;display:flex}.x-ok{color:var(--ok);font-weight:500}.x-check{cursor:pointer;align-items:center;gap:12px;min-height:44px;display:flex}.x-check input{width:22px;height:22px;accent-color:var(--accent);flex:none}.x-tabs{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);gap:4px;padding:4px;display:flex}.x-tabs a{min-height:44px;color:var(--muted);border-radius:var(--radius-cell);flex:1;justify-content:center;align-items:center;font-weight:500;text-decoration:none;display:flex}.x-tabs a[aria-current=page]{color:var(--accent);background:var(--bg);font-weight:600}.x-cell{border:1px solid var(--grid);border-radius:var(--radius-cell);color:var(--text);background:linear-gradient(to right, transparent calc(50% - .5px), var(--grid) 0, var(--grid) calc(50% + .5px), transparent 0) center / 100% 100% no-repeat, linear-gradient(to bottom, transparent calc(50% - .5px), var(--grid) 0, var(--grid) calc(50% + .5px), transparent 0) center / 100% 100% no-repeat, linear-gradient(45deg, transparent calc(50% - .5px), var(--grid) 0, var(--grid) calc(50% + .5px), transparent 0) center / 100% 100% no-repeat, linear-gradient(-45deg, transparent calc(50% - .5px), var(--grid) 0, var(--grid) calc(50% + .5px), transparent 0) center / 100% 100% no-repeat;flex:none;place-items:center;line-height:1;display:inline-grid;position:relative}.x-cell-sm{width:40px;height:40px;font-size:1.5rem}.x-cell-md{width:64px;height:64px;font-size:2.25rem}.x-cell-lg{width:72px;height:72px;font-size:2.5rem}.x-skeleton{place-items:center;min-height:40dvh;display:grid}.x-skeleton .x-cell{animation:1.4s ease-in-out infinite x-pulse}@keyframes x-pulse{50%{opacity:.45}}@media (prefers-reduced-motion:reduce){.x-skeleton .x-cell{animation:none}}.x-stamp{width:44px;height:44px;color:var(--accent);border:2px solid var(--accent);border-radius:var(--radius-cell);flex:none;place-items:center;font-size:1.5rem;line-height:1;display:inline-grid;transform:rotate(-6deg)}.x-member{flex-direction:column;gap:4px;display:flex}.x-member-name{font-weight:600}.x-badge{border-radius:var(--radius-pill);border:1px solid var(--line);color:var(--muted);padding:2px 10px;font-size:.8125rem;display:inline-block}.x-badge-accent{color:var(--accent);border-color:var(--accent)}.x-stats{color:var(--muted);flex-wrap:wrap;gap:4px 16px;font-size:.9375rem;display:flex}.x-sources a{font-weight:600}.x-sources li{flex-direction:column;gap:2px;display:flex}.x-quiz-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.x-quiz-cell{aspect-ratio:1;border:1px solid var(--grid);border-radius:var(--radius-cell);background:var(--surface);width:min(100%,320px);margin:0 auto;position:relative}.x-quiz-cell:before,.x-quiz-cell:after{content:"";pointer-events:none;background:linear-gradient(to right, transparent calc(50% - .5px), var(--grid) 0, var(--grid) calc(50% + .5px), transparent 0), linear-gradient(to bottom, transparent calc(50% - .5px), var(--grid) 0, var(--grid) calc(50% + .5px), transparent 0);position:absolute;inset:0}.x-quiz-cell:after{background:linear-gradient(45deg, transparent calc(50% - .5px), var(--grid) 0, var(--grid) calc(50% + .5px), transparent 0), linear-gradient(-45deg, transparent calc(50% - .5px), var(--grid) 0, var(--grid) calc(50% + .5px), transparent 0)}.x-quiz-cell svg{z-index:1;width:100%;height:100%;display:block;position:relative}.x-dots{justify-content:center;gap:8px;display:flex}.x-dot{border:1px solid var(--accent);border-radius:50%;width:10px;height:10px}.x-dot[data-on=true]{background:var(--accent)}.x-prompt{text-align:center;font-size:1.25rem;font-weight:500}.x-pinyin{text-align:center;color:var(--muted);font-size:1.125rem}.x-tiles{flex-wrap:wrap;gap:8px;display:flex}.x-tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-cell);min-width:48px;min-height:48px;font-size:1.5rem;font-family:var(--font-han);padding:0 14px}.x-answer{border:1px dashed var(--line);border-radius:var(--radius-card);flex-wrap:wrap;gap:8px;min-height:72px;margin:0;padding:12px;list-style:none;display:flex}.x-answer li{display:inline-flex}.x-answer li[data-wrong=true] .x-tile{border-color:var(--accent);color:var(--accent)}.x-sentence{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.x-sentence .x-cell[data-state=pending]{color:#0000}.x-sentence .x-cell[data-state=active]{border-color:var(--accent);border-width:2px}.x-sentence .x-cell[data-wrong=true]{color:var(--accent)}.x-mistakes{flex-direction:column;gap:8px;display:flex}.x-mistakes li{align-items:center;gap:12px;display:flex}.x-result{text-align:center;font-size:1.5rem;font-weight:600}.x-counters{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.x-counter{flex-direction:column;gap:2px;display:flex}.x-counter strong{font-variant-numeric:tabular-nums;font-size:2rem;line-height:1.1}.x-days{grid-template-columns:repeat(7,1fr);gap:6px;margin:0;padding:0;list-style:none;display:grid}.x-day{color:var(--muted);flex-direction:column;align-items:center;gap:4px;font-size:.8125rem;display:flex}.x-day span.x-sq{aspect-ratio:1;border-radius:var(--radius-cell);border:1px solid var(--line);width:100%;color:var(--text);font-variant-numeric:tabular-nums;place-items:center;font-size:.9375rem;display:grid}.x-day span.x-sq[data-level="1"]{background:color-mix(in srgb, var(--accent) 18%, transparent)}.x-day span.x-sq[data-level="2"]{background:color-mix(in srgb, var(--accent) 38%, transparent)}.x-day span.x-sq[data-level="3"]{background:color-mix(in srgb, var(--accent) 60%, transparent)}.x-lesson-link{justify-content:space-between;align-items:center;gap:12px;min-height:44px;text-decoration:none;display:flex}.x-item{align-items:center;gap:12px;min-height:44px;text-decoration:none;display:flex}.x-item-text{flex-direction:column;min-width:0;display:flex}.x-item .han-big{white-space:nowrap;flex:none;font-size:1.5rem}.x-draft li{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.x-check .han-big{white-space:nowrap}.x-table{border-collapse:collapse;width:100%}.x-table th,.x-table td{text-align:left;border-bottom:1px solid var(--line);vertical-align:middle;padding:8px 4px}.x-table th{color:var(--muted);font-size:.8125rem;font-weight:500}.x-url{overflow-wrap:anywhere;font-size:.875rem}.x-quiz-cell{touch-action:none}.book-bar{background:var(--line);border-radius:999px;height:6px;overflow:hidden}.book-bar span{background:var(--accent);height:100%;transition:width .3s;display:block}.book-lesson{border-bottom:1px solid var(--line);padding:10px 0}.book-lesson p{margin:2px 0 0 34px}.book-sample{letter-spacing:.05em;font-size:1.25rem}