:root { --bg:#0b0b10; --fg:#eaeaea; --muted:#a9a9b3; --card:#151521; --accent:#7c5cff; --ok:#1fbf75; --bad:#ff5c7c; --user:#6bb6ff; }

html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.55 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif}
.wrap{max-width:1180px;margin:0 auto;padding:24px}
h1{font-size:22px;margin:0 0 14px}

.layout{display:grid;grid-template-columns:1fr 1fr 260px;gap:14px}
@media (max-width:1100px){.layout{grid-template-columns:1fr;}}

.card{background:var(--card);border-radius:14px;padding:14px;box-shadow:0 2px 18px rgba(0,0,0,.25)}
label{font-size:14px;color:var(--muted)}
textarea{width:100%;height:360px;background:#0f0f18;color:var(--fg);border:1px solid #24243a;border-radius:10px;padding:12px;resize:vertical}

.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.controls .mode{display:flex;gap:8px;flex-wrap:wrap}

.btn{background:var(--accent);color:#fff;border:0;border-radius:12px;padding:10px 14px;font-weight:600;cursor:pointer}
.btn.ghost{background:#24243a;color:#fff}
.btn:disabled{opacity:.6;cursor:not-allowed}

.out{min-height:360px;background:#0f0f18;border:1px solid #24243a;border-radius:10px;padding:14px;overflow:auto}
.line{margin:8px 0}

ruby{font-size:26px;line-height:1.6; ruby-position:over}
rt{font-size:12px;color:var(--muted)}

.mono{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace}
.small{font-size:12px;color:var(--muted)}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.kbd{padding:2px 6px;border:1px solid #3a3a55;border-radius:6px;background:#111122}
.score{font-weight:700}

.sy{padding:0 2px;border-radius:6px;cursor:pointer;position:relative}
.sy:focus{outline:1px solid #3a3a55}

/* User-edited syllables in blue */
.sy.user-set{color:var(--user)}

/* Feedback */
.sy.ok{background:rgba(31,191,117,.18);color:#b9ffd8}
.sy.bad{background:rgba(255,92,124,.18);color:#ffd1db}

.panel h3{margin:0 0 10px;font-size:16px}
.tone-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.tone-grid button{background:#27283f;border:1px solid #3a3a55;border-radius:10px;color:#fff;padding:10px;cursor:pointer}
.tone-grid button.active{outline:2px solid var(--accent)}
.panel .small{display:block;margin-top:8px}
.muted{color:var(--muted)}
.status{margin-top:10px;font-size:12px;color:var(--muted)}
pw-cli ls Node | grep -i audio
spd-say -o pulse -l zh_CN "你好，世界"