*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;margin:0;font-family:sans-serif;overflow:hidden}.sidebar{z-index:100;background:#fff;border-right:1px solid #efefef;flex-direction:column;width:280px;height:100vh;display:flex;position:fixed;top:0;left:0;overflow:hidden}.canvas-area{background:50%/100% 100% no-repeat;justify-content:center;align-items:center;display:flex;position:fixed;inset:0 0 0 260px;overflow:hidden}.mat-container{background:url(/travel-journal/assets/bg-table-ZLlN0i-f.png) 50%/100% 100% no-repeat;border-radius:18px;justify-content:center;align-items:center;width:70%;height:80%;display:flex;position:relative;transform:perspective(1200px)rotateX(1deg);box-shadow:0 24px 48px #00000059,0 6px 12px #0003}.mat-inner{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.passport-wrapper{flex-direction:column;align-items:center;gap:16px;display:flex}.booklet-3d{transform-origin:50%;filter:drop-shadow(0 20px 40px #0006)drop-shadow(0 6px 10px #0003);width:1160px;height:820px;position:relative;transform:perspective(1400px)rotateX(4deg)}.booklet-3d.turning-right{animation:.6s ease-in-out forwards turnPageRight}.booklet-3d.turning-left{animation:.6s ease-in-out forwards turnPageLeft}@keyframes turnPageRight{0%{transform:perspective(1400px)rotateX(4deg)rotateY(0)}50%{transform:perspective(1400px)rotateX(4deg)rotateY(-90deg)}to{transform:perspective(1400px)rotateX(4deg)rotateY(0)}}@keyframes turnPageLeft{0%{transform:perspective(1400px)rotateX(4deg)rotateY(0)}50%{transform:perspective(1400px)rotateX(4deg)rotateY(90deg)}to{transform:perspective(1400px)rotateX(4deg)rotateY(0)}}.booklet-base{object-fit:fill;z-index:0;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0}.booklet-canvas{z-index:1;position:absolute;inset:0}.booklet-canvas-over{outline-offset:-8px;border-radius:6px;outline:2px dashed #c8a96e99}.passport-nav{align-items:center;gap:12px;display:flex}.passport-nav-label{color:#fff;letter-spacing:1px;text-shadow:0 1px 3px #0000004d;font-family:serif;font-size:13px}.passport-nav-hint{color:#fff9;letter-spacing:1px;font-family:serif;font-size:11px}.toolbar-panel{scrollbar-width:none;flex-direction:column;flex:1;gap:0;padding:20px 16px;display:flex;overflow:hidden auto}.toolbar-panel::-webkit-scrollbar{display:none}.tb-section{flex-direction:column;gap:12px;padding:4px 0 16px;display:flex}.tb-section-label{letter-spacing:1.5px;color:#999;text-transform:uppercase;font-family:sans-serif;font-size:10px;font-weight:600}.tb-section-row{justify-content:space-between;align-items:center;display:flex}.tb-divider{background:#f0f0f0;flex-shrink:0;width:100%;height:1px;margin-bottom:16px}.tb-elements-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.tb-element-btn{cursor:pointer;background:#fff;border:1.5px solid #efefef;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:6px;height:80px;padding:14px 8px;transition:border .2s,background .2s;display:flex}.tb-element-btn-2{cursor:pointer;background:#fff;border:1.5px solid #efefef;border-radius:10px;align-items:center;gap:16px;height:80px;padding:14px 8px;transition:border .2s,background .2s;display:flex}.tb-element-btn:hover{background:#fafafa;border-color:#ddd}.tb-element-icon{color:#555;font-size:20px;line-height:1}.tb-element-text{letter-spacing:1px;color:#777;text-transform:uppercase;font-family:sans-serif;font-size:14px;font-weight:500}.tb-sticky-btn{aspect-ratio:1;object-fit:cover;cursor:pointer;border:1.5px solid #efefef;border-radius:10px;width:100%;height:80px;transition:transform .15s,filter .15s}.tb-sticky-btn:hover{filter:brightness(1.05);transform:scale(1.04)}.tb-sticky-btn:active{transform:scale(.97)}.tb-pagination{gap:4px;display:flex}.tb-page-btn{cursor:pointer;color:#666;background:#fff;border:1.5px solid #efefef;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;line-height:1;transition:border .2s;display:flex}.tb-page-btn:hover:not(:disabled){color:#333;border-color:#aaa}.tb-page-btn:disabled{opacity:.3;cursor:default}.tb-item-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.tb-scroll{scrollbar-width:thin;scrollbar-color:#eee transparent;max-height:160px;overflow-y:auto}.tb-scroll::-webkit-scrollbar{width:3px}.tb-scroll::-webkit-scrollbar-thumb{background:#eee;border-radius:2px}.tb-item{cursor:grab;border:1.5px solid #0000;border-radius:8px;flex-direction:column;align-items:center;gap:3px;padding:6px 4px;transition:border .2s,background .2s;display:flex}.tb-item:hover{background:#fafafa;border-color:#efefef}.tb-item-img{object-fit:contain;width:80px;height:80px}.tb-item-placeholder{color:#aaa;text-align:center;background:#f5f5f5;border:1.5px dashed #ddd;border-radius:6px;justify-content:center;align-items:center;width:80px;height:80px;padding:4px;font-family:sans-serif;font-size:8px;display:flex}.tb-item-label{color:#999;text-align:center;letter-spacing:.3px;font-family:sans-serif;font-size:8px}.tb-empty{color:#ccc;text-align:center;grid-column:span 3;padding:8px 0;font-family:sans-serif;font-size:10px}.tb-bg-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.tb-bg-circle{cursor:pointer;border:2px solid #0000;border-radius:50%;width:56px;height:56px;transition:border .2s;overflow:hidden}.tb-bg-circle:hover{border-color:#aaa}.tb-bg-circle img{object-fit:cover;width:100%;height:100%}.tb-bg-add{color:#aaa;cursor:pointer;background:#f5f5f5;border:1.5px dashed #ddd;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:16px;display:flex}.tb-bg-add:hover{color:#666;border-color:#aaa}.selection-wrapper{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.selection-content{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.selection-content-active{outline-offset:2px;border-radius:2px;outline:2px solid #4a90d9}.selection-controls-top{z-index:100;white-space:nowrap;background:#fff;border-radius:10px;gap:4px;padding:6px 10px;display:flex;position:absolute;top:-44px;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #00000026}.sel-ctrl-btn{color:#555;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;transition:background .15s,color .15s;display:flex}.sel-ctrl-btn:hover{color:#222;background:#f5f5f5}.sel-ctrl-delete:hover{color:#e53935;background:#fff0f0}.selection-rotate-handle{cursor:grab;color:#555;z-index:100;background:#fff;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;display:flex;position:absolute;bottom:-32px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #00000026}.selection-rotate-handle:hover{color:#4a90d9}.selection-rotate-handle:active{cursor:grabbing}.stamp-item-img{object-fit:contain;pointer-events:none;width:100%;height:100%;display:block}.stamp-item-placeholder{color:#1a3a5c;text-align:center;background:#c8a96e26;border:2px dashed #c8a96e;border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;padding:6px;font-family:serif;font-size:11px;display:flex}.sticky-note{cursor:grab;width:100%;height:100%;position:relative}.sticky-note:active{cursor:grabbing}.sticky-note-bg{object-fit:fill;pointer-events:none;z-index:0;width:100%;height:100%;position:absolute;inset:0}.sticky-note-textarea{resize:none;color:#444;z-index:1;cursor:inherit;background:0 0;border:none;outline:none;font-family:Patrick Hand,cursive,sans-serif;font-size:13px;line-height:1.6;position:absolute;inset:30% 8% 8%;overflow:hidden}.sticky-note-textarea[readonly]{cursor:grab}.sticky-note-textarea::placeholder{color:#bbb}.textbox{cursor:grab;width:100%;height:100%}.textbox:active{cursor:grabbing}.textbox-textarea{resize:none;color:#1a3a5c;width:100%;height:100%;cursor:inherit;background:0 0;border:none;outline:none;font-family:Patrick Hand,cursive,sans-serif;font-size:14px;line-height:1.6;overflow:hidden}.textbox-textarea[readonly]{cursor:grab}.textbox-textarea::placeholder{color:#bbb}.stamp-drag-overlay{opacity:.9;pointer-events:none;filter:drop-shadow(0 4px 8px #0000004d);width:80px;height:80px}.stamp-drag-overlay img{object-fit:contain;width:100%;height:100%}.sidebar-actions{border-top:1px solid #f0f0f0;flex-direction:row;flex-shrink:0;justify-content:center;align-items:center;gap:12px;padding:12px 16px;display:flex}.action-btn-img{object-fit:contain;cursor:pointer;flex:1;width:50%;transition:transform .15s,filter .15s}.action-btn-img:hover{filter:brightness(1.05);transform:scale(1.01)}.action-btn-img:active{transform:scale(.97)}@media (width<=768px){.sidebar{z-index:100;border-top:1px solid #efefef;border-right:none;flex-direction:row;width:100%;height:auto;position:fixed;top:auto;bottom:0}.canvas-area{bottom:80px;left:0}.booklet-3d{width:340px;height:460px}}.tb-element-btn-wide{grid-column:span 2;height:80px}@media screen and (width<=900px) and (orientation:portrait){body{transform-origin:0 0;width:100vh;height:100vw;position:absolute;top:0;left:100%;transform:rotate(90deg)}.container{aspect-ratio:16/9;background:#f0f0f0;width:100%}.sidebar{z-index:100;scroll-behavior:smooth;background:#fff;border-right:1px solid #efefef;flex-direction:column;width:200px;height:100vh;display:flex;position:fixed;top:0;left:0;overflow:hidden auto}.sidebar-actions{height:52px}.action-btn-img{height:48px}}.sel-ctrl-layer-wrapper{position:relative}.sel-layer-menu{z-index:200;white-space:nowrap;background:#fff;border-radius:8px;min-width:140px;position:absolute;top:36px;left:0;overflow:hidden;box-shadow:0 4px 16px #00000026}.sel-layer-option{text-align:left;color:#333;cursor:pointer;background:0 0;border:none;width:100%;padding:10px 14px;font-family:sans-serif;font-size:12px;transition:background .15s;display:block}.sel-layer-option:hover{background:#f5f5f5}