.asset-shell{width:min(100% - 22px,1180px);margin:0 auto;padding:18px 0 max(32px,env(safe-area-inset-bottom))}.asset-header{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:4px 2px 16px}.asset-header h1{margin:0;font-family:Georgia,"Songti SC",serif;font-size:clamp(25px,5vw,36px);color:#5c4937}.asset-header .intro{margin:8px 0 0;color:#847565;font-size:13px;line-height:1.6}.header-links{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.header-links a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 13px;border:1px solid #e5dac8;border-radius:13px;background:#fffaf0;color:#735d43;font-size:12px;font-weight:800;text-decoration:none;white-space:nowrap}.lesson-filter{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;margin:4px 0 12px;padding:11px 13px;border:1px solid #e8decd;border-radius:15px;background:#f8f3e9f2;box-shadow:0 5px 16px #58452a0c;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}.lesson-filter label{color:#806b4f;font-size:12px;font-weight:900;white-space:nowrap}.lesson-filter select{min-width:0;max-width:250px;height:40px;padding:0 12px;border:1px solid #e5dac8;border-radius:11px;background:#fffdf8;color:#5c4937;font-size:13px}.lesson-filter span{margin-left:auto;color:#8b7d6b;font-size:12px;font-weight:800;white-space:nowrap}.character-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.character-card{min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px;border:1px solid #e9dfcf;border-radius:16px;background:#fffdf8;box-shadow:0 3px 0 #e7ddce;text-align:center}.character-picture{width:100%;aspect-ratio:1.35;display:grid;place-items:center;overflow:hidden;border:1px solid #eee5d7;border-radius:12px;background:radial-gradient(ellipse at center,#fff 0,#fffaf1 68%,#f3ead9 100%)}.character-picture img{width:100%;height:100%;object-fit:contain}.character-picture.is-placeholder{background:linear-gradient(145deg,#f2f5e9,#fff7e9)}.character-glyph{font-family:Georgia,"Songti SC",serif;color:#564330;font-size:clamp(26px,4vw,36px);line-height:1.15}.character-pinyin{color:#786449;font-size:14px;font-weight:700}.character-position{min-height:1.4em;color:#8a7a66;font-size:11px;line-height:1.4}.character-audio{min-height:34px;margin-top:2px;padding:0 12px;border:1px solid #dce5d1;border-radius:99px;background:#edf2e5;color:#5f7650;font-size:11px;font-weight:900;cursor:pointer}.character-audio:disabled{opacity:.5;cursor:default}.character-card button:focus-visible,.header-links a:focus-visible,.lesson-filter select:focus-visible{outline:3px solid #d5aa55;outline-offset:2px}.empty-state{text-align:center;padding:28px;color:#8e795c}@media(max-width:560px){.asset-shell{width:min(100% - 16px,1180px);padding-top:12px}.asset-header{align-items:flex-start;padding-bottom:12px}.asset-header h1{font-size:25px}.asset-header .intro{font-size:12px}.header-links a{min-height:38px;padding-inline:10px}.lesson-filter{gap:7px;padding:8px}.lesson-filter label{font-size:11px}.lesson-filter select{flex:1;max-width:none;height:38px;font-size:12px}.lesson-filter span{font-size:10px}.character-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.character-card{padding:8px;gap:4px}.character-picture{aspect-ratio:1.3}.character-glyph{font-size:28px}.character-pinyin{font-size:13px}.character-position{font-size:10px}.character-audio{min-height:32px}}
