:root{--Font-Family:monospace, "Courier New";--Font-Size-20:20px;--Font-Size-16:16px;--Font-Size-13:13px;--Font-Size-12:12px;--Font-Size-10:10px;--Font-Weight-700:700;--Font-Weight-400:400;--Font-Letter-Spacing-0:0;--Font-Letter-Spacing-05:.5px;--Font-Letter-Spacing-1:1px;--Font-Letter-Spacing-15:1.5px;--Font-Line-Height-1:1;--Font-Line-Height-14:1.4;--White:#fff;--Black:#000;--Selection-White:#fff;--Selection-Black:#000000d7;--Overlay:#ffffffab;--Layer_Completed:#00000015;--Blue:#003757}[data-theme=dark]{--White:#0f0f0f;--Black:#dddcdc;--Selection-White:#000000d7;--Selection-Black:#ffffffe7;--Overlay:#222222ab;--Layer_Completed:#dadada15;--Blue:#0080ca}::selection{color:var(--Selection-White);background-color:var(--Selection-Black)}::-webkit-scrollbar{width:6px;height:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--Selection-Black);background-clip:padding-box;border:1px solid #0000;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--Selection-Black);background-clip:padding-box;border:1px solid #0000;border-radius:5px}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--White);width:100vw;height:100vh;color:var(--Black);font-family:var(--Font-Family);transition:background-color .2s,color .2s;overflow-y:auto}.app-root{width:100vw;height:100vh;display:flex;overflow:hidden}.scroll-lock-btn{display:none}.sidebar{border-right:2px solid var(--Black);flex-direction:column;flex-shrink:0;width:30%;max-width:320px;height:100vh;padding:20px;display:flex}.sidebar-title{font-size:var(--Font-Size-20);letter-spacing:var(--Font-Letter-Spacing-15);font-weight:var(--Font-Weight-700);align-self:center;margin-bottom:16px;padding-bottom:6px}.sidebar-textarea{resize:none;border:2px solid var(--Black);width:100%;font-family:inherit;font-size:var(--Font-Size-13);line-height:var(--Font-Line-Height-14);color:var(--Black);background:var(--White);outline:none;flex:1;max-height:24lh;padding:10px}.sidebar-Json-textarea{resize:none;border:2px solid var(--Black);width:100%;font-family:var(--Font-Family);font-size:var(--Font-Size-13);line-height:var(--Font-Line-Height-14);color:var(--Black);background:var(--White);white-space:pre;tab-size:2;outline:none;flex:1;max-height:24lh;padding:10px;overflow-x:auto}.sidebar-textarea::placeholder,.sidebar-Json-textarea::placeholder{color:var(--Black);opacity:.35}.sidebar-button{border:2px solid var(--Black);background:var(--Black);color:var(--White);font-family:inherit;font-size:var(--Font-Size-13);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-15);cursor:pointer;width:100%;margin-top:14px;padding:12px}.sidebar-button:hover,.sidebar-save-btn:hover{background:var(--White);color:var(--Black)}.sidebar-Json-btn-container{flex-direction:row;gap:8px;width:100%;display:flex}.sidebar-save-btn{border:2px solid var(--Black);background:var(--Black);color:var(--White);font-family:inherit;font-size:var(--Font-Size-13);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-15);cursor:pointer;margin-top:14px;padding:2px 8px}.sidebar-error{border:2px solid var(--Black);margin-top:14px;padding:10px}.sidebar-error-title{font-weight:var(--Font-Weight-700);font-size:var(--Font-Size-12);letter-spacing:var(--Font-Letter-Spacing-1);border-bottom:1px solid var(--Black);margin-bottom:6px;padding-bottom:6px}.sidebar-error-text{font-size:var(--Font-Size-12);word-break:break-word;white-space:pre-wrap}.canvas-area{flex:1;height:100vh;position:relative;overflow:hidden}.canvas-controls{z-index:10;align-items:center;gap:8px;display:flex;position:absolute;top:16px;right:16px}.control-button{border:2px solid var(--Black);background:var(--White);min-width:34px;height:34px;color:var(--Black);font-family:inherit;font-size:var(--Font-Size-16);font-weight:var(--Font-Weight-700);cursor:pointer;padding:0 8px}.control-button:hover{background:var(--Black);color:var(--White)}.control-button-wide{font-size:var(--Font-Size-12);letter-spacing:var(--Font-Letter-Spacing-1)}.zoom-indicator{border:2px solid var(--Black);font-size:var(--Font-Size-12);font-weight:var(--Font-Weight-700);background:var(--White);cursor:default;-webkit-user-select:none;user-select:none;padding:8px 10px}.canvas-viewport{cursor:grab;width:100%;height:100%;position:relative;overflow:hidden}.canvas-viewport:active{cursor:grabbing}.canvas-grid{background-image:linear-gradient(to right, var(--Black) 1px, transparent 1px), linear-gradient(to bottom, var(--Black) 1px, transparent 1px);opacity:.07;pointer-events:none;position:absolute;inset:0}.canvas-content{position:absolute;top:0;left:0}.canvas-empty{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.canvas-empty-text{font-size:var(--Font-Size-12);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-1);border:2px solid var(--Black);padding:16px 24px}.tree-node{border:2px solid var(--Black);background:var(--White);position:absolute;overflow:hidden}.tree-node-header{background:var(--Black);color:var(--White);font-size:var(--Font-Size-12);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-05);white-space:nowrap;text-overflow:ellipsis;border-bottom:2px solid var(--Black);justify-content:space-between;gap:8px;padding:6px 8px;display:flex;overflow:hidden}.tree-node-type{font-weight:var(--Font-Weight-400);font-size:var(--Font-Size-10);align-self:center}.tree-node-body{padding:4px 8px}.tree-node-row{font-size:var(--Font-Size-12);border-bottom:1px solid var(--Black);white-space:nowrap;justify-content:space-between;gap:8px;padding:2px 0;display:flex;overflow:hidden}.tree-node-row:last-child{border-bottom:none}.tree-node-key{font-weight:var(--Font-Weight-700);text-overflow:ellipsis;overflow:hidden}.tree-node-value{text-overflow:ellipsis;text-align:right;overflow:hidden}.tree-node-empty{opacity:.5;justify-content:center}.connections-svg{pointer-events:none;position:absolute;top:0;left:0;overflow:visible}.connection-path{fill:none;stroke:var(--Black);strokewidth:2}@media print{@page{size:landscape;margin:0}html,body{width:auto;height:auto;overflow:visible}body *{visibility:hidden}.canvas-content,.canvas-content *{visibility:visible}.canvas-content{position:absolute;top:0;left:0}.sidebar,.canvas-controls,.canvas-grid,.canvas-empty{display:none}.connection-path{stroke:var(--Black)}}.canvas-footer{text-align:center;width:100%;letter-spacing:var(--Font-Letter-Spacing-1);color:var(--light-gray);z-index:5;font-size:clamp(8px,5%,14px);position:absolute;bottom:10px}.canvas-ref-footer{cursor:pointer;color:var(--light-gray);text-decoration:none}.canvas-ref-footer:hover{color:#003757;opacity:.8;text-decoration:underline}.mode-toggle{border:2px solid var(--Black);margin-bottom:14px;display:flex}.mode-toggle-btn{background:var(--White);color:var(--Black);font-family:inherit;font-size:var(--Font-Size-12);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-1);cursor:pointer;border:none;flex:1;padding:10px 4px;transition:background-color .3s,color 1s}.mode-toggle-btn+.mode-toggle-btn{border-left:2px solid var(--Black)}.mode-toggle-btn-active{background:var(--Black);color:var(--White)}.mode-toggle-btn:disabled,.mode-toggle-disabled,.sidebar-textarea:disabled,.sidebar-button:disabled{cursor:not-allowed;opacity:.9}.settings-overlay{background:var(--Overlay);z-index:100;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.settings-modal{background:var(--White);border:2px solid var(--Black);opacity:1;flex-direction:column;width:520px;max-width:90vw;max-height:85vh;display:flex}.settings-header{border-bottom:2px solid var(--Black);font-size:var(--Font-Size-13);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-15);justify-content:space-between;align-items:center;width:100%;padding:14px 16px;display:flex}.library-header{font-size:var(--Font-Size-13);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-15);flex-direction:row;justify-content:space-between;align-items:center;width:100%;display:flex}.settings-outer-header{border-bottom:2px solid var(--Black);flex-direction:column;justify-content:center;align-items:center;gap:12px;width:100%;padding:14px 16px;display:flex}.settings-close{border:2px solid var(--Black);background:var(--White);color:var(--Black);width:26px;height:26px;font-size:var(--Font-Size-16);line-height:var(--Font-Line-Height-1);cursor:pointer}.settings-close:hover{background:var(--Black);color:var(--White)}.settings-body{flex-direction:column;flex:auto;gap:6px;min-height:0;padding:16px;display:flex;overflow-y:auto}.settings-label{font-size:var(--Font-Size-12);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-1);flex-direction:column;gap:2px;margin-top:10px;display:flex}.settings-label-row{justify-content:space-between;align-items:flex-end;display:flex}.settings-hint{font-size:var(--Font-Size-10);font-weight:var(--Font-Weight-400);opacity:.55;letter-spacing:var(--Font-Letter-Spacing-0)}.settings-input{border:2px solid var(--Black);font-family:inherit;font-size:var(--Font-Size-12);color:var(--Black);background:var(--White);outline:none;width:100%;padding:8px}.settings-textarea{border:2px solid var(--Black);font-family:inherit;font-size:var(--Font-Size-12);line-height:var(--Font-Line-Height-14);color:var(--Black);background:var(--White);resize:vertical;outline:none;height:100%;min-height:140px;padding:8px}.settings-reset-btn{border:2px solid var(--Black);background:var(--White);color:var(--Black);font-family:inherit;font-size:var(--Font-Size-10);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-1);cursor:pointer;padding:5px 8px}.settings-pre-btn{border:2px solid var(--Black);background:var(--White);color:var(--Black);font-family:inherit;font-size:var(--Font-Size-10);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-1);cursor:pointer;width:25px;height:25px}.settings-reset-container{justify-content:center;align-items:center;gap:4px;display:flex}.settings-reset-btn:hover,.settings-pre-btn:hover{background:var(--Black);color:var(--White)}.settings-footer{border-top:2px solid var(--Black);padding:14px 16px}.control-button:disabled,.zoom-dis-indicator{cursor:not-allowed;opacity:0}.control-button-active{background:var(--Black);color:var(--White)}.layer-view{flex-direction:column;align-items:center;gap:20px;width:100%;height:100%;min-height:0;padding:60px 0 0;display:flex;overflow:hidden}.layer-cards-wrapper{justify-content:center;align-items:center;width:100%;height:100%;min-height:0;display:flex;overflow:hidden}.layer-card{background:var(--White);flex-direction:column;flex-shrink:1;width:100%;height:100%;max-height:100%;padding:0 5px;display:flex;overflow:hidden}.layer-card-header{background:var(--Black);color:var(--White);font-size:var(--Font-Size-13);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-05);border-bottom:2px solid var(--Black);white-space:normal;overflow-wrap:anywhere;word-break:break-word;text-align:center;-webkit-user-select:none;user-select:none;padding:8px 10px}.layer-card-body{flex:1 1 0;min-height:0;padding:0;overflow:hidden auto}.layer-card-row{font-size:var(--Font-Size-12);border-bottom:1px solid var(--Black);white-space:nowrap;justify-content:space-between;gap:10px;padding:3px 10px;transition:background-color .2s;display:flex;overflow:hidden}.layer-card-Completed{background-color:var(--Layer_Completed)}.layer-card-row:last-child{border-bottom:none;padding-bottom:6px}.layer-card-row:first-child{padding-top:10px}.layer-card-key{font-weight:var(--Font-Weight-700);text-overflow:ellipsis;-webkit-user-select:none;user-select:none;overflow:hidden}.layer-card-value{text-overflow:ellipsis;text-align:right;-webkit-user-select:none;user-select:none;overflow:hidden}.layer-card-empty{opacity:.5;justify-content:center}.layer-nav{flex-shrink:0;align-items:center;gap:14px;margin-bottom:28px;display:flex}.layer-nav-indicator{border:2px solid var(--Black);font-size:var(--Font-Size-12);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-1);-webkit-user-select:none;user-select:none;padding:8px 12px}@media (max-width:760px){html,body,#root{scroll-snap-type:y mandatory;scroll-behavior:smooth;width:100%;height:100%;min-height:100%;overflow-y:auto}.app-root{flex-direction:column;width:100%;height:auto;min-height:100vh;display:flex;overflow:visible}.sidebar{border:none;border-bottom:2px solid var(--Black);scroll-snap-align:start;scroll-snap-stop:always;flex:none;width:100%;max-width:none;height:100dvh;min-height:100dvh;padding:30px 15px}.canvas-area{scroll-snap-align:start;scroll-snap-stop:always;flex:none;width:100%;height:100dvh;min-height:100dvh}.canvas-ref-footer{color:var(--Blue)}.canvas-controls{z-index:10;flex-direction:row;align-items:center;gap:8px;width:auto;display:flex}.control-button,.zoom-indicator{width:auto}.settings-label-row{flex-direction:column;display:flex}.settings-reset-container{flex-direction:row;justify-content:start;width:100%;padding:12px 0 0;display:flex}.small-disabled{opacity:0}.canvas-empty{width:100%;padding:20px}.canvas-empty-text{overflow-wrap:break-word;text-align:center;max-width:100%;font-size:clamp(15px,2vw,50px)}.sidebar-textarea,.sidebar-Json-textarea{height:80%;max-height:80%}.settings-label-row{align-items:flex-start}.layer-card-body{max-height:100%;overflow-y:scroll}.layer-nav{display:none}.settings-expanded-modal{height:80dvh;min-height:80dvh}.scroll-lock-btn{display:block}}.layer-card-row:last-child{border-bottom:1px solid var(--Black)}.layer-card-row{font-size:var(--Font-Size-12);border-bottom:1px solid var(--Black);justify-content:space-between;align-items:flex-start;gap:10px;padding:3px 10px;display:flex}.layer-card-key{font-weight:var(--Font-Weight-700);white-space:normal;overflow-wrap:anywhere;word-break:break-word;flex:0 0 30%}.layer-card-value{white-space:normal;overflow-wrap:anywhere;word-break:break-word;text-align:right;flex:1}button,.library-list-item-name,.canvas-ref-footer{transition:background-color .1s,color .1s,border-color .1s}.layer-swipe-zone{touch-action:pan-y;flex:1;width:100%;min-height:0;overflow:hidden}.layer-carousel-track{flex-wrap:nowrap;width:300%;height:100%;display:flex}.layer-carousel-track-animated{transition:transform .28s cubic-bezier(.22,.61,.36,1)}.layer-carousel-slide{flex:0 0 33.3333%;justify-content:center;align-items:center;width:33.3333%;height:100%;display:flex;overflow:hidden}.library-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.library-list-item{border:1px solid var(--Black);box-sizing:border-box;align-items:stretch;display:flex}.library-list-item-name{background:var(--White);min-width:0;color:var(--Black);cursor:pointer;font:inherit;box-sizing:border-box;border:none;flex:1;justify-content:space-between;margin:0;padding:10px 12px;display:flex}.library-list-item-name:hover{background:var(--Black);color:var(--White)}.library-list-item-delete{background:var(--White);color:var(--Black);border:none;border-left:1px solid var(--Black);cursor:pointer;font:inherit;box-sizing:border-box;flex:none;justify-content:center;align-items:center;margin:0;padding:10px 12px;display:flex}.library-list-item-date{text-align:end}.library-list-item-name,.library-list-item-delete{box-sizing:border-box;font:inherit;margin:0}.confirm-modal{width:90vw;max-width:360px}.confirm-message{font-size:var(--Font-Size-13);line-height:var(--Font-Line-Height-14)}.confirm-footer{justify-content:flex-end;gap:8px;display:flex}.toast-stack{z-index:1000;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:16px;right:16px}.toast{background:var(--Black);color:var(--White);font-size:var(--Font-Size-13);border:1px solid var(--Black);max-width:320px;padding:10px 14px}.toast-error{background:var(--White);color:var(--Black)}.settings-link-btn{font-size:var(--Font-Size-12);cursor:pointer;color:inherit;background:0 0;border:none;align-self:flex-start;padding:0;text-decoration:underline}.google-btn{border:2px solid var(--Black);background:var(--Black);color:var(--White);font-family:inherit;font-size:var(--Font-Size-13);font-weight:var(--Font-Weight-700);letter-spacing:var(--Font-Letter-Spacing-15);cursor:pointer;justify-content:center;align-items:center;margin-top:14px;padding:12px;display:flex;padding:4px 14px!important}.auth-modal-btn-container{flex-direction:row;justify-content:space-between;gap:5px;display:flex}.password-input-wrapper{width:100%;position:relative}.password-input-wrapper .settings-input{width:100%;padding-right:42px}.password-toggle{width:24px;height:24px;color:var(--Black);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:flex;position:absolute;top:50%;right:10px;transform:translateY(-50%)}