:root{font-family:system-ui,-apple-system,sans-serif;color:#273348;background:#eef1f7}*{box-sizing:border-box}body{margin:0}header{background:#fff;border-bottom:1px solid #dce2ed;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}header b{font-size:20px;color:#5547bd}header span{font-size:13px;color:#718099}button,.button,input,textarea{font:inherit}button,.button{background:#fff;color:#36425b;border:1px solid #d6dfec;border-radius:9px;padding:10px 13px;cursor:pointer;min-height:42px}button:hover,.button:hover{background:#f3f2ff}button.selected,.primary{background:#5c50cf;color:#fff;border-color:#5c50cf}button:disabled{opacity:.4;cursor:default}.actions,.tools,.options{display:flex;gap:8px;align-items:center;flex-wrap:wrap}main{display:grid;grid-template-columns:220px minmax(300px,700px) 270px;gap:14px;max-width:1500px;margin:auto;padding:16px}section,aside{background:#fff;border:1px solid #dce3ef;border-radius:14px;padding:16px;min-width:0}.section-head{display:flex;justify-content:space-between;align-items:center}.section-head span,.eyebrow{font-size:12px;color:#7b88a0}.add{display:flex;gap:5px;margin:16px 0}.add input{width:100%;min-width:0}.add button{white-space:nowrap}.glyphs{display:grid;grid-template-columns:repeat(auto-fill,minmax(48px,1fr));gap:7px}.glyphs button{font-size:20px}.quiet{margin-top:18px;font-size:12px}.work-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.work-head h1{margin:0;font-size:30px}.options{margin:12px 0}.options label{display:flex;align-items:center;gap:6px}.options input[type=range]{width:110px}.canvas-wrap{background:#e6eaf2;border-radius:12px;padding:10px;display:flex;justify-content:center}svg{width:100%;max-width:620px;aspect-ratio:1;background:white;touch-action:none;border-radius:5px;box-shadow:0 2px 9px #b7c1d555}.hint{color:#6b7891;font-size:13px;margin:10px 0}details{border-top:1px solid #e7ebf2;padding-top:12px}summary{cursor:pointer;color:#5547bd;font-weight:600}.settings{display:flex;flex-wrap:wrap;gap:14px;margin-top:15px}.settings label{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.settings input[type=file]{max-width:200px}input:not([type=checkbox]):not([type=range]):not([type=file]),textarea{border:1px solid #d3dbea;border-radius:8px;padding:9px;background:#fff;color:#273348}aside p{font-size:13px;color:#77849b}textarea{width:100%;resize:vertical}.preview{font-size:38px;min-height:100px;white-space:pre-wrap;overflow-wrap:anywhere;padding:16px 4px;border-bottom:1px solid #e6ebf3}.family{display:grid;gap:8px;margin-top:18px}.help{margin-top:25px;background:#f5f4ff;padding:14px;border-radius:10px;font-size:13px;line-height:1.6}.help ol{padding-left:20px}.help small{color:#68758c}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#263147;color:white;border-radius:8px;padding:10px 16px;display:none;z-index:5}@media(max-width:1000px){main{grid-template-columns:180px minmax(0,1fr)}aside{grid-column:1/-1}}@media(max-width:650px){header{align-items:flex-start;flex-direction:column;padding:12px}header span{display:none}main{display:flex;flex-direction:column;padding:8px;gap:8px}.characters{order:0}.work{order:1}aside{order:2}.glyphs{display:flex;overflow:auto}.glyphs button{min-width:48px}.quiet{margin-top:8px}.work-head{align-items:flex-start}.options button{padding:8px}.canvas-wrap{padding:5px}section,aside{padding:12px}}
