:root{--bg: #0b0d10;--panel: #151a21;--border: #2a2f36;--text: #e8eef5;--muted: #a6b0bb;--accent: #3b82f6}*{box-sizing:border-box}html,body,#root,.app-root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji}.app-root{display:flex}.sidebar{width:320px;border-right:1px solid var(--border);background:color-mix(in oklab,var(--panel) 80%,transparent);display:flex;flex-direction:column;gap:12px;padding:12px}.row{display:flex;gap:8px;align-items:center}.btn{background:var(--panel);border:1px solid var(--border);color:var(--text);padding:8px 10px;border-radius:10px;cursor:pointer}.btn:hover{border-color:color-mix(in oklab,var(--border) 70%,white)}.btn.secondary{background:transparent}.btn.danger{border-color:#ef4444;color:#fecaca}.btn.success{border-color:#22c55e;color:#bbf7d0}.btn.full{width:100%}.input{width:100%;background:var(--panel);border:1px solid var(--border);color:var(--text);padding:8px 10px;border-radius:10px}.divider{height:1px;background:var(--border);margin:6px 0}.list{overflow:auto;flex:1;padding-right:4px}.card{border:1px solid var(--border);background:color-mix(in oklab,var(--panel) 90%,transparent);border-radius:12px;padding:8px;margin-bottom:8px;cursor:pointer}.card.selected{outline:2px solid var(--accent)}.card .title{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card .note{font-size:12px;color:var(--muted)}.canvas{position:relative;border-right:1px solid var(--border)}.right{width:420px;padding:12px}.center{flex:1;display:grid;grid-template-columns:1fr 420px}.toolbar{position:absolute;bottom:12px;left:12px;background:color-mix(in oklab,var(--panel) 90%,transparent);border:1px solid var(--border);padding:6px;border-radius:12px;display:flex;gap:6px;align-items:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.label{font-size:12px;color:var(--muted)}.field{display:flex;flex-direction:column;gap:6px;margin:8px 0}.input[type=color]{padding:0;height:36px}.attach-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.attach{border:1px solid var(--border);border-radius:8px;overflow:hidden}.attach .hdr{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;font-size:12px;background:var(--panel)}.attach .body{height:120px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px}.attach .foot{padding:6px 8px;border-top:1px solid var(--border);font-size:12px;display:flex;justify-content:space-between;color:var(--muted)}a.download{color:var(--text);text-decoration:underline}.small{font-size:12px;color:var(--muted)}.tabbar{display:flex;gap:8px;margin-bottom:8px}.tab{padding:6px 10px;border:1px solid var(--border);border-radius:8px;cursor:pointer}.tab.active{border-color:var(--accent)}.empty{height:100%;display:flex;align-items:center;justify-content:center;color:var(--muted)}