:root{--bg: #f6f7f9;--panel: #ffffff;--text: #1f2328;--muted: #6b7280;--line: #e3e5e8;--accent: #2563eb;--accent-hover: #1d4ed8;--danger: #dc2626;--warn: #b45309;--ok: #15803d;--grid-minor: #e8e9ec;--grid-major: #d7d9de}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #17181b;--panel: #212226;--text: #e6e7ea;--muted: #9ca3af;--line: #34363c;--accent: #4f8cff;--accent-hover: #6b9dff;--danger: #f87171;--warn: #fbbf24;--ok: #4ade80}}:root[data-theme=dark]{--bg: #17181b;--panel: #212226;--text: #e6e7ea;--muted: #9ca3af;--line: #34363c;--accent: #4f8cff;--accent-hover: #6b9dff;--danger: #f87171;--warn: #fbbf24;--ok: #4ade80}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Hiragino Sans,Noto Sans JP,Yu Gothic UI,sans-serif;font-size:15px}button,input{font:inherit;color:inherit}a{color:var(--accent)}[hidden]{display:none!important}.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);cursor:pointer;white-space:nowrap}.btn:hover{border-color:var(--muted)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover{background:var(--accent-hover)}.btn.danger{color:var(--danger)}.btn.small{padding:4px 10px;font-size:13px}.btn[disabled]{opacity:.5;cursor:default}.input{padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:var(--panel);border-bottom:1px solid var(--line)}.brand{margin:0;font-size:17px;font-weight:700;display:flex;align-items:center;gap:8px}.brand svg{color:var(--accent)}.page{max-width:860px;margin:24px auto;padding:0 16px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px}.panel h2{margin:0 0 12px;font-size:16px}.login{max-width:400px;margin:12vh auto 0}.login form{display:flex;gap:8px}.login input{flex:1;min-width:0}.message{min-height:1.4em;margin:8px 0 0;color:var(--danger);font-size:14px}.list-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}.list-actions .spacer{flex:1}.boards{list-style:none;margin:0;padding:0;display:grid;gap:8px}.board-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px}.board-row:hover{border-color:var(--muted)}.board-row .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;color:var(--text);text-decoration:none}.board-row .meta{color:var(--muted);font-size:12px;white-space:nowrap}.board-row .actions{display:flex;gap:6px}.chip{font-size:11px;color:var(--accent);border:1px solid currentColor;border-radius:999px;padding:1px 7px;white-space:nowrap}.empty{color:var(--muted);text-align:center;padding:28px 0}.section-title{margin:22px 0 10px;font-size:14px;color:var(--muted)}.usage{max-width:860px;margin:8px auto 24px;padding:0 16px;color:var(--muted);font-size:12px}@media(max-width:560px){.board-row{flex-wrap:wrap}.board-row .name{flex-basis:100%}.board-row .meta{flex:1}}.editor-bar{position:fixed;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;gap:8px;height:46px;padding:0 10px;background:var(--panel);border-bottom:1px solid var(--line)}.editor-bar .back{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;color:var(--text);text-decoration:none}.editor-bar .back:hover{background:var(--bg)}.editor-bar .title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;padding:4px 6px;border-radius:6px}.editor-bar .title.editable{cursor:text}.editor-bar .title.editable:hover{background:var(--bg)}.editor-bar .title-input{flex:1;min-width:0;padding:4px 8px}.editor-bar .status{color:var(--muted);font-size:12px;white-space:nowrap}.editor-bar .status.error{color:var(--danger)}.editor-bar .status.ok{color:var(--ok)}.badge{font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 9px}.canvas{position:fixed;top:46px;left:0;right:0;bottom:0}.center-message{position:fixed;top:46px;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:16px;text-align:center;color:var(--muted);z-index:5}.canvas.grid{background-color:#fff;background-image:linear-gradient(to right,var(--grid-major) 1px,transparent 1px),linear-gradient(to bottom,var(--grid-major) 1px,transparent 1px),linear-gradient(to right,var(--grid-minor) 1px,transparent 1px),linear-gradient(to bottom,var(--grid-minor) 1px,transparent 1px);background-size:var(--gM, 100px) var(--gM, 100px),var(--gM, 100px) var(--gM, 100px),var(--gm, 20px) var(--gm, 20px),var(--gm, 20px) var(--gm, 20px);background-position:var(--gx, 0) var(--gy, 0)}.canvas.grid.dark{background-color:#121212;--grid-minor: #222326;--grid-major: #303136}.menu-wrap{position:relative}.menu{position:absolute;right:0;top:calc(100% + 6px);min-width:180px;padding:6px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px #0000001f;z-index:20}.menu .menu-label{padding:4px 8px;font-size:11px;color:var(--muted)}.menu .row{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;padding:2px 4px 6px}.menu .row button{padding:6px 0;border:1px solid var(--line);border-radius:6px;background:transparent;cursor:pointer;font-family:ui-monospace,Consolas,monospace;font-size:15px}.menu .row button:hover{border-color:var(--accent);color:var(--accent)}.menu .swatches{grid-template-columns:repeat(5,1fr)}.menu .swatches button{height:26px}.menu{width:236px}.table-picker{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;padding:2px 4px 6px}.table-picker button{aspect-ratio:1;padding:0;border:1px solid var(--line);border-radius:3px;background:transparent;cursor:pointer}.table-picker button.on{background:color-mix(in srgb,var(--accent) 22%,transparent);border-color:var(--accent)}.menu .menu-hint{padding:0 8px 8px;font-size:11px;line-height:1.5;color:var(--muted);border-bottom:1px solid var(--line);margin-bottom:4px}.dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;z-index:30;display:flex;align-items:center;justify-content:center;padding:16px}.dialog{width:100%;max-width:460px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px}.dialog h2{margin:0 0 6px;font-size:16px}.dialog p{margin:0 0 14px;color:var(--muted);font-size:13px;line-height:1.6}.dialog .link-row{display:flex;gap:8px;margin-bottom:14px}.dialog .link-row input{flex:1;min-width:0;font-size:13px}.dialog .actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.dialog .actions .spacer{flex:1}.banner{position:fixed;top:54px;left:50%;transform:translate(-50%);z-index:25;display:flex;align-items:center;gap:10px;flex-wrap:wrap;max-width:calc(100vw - 32px);padding:10px 14px;background:var(--panel);border:1px solid var(--warn);border-radius:10px;box-shadow:0 8px 24px #0000001f;font-size:14px}@media(max-width:560px){.editor-bar .status,.editor-bar .btn .label{display:none}}