:root{--paper:#f6f7f9;--white:#fff;--ink:#1e2733;--ink-2:#55606e;--ink-3:#6b7685;--line:#dde2e9;--line-2:#cbd2db;--hover:#eef1f5;--blue:#2457d6;--blue-dark:#1b45ad;--red:#c42d26;--font:"Yu Gothic UI", "Hiragino Sans", "Noto Sans JP", system-ui, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--paper);color:var(--ink);font:14px/1.6 var(--font);margin:0}h1,h2,p{margin:0}button,input{font:inherit;color:inherit}button{background:var(--white);border:1px solid var(--line-2);cursor:pointer;border-radius:7px;padding:6px 12px}button:hover{background:var(--hover)}button:disabled{opacity:.55;cursor:default}:focus-visible{outline:2px solid var(--blue);outline-offset:1px}button.primary{background:var(--blue);border-color:var(--blue);color:#fff}button.primary:hover{background:var(--blue-dark)}button.with-icon{white-space:nowrap;align-items:center;gap:6px;display:inline-flex}button.icon{width:32px;height:32px;color:var(--ink-2);background:0 0;border:0;flex:none;justify-content:center;align-items:center;padding:0;display:inline-flex}button.icon:hover{background:var(--hover);color:var(--ink)}button.icon.small{width:28px;height:28px}button.link{color:var(--blue);background:0 0;border:0;padding:0}button.link:hover{background:0 0;text-decoration:underline}.login{place-items:center;min-height:100%;padding:16px;display:grid}.login-card{background:var(--white);border:1px solid var(--line);border-radius:12px;flex-direction:column;gap:14px;width:min(340px,100%);padding:24px;display:flex}.login-card h1{font-size:20px;font-weight:500}.login-card label{color:var(--ink-2);flex-direction:column;gap:4px;font-size:13px;display:flex}.login-card input[type=email]{border:1px solid var(--line-2);height:38px;color:var(--ink);border-radius:7px;padding:0 10px;font-size:14px}.login-card .primary{height:38px}.login-hint{color:var(--ink-2);font-size:13px}.login-links{justify-content:space-between;gap:12px;font-size:13px;display:flex}.form-error{color:var(--red);font-size:13px}.form-notice{color:var(--ink-2);font-size:13px}.code-boxes{grid-template-columns:repeat(6,1fr);gap:6px;display:grid;position:relative}.code-boxes input{opacity:0;width:100%;font-size:16px;position:absolute;inset:0}.code-boxes span{border:1px solid var(--line-2);pointer-events:none;border-radius:7px;place-items:center;height:44px;font-size:20px;display:grid}.code-boxes:focus-within span.current{border-color:var(--blue);box-shadow:0 0 0 1px var(--blue)}.list{max-width:1120px;margin:0 auto;padding:24px 24px 48px}.list-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;display:flex}.list-header h1{font-size:22px;font-weight:500}.list-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.search{background:var(--white);border:1px solid var(--line);height:36px;color:var(--ink-3);border-radius:7px;align-items:center;gap:6px;padding:0 10px;display:flex}.search:focus-within{outline:2px solid var(--blue);outline-offset:1px}.search input{width:150px;color:var(--ink);background:0 0;border:0;outline:0}.list-actions .primary{height:36px}.list-empty{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:50vh;display:flex}.list-empty h2{font-size:18px;font-weight:500}.list-empty p,.list-none{color:var(--ink-2)}.board-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px 16px;margin:0;padding:0;list-style:none;display:grid}.board-open{aspect-ratio:8/5;background:var(--white);border:1px solid var(--line);border-radius:8px;width:100%;padding:0;display:block;overflow:hidden}.board-open:hover{background:var(--white);border-color:var(--ink-3)}.board-open img{object-fit:contain;width:100%;height:100%;display:block}.board-blank{background-image:radial-gradient(#d5dae1 1px,#0000 1px);background-size:16px 16px;height:100%;display:block}.board-meta{justify-content:space-between;align-items:flex-start;gap:4px;margin-top:6px;display:flex;position:relative}.board-text{flex-direction:column;flex:1;min-width:0;display:flex}.board-text strong{text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.board-text small{color:var(--ink-3);font-size:12px}.rename{border:1px solid var(--blue);border-radius:5px;width:100%;padding:0 4px}.menu{z-index:5;background:var(--white);border:1px solid var(--line);border-radius:8px;min-width:160px;padding:4px;position:absolute;top:30px;right:0;box-shadow:0 6px 20px #1e273324}.menu button{text-align:left;background:0 0;border:0;border-radius:5px;align-items:center;gap:8px;width:100%;padding:6px 8px;display:flex}.menu button:hover{background:var(--hover)}.menu .danger{color:var(--red)}.dialog-back{z-index:20;background:#1e273359;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.dialog{background:var(--white);border-radius:12px;flex-direction:column;gap:8px;width:min(380px,100%);padding:20px;display:flex}.dialog h2{overflow-wrap:anywhere;font-size:16px;font-weight:500}.dialog p{color:var(--ink-2)}.dialog-actions{justify-content:flex-end;gap:8px;margin-top:8px;display:flex}.danger-fill{background:var(--red);border-color:var(--red);color:#fff}.danger-fill:hover{background:#a82620}.board{position:fixed;inset:0;overflow:hidden}.stage{position:absolute;inset:0}.stage canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.stage .overlay{touch-action:none}.panel{background:var(--white);border:1px solid var(--line);border-radius:10px;position:absolute}.top-left{align-items:center;gap:4px;max-width:calc(100vw - 340px);padding:3px 6px 3px 3px;display:flex;top:12px;left:12px}.title-input{text-overflow:ellipsis;background:0 0;border:0;border-radius:5px;width:260px;max-width:100%;padding:3px 6px;font-weight:500}.title-input:hover{background:var(--hover)}.top-right{align-items:center;gap:2px;padding:3px;display:flex;top:12px;right:12px}.save-badge{color:var(--ink-2);white-space:nowrap;align-items:center;gap:4px;padding:0 8px;font-size:13px;display:inline-flex}.save-badge.error,.save-badge.login,.save-badge.conflict{color:var(--red)}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spin{animation:none}}.banner{z-index:6;color:#7f1d18;background:#fdecea;border:1px solid #f3c1bc;border-radius:8px;align-items:center;gap:12px;max-width:calc(100vw - 32px);padding:8px 12px;display:flex;position:absolute;top:64px;left:50%;transform:translate(-50%)}.banner button{white-space:nowrap}.toolbar{flex-direction:column;align-items:center;gap:2px;width:46px;padding:4px;display:flex;top:66px;left:12px}.toolbar hr{border:0;border-top:1px solid var(--line);width:26px;margin:3px 0}.tool{color:#333d4a;background:0 0;border:0;border-radius:7px;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex}.tool:hover{background:var(--hover)}.tool.active,.tool.active:hover{background:var(--ink);color:#fff}.tool-group{position:relative}.flyout{z-index:5;gap:2px;padding:4px;display:flex;top:-5px;left:44px}.style-panel{z-index:4;flex-direction:column;gap:8px;padding:8px;display:flex;top:66px;left:68px}.style-row{align-items:center;gap:6px;display:flex}.swatch{border:1px solid #1e273333;border-radius:50%;width:20px;height:20px;padding:0}.swatch:hover{box-shadow:0 0 0 2px var(--line-2)}.swatch.active,.swatch.active:hover{box-shadow:0 0 0 2px var(--white), 0 0 0 4px var(--blue)}.swatch.none{background:linear-gradient(135deg, var(--white) 46%, var(--red) 46%, var(--red) 54%, var(--white) 54%)}.width{background:0 0;border:0;border-radius:6px;place-items:center;width:28px;height:28px;padding:0;display:grid}.width span{background:var(--ink);border-radius:50%;display:block}.width.active,.font-size.active{background:var(--hover);box-shadow:inset 0 0 0 1px var(--blue)}.font-size{background:0 0;border:0;border-radius:6px;min-width:28px;height:28px;padding:0 5px;font-size:13px}.zoom{align-items:center;padding:2px;display:flex;bottom:12px;right:12px}.zoom-value{background:0 0;border:0;min-width:54px;padding:4px;font-size:13px}.board-hint{max-width:calc(100vw - 180px);color:var(--ink-3);text-align:center;pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.toast{z-index:8;background:var(--ink);color:#fff;border-radius:8px;max-width:calc(100vw - 32px);padding:8px 14px;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.text-editor{transform-origin:0 0;resize:none;word-break:break-all;white-space:pre-wrap;z-index:3;background:0 0;border:0;outline:0;margin:0;padding:0;position:absolute;overflow:hidden}.text-editor[wrap=off]{white-space:pre}@media (width<=640px){.top-left{max-width:calc(100vw - 24px)}.top-right{inset:auto auto 12px 12px}.save-badge{font-size:12px}}.trash-title{align-items:center;gap:6px;display:flex}.list-note{color:var(--ink-2);margin-bottom:16px}.board-open:disabled{opacity:1;cursor:default}.board-meta>button.with-icon{flex:none;padding:3px 8px;font-size:13px}.stage-lock{z-index:4;position:absolute;inset:0}.banner a{color:inherit;white-space:nowrap}.dialog .version-list{max-height:50vh;margin:4px 0 0;padding:0;list-style:none;overflow:auto}.version-list li{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:6px 0;display:flex}.version-list small{color:var(--ink-3);margin-left:8px}.save-badge.gone{color:var(--red)}
