:root{--bg: #f3f4f6;--surface: #ffffff;--surface-alt: #f0f2f5;--border: #d9dde3;--text: #1b1f24;--muted: #5b636e;--accent: #1f5fbf;--accent-hover: #1a509f;--accent-weak: #e7effb;--warning: #8a5a00;--warning-weak: #fdf3df;--success: #1c6b3c;--success-weak: #e5f4ea;--radius: 6px;--radius-lg: 10px;--shadow-md: 0 4px 16px rgb(16 24 40 / 12%);color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Hiragino Sans,Noto Sans JP,Yu Gothic UI,system-ui,sans-serif;font-size:14px;color:var(--text);background:var(--bg)}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.shell{display:flex;flex-direction:column;height:100%}.shell-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;min-height:40px;padding:4px 14px;background:var(--surface-alt);border-bottom:1px solid var(--border);font-size:13px}.spacer{flex:1}.plan-status,.account{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-width:0}.plan-chip{border-radius:999px;padding:1px 9px;font-size:12px;font-weight:600;background:var(--surface);border:1px solid var(--border);white-space:nowrap}.plan-chip-premium{color:var(--success);background:var(--success-weak);border-color:transparent}.plan-note{color:var(--muted)}.account-email{max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:30px;padding:4px 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);cursor:pointer;white-space:nowrap}.btn:hover:not(:disabled){background:var(--surface-alt)}.btn:disabled{cursor:default;opacity:.6}.btn-primary{color:#fff;background:var(--accent);border-color:var(--accent)}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-ghost{background:transparent;border-color:transparent}.link-button{padding:0;border:0;background:none;color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:2px}.banner{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:6px 14px;color:var(--warning);background:var(--warning-weak);border-bottom:1px solid var(--border);font-size:13px}.icon-close{margin-left:auto;border:0;background:none;font-size:18px;line-height:1;cursor:pointer}.editor-frame{flex:1;width:100%;min-height:0;border:0;display:block}.backdrop{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;background:#10182873}.backdrop-raised{z-index:110}.dialog{width:min(460px,100%);padding:22px 24px 18px;background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);line-height:1.7}.dialog h2{margin:0 0 8px;font-size:17px}.dialog p{margin:0 0 10px}.dialog-note{color:var(--muted);font-size:12px}.dialog-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:14px}.upsell{margin:14px 0 0!important;padding-top:10px;border-top:1px solid var(--border);font-size:13px;text-align:center}.countdown{height:6px;margin:6px 0 4px;border-radius:999px;background:var(--accent-weak);overflow:hidden}.countdown-fill{height:100%;background:var(--accent);transition:width 1s linear}.plan-benefits{margin:0 0 12px;padding-left:20px}.plan-current{padding:8px 12px;border-radius:var(--radius);background:var(--surface-alt)}.watching-bar{position:fixed;left:50%;bottom:16px;z-index:90;display:flex;align-items:center;gap:12px;padding:6px 8px 6px 16px;transform:translate(-50%);background:var(--surface);border:1px solid var(--border);border-radius:999px;box-shadow:var(--shadow-md);font-size:13px;white-space:nowrap}