*{box-sizing:border-box}
body{margin:0;background:#0c1015;color:#f4f7fb;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",sans-serif}
main{max-width:540px;margin:auto;padding:28px 18px}
header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
h1{margin:0;font-size:29px;letter-spacing:-.7px}
header small{color:#92a0b0}
#mode{font-size:11px;color:#ffd16b;border:1px solid #6b5727;border-radius:999px;padding:7px 9px}
.card,.preview{border:1px solid #27313e;background:linear-gradient(150deg,#171d26,#10151b);border-radius:27px;padding:21px}
.lead{color:#94a1b1;font-size:14px;line-height:1.45}
.micwrap{text-align:center;padding:28px 0 20px}
.mic{width:150px;height:150px;border:0;border-radius:50%;background:radial-gradient(circle at 35% 25%,#82c4ff,#347fd7 60%,#1b589b);font-size:58px;box-shadow:0 15px 42px #378ce244;color:white}
.mic.on{animation:p 1s infinite}
@keyframes p{50%{transform:scale(1.04);box-shadow:0 0 0 16px #4ea3ff12,0 15px 50px #378ce266}
}
#listen{color:#94a1b1;font-size:13px;margin-top:8px}
.tools{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tool{background:#1a222d;border:1px solid #2a3543;border-radius:18px;color:#fff;padding:14px;text-align:left;min-height:77px}
.tool b{display:block;margin:5px 0}
.tool small{color:#91a0b0}
.tool input{display:none}
textarea{width:100%;margin-top:12px;min-height:92px;border-radius:17px;border:1px solid #293440;background:#0d1218;color:#fff;padding:14px;resize:vertical;outline:0}
.go{width:100%;margin-top:9px;border:0;border-radius:15px;padding:14px;background:#fff;color:#0d1116;font-weight:750}
.preview{display:none;margin-top:16px}
.preview.show{display:block}
.ph{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ph h2{font-size:16px}
.chip{font-size:10px;color:#9dceff;border:1px solid #4ea3ff44;background:#4ea3ff12;padding:6px 8px;border-radius:999px}
.rows{border:1px solid #293440;border-radius:15px;overflow:hidden}
.row{display:grid;grid-template-columns:76px 1fr;padding:10px;background:#111820;border-bottom:1px solid #293440;font-size:13px}
.row:last-child{border:0}
.k{color:#91a0b0;font-size:11px}
.reason{color:#8795a5;font-size:11px;margin-top:10px}
.buttons{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}
.btn{border-radius:14px;padding:12px;border:1px solid #293440;background:#18212b;color:#fff;font-weight:650}
.ok{color:#88efc6;border-color:#49da9f55;background:#49da9f12}
#imgbox{display:none;margin-top:12px;border:1px solid #293440;border-radius:15px;overflow:hidden}
#imgbox img{width:100%;max-height:300px;object-fit:contain;display:block}
.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,15px);opacity:0;background:#fff;color:#111;padding:10px 13px;border-radius:999px;font-size:12px;font-weight:650;transition:.2s;max-width:90%;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
footer{text-align:center;color:#617080;font-size:10px;margin-top:22px}

button,label.tool{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}
button:focus-visible,textarea:focus-visible,label.tool:focus-within{outline:2px solid #82c4ff;outline-offset:3px}
header{gap:12px}#mode{flex-shrink:0;max-width:145px;text-align:center}
.row>span,.chip{overflow-wrap:anywhere;min-width:0}.ph{flex-wrap:wrap}
#status{font-size:14px;line-height:1.5;color:#d7e7fa;overflow-wrap:anywhere}
.key-button{background:none;border:0;color:#aebdcc;text-decoration:underline;padding:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.tool input{display:block;position:absolute;width:1px;height:1px;opacity:0}
#writerUndo{margin-top:12px;width:100%}[hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
#loginPanel h2{margin-top:0;font-size:22px}#loginMessage{font-size:14px;line-height:1.5;color:#aebdcc}
#accountPanel{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px;font-size:13px;color:#aebdcc}
#accountEmail{overflow-wrap:anywhere;min-width:0}#accountPanel .btn{font-size:12px}
