:root{font-family:-apple-system,BlinkMacSystemFont,"Noto Sans",sans-serif;color:#15244a;background:#f2f5fc;font-size:17px;line-height:1.6}*{box-sizing:border-box}body{margin:0}header{max-width:940px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:24px}a{color:#173fbd}header a{text-decoration:none}.brand{font-size:30px;font-weight:800;letter-spacing:3px}.brand span{font-size:14px;letter-spacing:1px;margin-left:12px;color:#52617c}header>span{font-size:14px;color:#52617c}main{max-width:720px;margin:auto;padding:0 22px}nav{display:flex;gap:6px;border-bottom:1px solid #ced8ec;padding-bottom:12px}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid #cad4e8;border-radius:12px;background:white;color:#243861;padding:11px 16px;min-height:48px}button:hover{border-color:#173fbd}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #efab12;outline-offset:3px}button:disabled{opacity:.5;cursor:default}nav button{flex:1;font-size:15px;border:0;background:transparent;padding:10px 4px}nav button.active{background:#173fbd;color:white}.intro{margin:30px 0 22px}.eyebrow{color:#52617c;margin:0;font-size:15px}h1{font-size:30px;letter-spacing:-1px;margin:4px 0 22px}h2{font-size:21px;margin-top:0}.filters{display:flex;gap:12px;margin:20px 0}label{display:block;font-size:14px;color:#52617c}.filters label{flex:1;min-width:0}select,input,textarea{display:block;width:100%;padding:11px 9px;background:white;border:1px solid #cad4e8;border-radius:9px;color:#15244a;margin-top:5px;font-size:16px}textarea{resize:vertical}.card{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:340px;border:0;border-top:5px solid #173fbd;border-radius:20px;padding:30px 24px;box-shadow:0 12px 40px #20397010;overflow-wrap:anywhere}.tag{font-size:14px;color:#173fbd;background:#eef2ff;padding:4px 14px;border-radius:30px}.front{font-size:clamp(26px,5vw,38px);font-weight:650;line-height:1.6;margin:30px 0 22px}#answer>*{display:block}#reading{color:#52617c;font-size:18px}#meaning{font-size:24px;margin:8px 0 20px}#example{font-size:20px}#translation{color:#52617c;font-size:16px}#note{font-size:14px;color:#52617c;margin-top:16px}.hint{font-size:14px;color:#64728c;margin-top:24px}.audio,.actions{display:flex;gap:10px;margin-top:16px}.audio button{flex:1;background:transparent;border:0}.actions button{flex:1}.primary{background:#173fbd;color:white;border-color:#173fbd}.muted{color:#52617c;font-size:14px}#preference{text-align:center}article{background:white;border:1px solid #dce3f1;border-radius:16px;padding:24px;margin:20px 0}article button,article a{margin:8px 6px 8px 0}article a{display:inline-block;font-size:15px}article p{font-size:16px}.file{font-size:16px}#list article{margin:10px 0;padding:16px}#list h2{margin:0;font-size:22px}#list p{margin:4px 0}#changes{max-height:320px;overflow:auto}#changes p{padding:10px;border-bottom:1px solid #dce3f1;white-space:pre-wrap;overflow-wrap:anywhere}#status{position:sticky;bottom:16px;background:#15244a;color:white;border-radius:12px;padding:12px 18px;z-index:2}#status:empty{display:none}footer{text-align:center;padding:28px 0 calc(24px + env(safe-area-inset-bottom));font-size:14px;color:#64728c}[hidden]{display:none!important}@media(max-width:450px){main{padding:0 16px}header{padding:18px 16px}.brand span{display:none}.filters{gap:6px}.filters select{font-size:14px;padding:10px 4px}h1{font-size:27px}.actions{gap:6px}.actions button{padding:11px 7px;font-size:16px}.card{padding:24px 18px}article{padding:18px}}