body{margin:0}:root{--header-height:48px;--sidebar-width:200px;--panel-width:240px;--toolbar-height:40px;--border-color:#d0d0d0;--bg-color:#f5f5f5;--panel-bg:#fff;--primary:#2563eb;--primary-hover:#1d4ed8;--danger:#dc2626;--warn:#f59e0b}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;font-family:Noto Sans JP,sans-serif}.app-root{flex-direction:column;height:100vh;display:flex;overflow:hidden}.app-header{height:var(--header-height);background:var(--panel-bg);border-bottom:1px solid var(--border-color);flex-shrink:0;align-items:center;gap:12px;padding:0 12px;display:flex}.header-left,.header-right{align-items:center;gap:8px;display:flex}.header-center{flex:1;align-items:center;gap:4px;display:flex}.app-logo{white-space:nowrap;font-size:15px;font-weight:700}.header-btn{border:1px solid var(--border-color);background:var(--panel-bg);cursor:pointer;white-space:nowrap;border-radius:4px;padding:6px 10px;font-size:13px}.header-btn:hover:not(:disabled){background:#e8e8e8}.header-btn:disabled{opacity:.4;cursor:default}.header-btn.logout{border-color:var(--danger);color:var(--danger)}.header-divider{background:var(--border-color);width:1px;height:24px;margin:0 4px}.zoom-display{text-align:center;min-width:40px;font-size:13px}.file-name{color:#666;text-overflow:ellipsis;white-space:nowrap;max-width:200px;font-size:12px;overflow:hidden}.user-email{color:#666;font-size:12px}.app-body{flex:1;display:flex;overflow:hidden}.page-sidebar{width:var(--sidebar-width);background:var(--panel-bg);border-right:1px solid var(--border-color);flex-direction:column;flex-shrink:0;display:flex;overflow:hidden}.sidebar-header,.panel-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:8px 12px;font-size:13px;font-weight:600;display:flex}.collapse-btn{cursor:pointer;background:0 0;border:none;font-size:14px}.sidebar-actions{gap:4px;padding:8px;display:flex}.sidebar-btn{border:1px solid var(--border-color);background:var(--panel-bg);cursor:pointer;border-radius:4px;padding:4px 8px;font-size:12px}.sidebar-btn:hover{background:#e8e8e8}.page-list{flex:1;padding:8px;overflow-y:auto}.page-thumb{cursor:pointer;background:#fafafa;border:2px solid #0000;border-radius:4px;margin-bottom:8px;padding:4px;position:relative}.page-thumb.selected{border-color:var(--primary)}.page-thumb.drag-over{border-color:var(--warn);border-style:dashed}.thumb-number{color:#666;margin-bottom:2px;font-size:11px}.thumb-image{background:#fff;border:1px solid #e0e0e0;justify-content:center;align-items:center;width:100%;height:120px;display:flex;overflow:hidden}.thumb-image img{object-fit:contain;max-width:100%;max-height:100%}.thumb-blank,.thumb-loading{color:#999;font-size:12px}.thumb-size{color:#999;margin-top:2px;font-size:10px}.thumb-menu-btn{cursor:pointer;background:#fffc;border:none;border-radius:4px;padding:2px 6px;position:absolute;top:4px;right:4px}.thumb-menu{background:var(--panel-bg);border:1px solid var(--border-color);z-index:10;border-radius:4px;position:absolute;top:28px;right:4px;box-shadow:2px 2px 8px #00000026}.thumb-menu button{cursor:pointer;text-align:left;background:0 0;border:none;width:100%;padding:6px 12px;font-size:12px;display:block}.thumb-menu button:hover{background:#e8e8e8}.thumb-menu .menu-danger{color:var(--danger)}.editor-canvas{background:var(--bg-color);flex-direction:column;flex:1;display:flex;overflow:hidden}.editor-canvas.empty{justify-content:center;align-items:center}.toolbar{background:var(--panel-bg);border-bottom:1px solid var(--border-color);height:var(--toolbar-height);flex-shrink:0;align-items:center;gap:2px;padding:6px 12px;display:flex}.tool-btn{border:1px solid var(--border-color);background:var(--panel-bg);cursor:pointer;border-radius:4px;padding:4px 10px;font-size:12px}.tool-btn:hover{background:#e8e8e8}.tool-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}.canvas-container{flex:1;justify-content:center;align-items:flex-start;padding:20px;display:flex;overflow:auto}.canvas-stack{box-shadow:0 2px 8px #00000026}.pdf-layer{display:block}.fabric-layer{pointer-events:auto}.drop-zone{text-align:center;padding:40px}.drop-zone-icon{margin-bottom:16px;font-size:48px}.drop-zone-text{margin-bottom:12px;font-size:16px}.drop-zone-btn{border:1px solid var(--border-color);cursor:pointer;background:var(--panel-bg);border-radius:4px;padding:10px 20px;font-size:14px;display:inline-block}.drop-zone-btn:hover{background:#e8e8e8}.drop-zone-note{color:#666;margin-top:16px;font-size:12px}.drop-zone-warn{color:var(--warn);font-size:12px}.property-panel{width:var(--panel-width);background:var(--panel-bg);border-left:1px solid var(--border-color);flex-direction:column;flex-shrink:0;display:flex;overflow:hidden}.panel-empty{color:#999;text-align:center;padding:20px;font-size:13px}.panel-hint{color:#aaa;margin-top:8px;font-size:11px}.panel-content{flex:1;padding:12px;overflow-y:auto}.prop-group{margin-bottom:16px}.prop-label{color:#666;margin-bottom:4px;font-size:12px;display:block}.prop-textarea{border:1px solid var(--border-color);resize:vertical;border-radius:4px;width:100%;min-height:60px;padding:6px;font-family:inherit;font-size:13px}.char-count{color:#999;text-align:right;margin-top:2px;font-size:10px;display:block}.prop-input,.prop-select{border:1px solid var(--border-color);border-radius:4px;width:100%;margin-bottom:8px;padding:4px 6px;font-size:13px}.prop-color{border:1px solid var(--border-color);cursor:pointer;border-radius:4px;width:100%;height:30px;margin-bottom:8px}.prop-range{width:100%;margin-bottom:8px}.prop-actions{grid-template-columns:1fr 1fr;gap:4px;display:grid}.prop-btn{border:1px solid var(--border-color);background:var(--panel-bg);cursor:pointer;border-radius:4px;padding:6px;font-size:12px}.prop-btn:hover{background:#e8e8e8}.prop-btn.danger{border-color:var(--danger);color:var(--danger)}.panel-expand-btn{border:1px solid var(--border-color);background:var(--panel-bg);cursor:pointer;border-radius:4px;align-self:center;padding:8px 4px;font-size:14px}.panel-expand-btn.left{border-right:none;border-radius:0 4px 4px 0}.panel-expand-btn.right{border-left:none;border-radius:4px 0 0 4px}.toast{color:#fff;cursor:pointer;z-index:1000;border-radius:4px;max-width:80%;padding:12px 24px;font-size:14px;position:fixed;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 4px 12px #0003}.toast-info{background:var(--primary)}.toast-error{background:var(--danger)}.toast-warn{background:var(--warn);color:#333}.confirm-overlay{z-index:1000;background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.confirm-dialog{background:var(--panel-bg);border-radius:8px;max-width:400px;padding:24px;box-shadow:0 4px 16px #0003}.confirm-dialog p{margin-bottom:16px;font-size:14px}.confirm-buttons{justify-content:flex-end;gap:8px;display:flex}.btn-yes,.btn-no{border:1px solid var(--border-color);cursor:pointer;border-radius:4px;padding:8px 16px;font-size:14px}.btn-yes{background:var(--primary);color:#fff;border-color:var(--primary)}.btn-no{background:var(--panel-bg)}.busy-overlay{z-index:1000;background:#0000004d;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.busy-spinner{border:4px solid #e0e0e0;border-top-color:var(--primary);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.font-loading{color:#fff;z-index:100;background:#000000b3;border-radius:4px;padding:6px 16px;font-size:12px;position:fixed;top:8px;left:50%;transform:translate(-50%)}.auth-loading,.auth-required{flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100vh;display:flex}