*{box-sizing:border-box;margin:0;padding:0}body{color:#000;overflow:hidden;background-color:#fff;height:100vh;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;line-height:1.6}.app{display:grid;grid-template-rows:auto 1fr;grid-template-columns:1fr 280px;height:100vh}.days-sidebar{grid-column:2;grid-row:1/3;overflow-y:auto;background-color:#fff;border-left:1px solid #000;padding:0}.days-list{display:flex;flex-direction:column}.day-item{cursor:pointer;border:none;border-bottom:1px solid #e0e0e0;padding:1.5rem;transition:all .1s;font-size:1rem}.day-item:hover{background-color:#f5f5f5}.day-item.active{color:#fff;background-color:#000}.day-item.today{font-weight:700}.day-date{margin-bottom:.25rem;font-family:SF Mono,Monaco,Inconsolata,Fira Mono,monospace;font-size:.95rem}.day-count{opacity:.6;font-size:.85rem}.character-nav{grid-column:1;grid-row:1;display:flex;overflow-x:auto;background-color:#fff;justify-content:center;gap:1rem;padding:1.5rem 2rem}.character-tab{cursor:pointer;text-align:center;background-color:#fff;border:1px solid #000;min-width:60px;padding:.75rem 1.5rem;transition:all .1s;font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;font-size:1.5rem}.character-tab:hover{background-color:#f5f5f5}.character-tab.active{color:#fff;background-color:#000}.main-content{grid-column:1;grid-row:2;display:flex;overflow-y:auto;justify-content:center;align-items: center;padding:3rem 3rem 5rem}.flashcard-container{display:flex;flex-direction:column;align-items: center;gap:2rem;width:100%;max-width:800px}.flashcard{perspective:1000px;cursor:pointer;position:relative;width:100%;max-width:600px;height:500px}.flashcard-front,.flashcard-back{position:absolute;display:flex;backface-visibility:hidden;background-color:#fff;border:1px solid #000;justify-content:center;align-items: center;width:100%;height:100%;padding:2rem;transition:transform .6s}.flashcard-back{overflow-y:auto;align-items: flex-start;padding:1.5rem 2rem}.flashcard-front{pointer-events:auto;transform:rotateY(0)}.flashcard-back{pointer-events:none;transform:rotateY(180deg)}.flashcard.flipped .flashcard-front{pointer-events:none;transform:rotateY(-180deg)}.flashcard.flipped .flashcard-back{pointer-events:auto;transform:rotateY(0)}.character-svg{display:flex;justify-content:center;align-items: center;width:100%;height:100%}.character-svg svg{width:100%;max-width:400px;height:auto}.character-info{text-align:center;width:100%}.pinyin{color:#000;margin-bottom:1rem;font-size:2.5rem;font-weight:700}.definition{margin-bottom:1.5rem;font-size:clamp(.85rem,2vw,1.25rem);line-height:1.4}.structure-section{text-align:center;border-top:1px solid #000;margin-bottom:.75rem;padding-top:.75rem}.decomposition-list{display:inline-grid;grid-template-columns:auto auto auto auto;align-items: center;gap:.3rem 0;margin-top:.5rem}.radical-footnote{color:#666;margin-top:1rem;font-size:.85rem}.sentences{text-align:left;border-top:1px solid #000;padding-top:.75rem;padding-bottom:.5rem}.sentences .label{display:block;margin-bottom:.5rem;font-size:1rem;font-weight:700}.sentences ul{list-style:none;margin:0;padding:0}.sentences li{display:flex;border-bottom:1px solid #e0e0e0;flex-direction:row;align-items:baseline;gap:.75rem;padding:.5rem 0}.sentence-play-btn{color:#000;cursor:pointer;text-align:center;background:#fff;border:1px solid #000;flex-shrink:0;width:24px;height:24px;padding:0;font-size:10px;line-height:24px}.sentence-play-btn:hover,.sentence-play-btn.playing{color:#fff;background:#000}.sentence-play-btn.loading{opacity:.5;cursor:wait}.sentence-zh{font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;font-size:1.1rem}.char-link{cursor:pointer;text-decoration-line:underline;text-decoration-style:dotted;text-underline-offset:3px;text-decoration-color:#999}.char-link:hover{text-decoration-color:#000}.sentence-en{color:#555;font-size:.85rem}.sentences li:last-child{border-bottom:none}.decomp-box{padding:0 .4rem}.decomp-char{border-right:1px solid #ddd;padding:0 .4rem;font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;font-size:1.1rem}.decomp-pinyin{color:#000;border-right:1px solid #ddd;padding:0 .4rem;font-size:.85rem}.decomp-def{color:#666;padding:0 .4rem;font-size:.8rem}.label{margin-right:.5rem;font-weight:700}.value{font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif}.control-center{grid-column:1;position:fixed;z-index:10;display:flex;background:#fff;border-top:1px solid #000;bottom:0;left:0;right:280px}.control-btn{display:flex;color:#000;cursor:pointer;background:linear-gradient(#fff 0%,#f2f2f2 100%);border-top:none;border-bottom:2px solid #ddd;border-left:none;border-right:1px solid #ddd;flex-direction:column;flex:1;align-items: center;gap:.15rem;padding:.5rem .5rem .4rem;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif}.control-btn:last-child{border-right:none}.control-btn:hover{color:#fff;background:linear-gradient(#000 0%,#222 100%);border-bottom-color:#000}.control-btn:active{color:#fff;background:linear-gradient(#222 0%,#000 100%);border-bottom-color:#000}.control-btn.active{color:#fff;pointer-events:none;background:linear-gradient(#000 0%,#222 100%);border-bottom-color:#000}.control-icon{font-size:1.1rem;line-height:1}.control-label{font-size:.7rem;font-weight:700}.control-key{opacity:.35;font-family:SF Mono,Monaco,Inconsolata,Fira Mono,monospace;font-size:.55rem;font-weight:700}.day-header{display:flex;justify-content:space-between;align-items: center}.day-actions{display:flex;gap:.3rem}.day-review-btn,.day-drill-btn{cursor:pointer;color:#fff;background-color:#0000;border:1px solid #fff;padding:.3rem .7rem;font-size:.75rem;font-weight:700}.day-review-btn:hover,.day-drill-btn:hover{color:#000;background-color:#fff}.review-nav{grid-column:1;grid-row:1;display:flex;background-color:#fff;align-items: center;gap:1.5rem;padding:1.5rem 2rem}.review-exit-btn{cursor:pointer;color:#fff;background-color:#000;border:1px solid #000;padding:.75rem 1.5rem;font-size:.9rem;font-weight:700}.review-exit-btn:hover{color:#000;background-color:#fff}.review-progress{font-family:SF Mono,Monaco,Inconsolata,Fira Mono,monospace;font-size:1.1rem;font-weight:700}.review-front{display:flex;flex-direction:column;justify-content:center;align-items: center;gap:2rem;height:100%}.review-prompt{text-align:center;font-size:3rem;font-weight:700}.review-hint{color:#666;font-size:.85rem}.review-back{display:flex;flex-direction:column;justify-content:center;align-items: center;gap:1rem;height:100%}.review-back .character-svg{flex:1;width:100%;max-width:300px;height:auto}.review-back-info{text-align:center;font-size:1.2rem}.review-reveal{display:flex;overflow-y:auto;flex-direction:column;align-items: center;gap:.5rem;width:100%;height:100%;padding:1rem 0}.review-reveal-char{display:flex;justify-content:center;align-items: center}.review-reveal-char svg{width:120px;height:120px}.review-reveal .pinyin{margin-bottom:0;font-size:1.8rem}.review-reveal .definition{margin-bottom:.5rem;font-size:1rem}.review-reveal .sentences{text-align:left;width:100%}.character-nav::-webkit-scrollbar{width:8px;height:8px}.days-sidebar::-webkit-scrollbar{width:8px;height:8px}.character-nav::-webkit-scrollbar-track{background:#fff;border-left:1px solid #e0e0e0}.days-sidebar::-webkit-scrollbar-track{background:#fff;border-left:1px solid #e0e0e0}.character-nav::-webkit-scrollbar-thumb{background:#000}.days-sidebar::-webkit-scrollbar-thumb{background:#000}@media (max-width:768px){.app{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.days-sidebar{grid-column:1;grid-row:3;border-top:1px solid #000;border-left:none;max-height:200px}.flashcard{height:400px}.pinyin{font-size:2.5rem}.control-center{right:0}.control-key{display:none}}.drill-pattern-label{text-align:center;flex:1;font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;font-size:1.2rem;font-weight:700}.drill-front{display:flex;flex-direction:column;justify-content:center;align-items: center;gap:1.5rem;height:100%}.drill-sentence-zh{text-align:center;font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;font-size:2.5rem;font-weight:700}.drill-back{display:flex;flex-direction:column;justify-content:center;align-items: center;gap:1.5rem;height:100%}.drill-sentence-en{color:#555;text-align:center;font-size:1.3rem}.drill-sub-label{color:#666;font-size:.9rem}.drill-highlight{border-bottom:2px solid #000;font-weight:700}.drill-play-btn{position:static}.drill-annotated{display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem}.drill-char-anno{display:flex;flex-direction:column;align-items: center;gap:.1rem}.drill-char-anno.drill-highlight .drill-char-hanzi{border-bottom:2px solid #000;font-weight:700}.drill-char-hanzi{font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;font-size:2rem}.drill-char-pinyin{color:#555;font-size:.75rem}