*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden;background:#f0f0f0}#app{display:flex;flex-direction:column;height:100vh;width:100vw}#toolbar{display:flex;align-items:center;padding:4px 8px;background:#fff;border-bottom:1px solid #ddd;gap:4px;flex-shrink:0;min-height:36px;flex-wrap:wrap}.toolbar-group{display:flex;align-items:center;gap:4px}.toolbar-sep{width:1px;height:20px;background:#ddd;margin:0 4px}#toolbar button{display:flex;align-items:center;gap:4px;padding:4px 8px;border:1px solid #ccc;border-radius:4px;background:#fff;cursor:pointer;font-size:12px;color:#333;white-space:nowrap}#toolbar button:hover:not(:disabled){background:#f0f0f0;border-color:#999}#toolbar button:disabled{opacity:.4;cursor:default}#toolbar button.btn-primary{background:#2563eb;color:#fff;border-color:#1d4ed8}#toolbar button.btn-primary:hover:not(:disabled){background:#1d4ed8}#toolbar button.mode-btn.active,#toolbar button#btn-marquee.active{background:#e0edff;border-color:#2563eb;color:#1d4ed8}#zoom-level{font-size:12px;min-width:40px;text-align:center;color:#555}#page-input{width:40px;text-align:center;padding:2px 4px;border:1px solid #ccc;border-radius:3px;font-size:12px}#page-input:disabled{background:#f5f5f5}#toolbar span{font-size:12px;color:#555}#toolbar select{padding:3px 6px;border:1px solid #ccc;border-radius:4px;font-size:12px;background:#fff}#search-panel{display:flex;align-items:center;gap:6px;padding:4px 8px;background:#fafafa;border-bottom:1px solid #ddd;flex-shrink:0}#search-panel.hidden{display:none}#search-input{padding:3px 8px;border:1px solid #ccc;border-radius:4px;font-size:12px;width:200px}#search-input:focus{outline:none;border-color:#2563eb}#search-results{font-size:12px;color:#555;min-width:40px}#search-panel button{padding:2px 8px;border:1px solid #ccc;border-radius:4px;background:#fff;cursor:pointer;font-size:12px;color:#333}#search-panel button:hover{background:#f0f0f0}#search-panel label{font-size:11px;color:#555;display:flex;align-items:center;gap:2px;cursor:pointer}#search-panel input[type=checkbox]{margin:0}#content{display:flex;flex:1;overflow:hidden}#sidebar{width:140px;background:#e8e8e8;border-right:1px solid #ccc;overflow-y:auto;flex-shrink:0;display:none}#sidebar.visible{display:block}#thumbnail-list{padding:8px;display:flex;flex-direction:column;gap:8px}.thumbnail-item{cursor:pointer;border:2px solid transparent;border-radius:4px;padding:4px;background:#fff;text-align:center;transition:border-color .15s}.thumbnail-item:hover{border-color:#999}.thumbnail-item.active{border-color:#2563eb}.thumbnail-item canvas{width:100%;display:block}.thumbnail-item .page-num{font-size:10px;color:#666;margin-top:2px}#viewport{flex:1;overflow:auto;position:relative;background:gray}#viewport.mode-pointer{cursor:default}#viewport.mode-pan,#viewport.mode-pan-space{cursor:grab}#viewport.mode-pan:active,#viewport.mode-pan-space:active{cursor:grabbing}#viewport.mode-marquee{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Ccircle cx='10' cy='10' r='7' fill='white' stroke='%23333' stroke-width='1.5'/%3E%3Cline x1='15' y1='15' x2='22' y2='22' stroke='%23333' stroke-width='2' stroke-linecap='round'/%3E%3Cline x1='7' y1='10' x2='13' y2='10' stroke='%23333' stroke-width='1.5' stroke-linecap='round'/%3E%3Cline x1='10' y1='7' x2='10' y2='13' stroke='%23333' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") 10 10,zoom-in}#page-container{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px;min-height:100%;width:max-content;min-width:100%}.page-wrapper{position:relative;box-shadow:0 2px 8px #0000004d;background:#fff}.page-wrapper canvas{display:block}.text-layer{position:absolute;inset:0;overflow:hidden;opacity:.25;line-height:1}.text-layer>span{color:transparent;position:absolute;white-space:pre;transform-origin:0% 0%}.text-layer>span::selection{background:#2563eb;color:transparent}.text-layer>span::-moz-selection{background:#2563eb;color:transparent}.text-layer mark.search-highlight{background:#ffe60080;color:transparent;border-radius:2px;padding:0}.text-layer mark.search-highlight-active{background:#ff8c00b3}#viewport.mode-pan .text-layer,#viewport.mode-pan-space .text-layer{pointer-events:none}#viewport.mode-pointer .text-layer{pointer-events:auto;cursor:text}#marquee-overlay{position:absolute;border:2px dashed #2563eb;background:#2563eb1a;pointer-events:none;z-index:10}#marquee-overlay.hidden{display:none}#empty-state{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#888}#empty-state.hidden{display:none}#empty-state p{margin:12px 0;font-size:14px}#empty-state button{padding:8px 20px;border:1px solid #aaa;border-radius:6px;background:#fff;cursor:pointer;font-size:13px}#empty-state button:hover{background:#eee}#footer{padding:3px 8px;background:#f5f5f5;border-top:1px solid #ddd;font-size:10px;color:#888;text-align:center;flex-shrink:0}#footer a{color:#666;text-decoration:none}#footer a:hover{text-decoration:underline}#footer .sep{margin:0 4px;color:#ccc}#toast{position:fixed;bottom:40px;left:50%;transform:translate(-50%);padding:8px 16px;border-radius:6px;font-size:13px;color:#fff;background:#333;z-index:1000;transition:opacity .3s}#toast.hidden{opacity:0;pointer-events:none}#toast.success{background:#16a34a}#toast.error{background:#dc2626}#context-menu{position:fixed;background:#fff;border:1px solid #ccc;border-radius:6px;box-shadow:0 4px 12px #00000026;z-index:2000;padding:4px 0;min-width:180px}#context-menu.hidden{display:none}#context-menu button{display:block;width:100%;padding:6px 14px;border:none;background:none;text-align:left;font-size:12px;color:#333;cursor:pointer;white-space:nowrap}#context-menu button:hover{background:#e8f0fe;color:#1a73e8}#auth-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#808080f2;z-index:100}#auth-overlay.hidden{display:none}.auth-card{background:#fff;border-radius:12px;padding:32px 40px;text-align:center;box-shadow:0 4px 20px #00000026;max-width:360px}.auth-card svg{margin-bottom:16px}.auth-card h3{font-size:18px;color:#333;margin-bottom:8px}.auth-card p{font-size:13px;color:#666;margin-bottom:20px;line-height:1.4}.auth-card button{padding:10px 28px;font-size:14px;border-radius:6px}.toolbar-right{margin-left:auto}.user-email{font-size:11px;color:#555;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#help-panel{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#00000080;z-index:90}#help-panel.hidden{display:none}.help-card{background:#fff;border-radius:10px;box-shadow:0 8px 30px #00000040;width:480px;max-width:90vw;max-height:80vh;display:flex;flex-direction:column}.help-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #e5e5e5;flex-shrink:0}.help-header h3{font-size:16px;font-weight:600;color:#333;margin:0}.help-header button{background:none;border:none;font-size:20px;color:#999;cursor:pointer;padding:0 4px;line-height:1}.help-header button:hover{color:#333}.help-body{padding:16px 18px;overflow-y:auto;flex:1}.help-body section{margin-bottom:16px}.help-body section:last-child{margin-bottom:0}.help-body h4{font-size:13px;font-weight:600;color:#2563eb;margin-bottom:6px;text-transform:uppercase;letter-spacing:.3px}.help-body p{font-size:12px;color:#444;line-height:1.5;margin:0}.help-body ul{list-style:none;padding:0;margin:0}.help-body li{font-size:12px;color:#444;line-height:1.5;padding:2px 0 2px 14px;position:relative}.help-body li:before{content:"•";color:#999;position:absolute;left:0}.help-shortcuts{width:100%;border-collapse:collapse}.help-shortcuts td{font-size:12px;color:#444;padding:3px 8px 3px 0}.help-shortcuts td:first-child{white-space:nowrap;width:100px}.help-footer{margin-top:16px;padding-top:12px;border-top:1px solid #e5e5e5;text-align:center}.help-footer a{font-size:12px;color:#2563eb;text-decoration:none}.help-footer a:hover{text-decoration:underline}#toolbar button#btn-help.active{background:#e0edff;border-color:#2563eb;color:#1d4ed8}