@import"https://fonts.cdnfonts.com/css/sf-mono";*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}.note-header{display:flex!important;justify-content:flex-start!important;align-items:center!important;gap:.5rem;position:relative;padding-top:12px!important;padding-left:40px!important;padding-right:40px!important}.note-header .tab-navigation-container{position:absolute!important;left:50%!important;transform:translate(-50%)!important;margin-left:0!important;display:inline-flex!important;align-items:center!important;z-index:2}.note-header .editor-title{flex:0 1 auto!important;min-width:0!important;max-width:calc(100% - 260px)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;margin-right:16px!important}:root{--color-bg: #121212;--color-bg-alt: #1E1E1E;--color-surface: rgba(255, 255, 255, .05);--color-surface-hover: rgba(255, 255, 255, .08);--color-surface-active: rgba(255, 255, 255, .12);--color-text: #E1E1E1;--color-text-secondary: #A8A8A8;--color-text-tertiary: #7F7F7F;--color-accent: #82aaff;--color-accent-alt: #c792ea;--color-cursor: var(--color-accent);--color-border: rgba(255, 255, 255, .12);--color-recording: #ff453a;--color-success: #32d74b;--glass-bg: rgba(30, 30, 30, .6);--glass-border: rgba(255, 255, 255, .15);--glass-highlight: rgba(255, 255, 255, .1);--glass-shadow: rgba(0, 0, 0, .3);--glass-recording-bg: rgba(28, 28, 30, .75);--glass-recording-border: rgba(255, 255, 255, .15);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .2);--shadow-md: 0 4px 16px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .4);--transition-fast: .2s ease;--transition-normal: .3s ease;--transition-slow: .45s ease;--transition-tabs: .3s cubic-bezier(.4, 0, .2, 1);--font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";--font-mono: "SF Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--footer-height: 120px;--live-footer-height: 350px;--navbar-height: 64px}[data-theme=light]{--color-bg: #F7F7F7;--color-bg-alt: #EDEDED;--color-surface: #FFFFFF;--color-surface-hover: #F0F0F0;--color-surface-active: #EAEAEA;--color-text: #333333;--color-text-secondary: #666666;--color-text-tertiary: #999999;--color-accent: #007AFF;--color-accent-alt: #5856d6;--color-cursor: var(--color-accent);--color-border: #DCDCDC;--color-recording: #ff3b30;--color-success: #30d158;--glass-bg: rgba(255, 255, 255, .65);--glass-border: rgba(0, 0, 0, .07);--glass-highlight: var(--color-surface-active);--glass-shadow: rgba(0, 0, 0, .05);--glass-recording-bg: rgba(248, 248, 248, .75);--glass-recording-border: rgba(0, 0, 0, .1);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .03);--shadow-md: 0 2px 4px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .04);--shadow-lg: 0 4px 8px rgba(0, 0, 0, .06), 0 2px 6px rgba(0, 0, 0, .05)}[data-theme=spring]{--color-bg: #fdf2f8;--color-bg-alt: #fce7f3;--color-surface: #fff1f2;--color-surface-hover: #ffe4e6;--color-surface-active: #fda4af;--color-text: #831843;--color-text-secondary: #9d174d;--color-text-tertiary: #be185d;--color-accent: #db2777;--color-accent-alt: #e11d48;--color-cursor: var(--color-accent);--color-border: #fbcfe8;--color-recording: #e11d48;--glass-bg: rgba(255, 255, 255, .6);--glass-border: rgba(219, 39, 119, .1);--glass-highlight: rgba(255, 255, 255, .8);--glass-shadow: rgba(131, 24, 67, .1);--glass-recording-bg: rgba(255, 241, 242, .85);--glass-recording-border: rgba(219, 39, 119, .2)}[data-theme=summer]{--color-bg: #f0f9ff;--color-bg-alt: #e0f2fe;--color-surface: #e0f2fe;--color-surface-hover: #bae6fd;--color-surface-active: #7dd3fc;--color-text: #0c4a6e;--color-text-secondary: #0369a1;--color-text-tertiary: #0284c7;--color-accent: #0ea5e9;--color-accent-alt: #0284c7;--color-cursor: var(--color-accent);--color-border: #bae6fd;--color-recording: #ef4444;--glass-bg: rgba(255, 255, 255, .6);--glass-border: rgba(14, 165, 233, .1);--glass-highlight: rgba(255, 255, 255, .8);--glass-shadow: rgba(12, 74, 110, .1);--glass-recording-bg: rgba(240, 249, 255, .85);--glass-recording-border: rgba(14, 165, 233, .2)}[data-theme=autumn]{--color-bg: #2a1b12;--color-bg-alt: #431407;--color-surface: rgba(255, 237, 213, .05);--color-surface-hover: rgba(255, 237, 213, .1);--color-surface-active: rgba(255, 237, 213, .15);--color-text: #ffedd5;--color-text-secondary: #fed7aa;--color-text-tertiary: #fdba74;--color-accent: #f97316;--color-accent-alt: #ea580c;--color-cursor: var(--color-accent);--color-border: rgba(251, 146, 60, .2);--color-recording: #ef4444;--glass-bg: rgba(67, 20, 7, .6);--glass-border: rgba(251, 146, 60, .15);--glass-highlight: rgba(255, 237, 213, .1);--glass-shadow: rgba(0, 0, 0, .4);--glass-recording-bg: rgba(42, 27, 18, .85);--glass-recording-border: rgba(249, 115, 22, .2)}[data-theme=winter]{--color-bg: #f8fafc;--color-bg-alt: #f1f5f9;--color-surface: #ffffff;--color-surface-hover: #e2e8f0;--color-surface-active: #cbd5e1;--color-text: #0f172a;--color-text-secondary: #334155;--color-text-tertiary: #475569;--color-accent: #64748b;--color-accent-alt: #475569;--color-cursor: var(--color-accent);--color-border: #cbd5e1;--color-recording: #ef4444;--glass-bg: rgba(255, 255, 255, .75);--glass-border: rgba(148, 163, 184, .2);--glass-highlight: rgba(255, 255, 255, .9);--glass-shadow: rgba(15, 23, 42, .05);--glass-recording-bg: rgba(248, 250, 252, .9);--glass-recording-border: rgba(148, 163, 184, .3)}[data-theme=mural]{--color-bg: #240046;--color-bg-alt: #3c096c;--color-surface: rgba(255, 255, 255, .1);--color-surface-hover: rgba(255, 255, 255, .15);--color-surface-active: rgba(255, 255, 255, .2);--color-text: #ffffff;--color-text-secondary: #e0aaff;--color-text-tertiary: #c77dff;--color-accent: #9d4edd;--color-accent-alt: #7b2cbf;--color-cursor: #e0aaff;--color-border: rgba(224, 170, 255, .2);--color-recording: #ff006e;--glass-bg: rgba(36, 0, 70, .4);--glass-border: rgba(255, 255, 255, .15);--glass-highlight: rgba(255, 255, 255, .15);--glass-shadow: rgba(0, 0, 0, .4);--glass-recording-bg: rgba(16, 0, 43, .7);--glass-recording-border: rgba(157, 78, 221, .3)}body[data-theme=mural]{background:linear-gradient(135deg,#240046,#3c096c,#5a189a,#7b2cbf,#9d4edd);background-attachment:fixed;background-size:cover}[data-theme=custom]{--color-bg: transparent;--color-bg-alt: rgba(0, 0, 0, .5);--color-surface: rgba(0, 0, 0, .4);--color-surface-hover: rgba(0, 0, 0, .5);--color-surface-active: rgba(0, 0, 0, .6);--color-text: #ffffff;--color-text-secondary: #e0e0e0;--color-text-tertiary: #bdbdbd;--color-accent: #4fc3f7;--color-accent-alt: #29b6f6;--color-cursor: #ffffff;--color-border: rgba(255, 255, 255, .2);--color-recording: #ff5252;--glass-bg: rgba(0, 0, 0, .5);--glass-border: rgba(255, 255, 255, .2);--glass-highlight: rgba(255, 255, 255, .1);--glass-shadow: rgba(0, 0, 0, .5);--glass-recording-bg: rgba(0, 0, 0, .75);--glass-recording-border: rgba(255, 255, 255, .2)}[contenteditable]{caret-color:var(--color-cursor)}[contenteditable][placeholder].placeholder-active{color:var(--color-text-tertiary);opacity:.6}html{height:100%;overflow:hidden}body{font-family:var(--font-primary);background-color:var(--color-bg);color:var(--color-text);line-height:1.65;height:100vh;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-.01em;transition:background-color var(--transition-normal),color var(--transition-normal);margin:0;overscroll-behavior:none}.app-container{display:flex;flex-direction:column;height:100%;width:100%;max-width:100%;overflow:hidden;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.app-navbar{display:flex;justify-content:space-between;align-items:center;padding:0 40px;padding-top:env(safe-area-inset-top);height:calc(var(--navbar-height) + env(safe-area-inset-top));background-color:var(--color-bg);border-bottom:1px solid var(--color-border);flex-shrink:0;transition:background-color var(--transition-normal),border-color var(--transition-normal);z-index:50;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);background-color:rgba(var(--color-bg),.8);-webkit-user-select:none;user-select:none}[data-theme=mural] .app-navbar,[data-theme=custom] .app-navbar{background-color:var(--glass-bg);border-bottom:1px solid var(--glass-border)}.nav-logo{display:flex;align-items:center;height:100%;text-decoration:none;cursor:pointer;transition:opacity var(--transition-fast)}.nav-logo:hover{opacity:.8}.nav-logo:active{opacity:.7}.nav-logo-svg{height:40px;width:auto;display:block}.navbar-title{font-size:24px;font-weight:700;color:var(--color-text);font-family:var(--font-primary);margin:0 24px;flex-shrink:0;-webkit-user-select:none;user-select:none}.nav-links{display:flex;gap:24px;align-items:center}.nav-link{text-decoration:none;color:var(--color-text-secondary);font-size:14px;font-weight:500;transition:color var(--transition-fast);cursor:pointer;background:none;border:none;padding:0;font-family:var(--font-primary)}.nav-link:hover{color:var(--color-text)}.app-footer{display:flex;justify-content:center;align-items:center;height:40px;background-color:var(--color-bg-alt);border-top:1px solid var(--color-border);padding:8px 16px;flex-shrink:0}.app-footer p{margin:0;font-size:12px;color:var(--color-text-tertiary);text-align:center;letter-spacing:.01em}.main-content{flex:1;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:padding-bottom var(--transition-slow) ease-in-out}.main-content:has(>.recording-interface.is-live){padding-bottom:var(--live-footer-height)}.note-area{border:none;padding:0;margin:0 24px 0 0;flex-grow:1;color:var(--color-text);font-family:var(--font-primary);background-color:transparent;-webkit-user-select:text;user-select:text}.note-area .note-area{flex:1;overflow:hidden;display:flex;flex-direction:column;background-color:var(--color-bg);padding:0;transition:background-color var(--transition-normal);min-height:0}.note-area [data-theme=mural] .note-area,.note-area [data-theme=custom] .note-area{background-color:transparent}.note-area .note-area{flex:1;overflow:hidden;display:flex;flex-direction:column;background-color:var(--color-bg);padding:32px 0 0;transition:background-color var(--transition-normal);min-height:0}.tab-navigation-container{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:10px;padding:4px;display:inline-flex;box-shadow:var(--shadow-sm);transition:background-color var(--transition-normal),border-color var(--transition-normal)}.tab-navigation{display:flex;position:relative;border-radius:7px;overflow:hidden}.tab-button{background:transparent;border:none;padding:6px 16px;margin:0;font-size:13px;font-weight:500;color:var(--color-text-secondary);border-radius:6px;cursor:pointer;transition:color var(--transition-fast);position:relative;z-index:1;flex-shrink:0;font-family:var(--font-primary);letter-spacing:-.01em;touch-action:manipulation}.tab-button:hover,.tab-button.active{color:var(--color-text)}[data-theme=light] .tab-button,[data-theme=spring] .tab-button,[data-theme=summer] .tab-button,[data-theme=winter] .tab-button{color:var(--color-text-secondary)}[data-theme=light] .tab-button:hover,[data-theme=spring] .tab-button:hover,[data-theme=summer] .tab-button:hover,[data-theme=winter] .tab-button:hover{color:var(--color-text)}.active-tab-indicator{position:absolute;top:0;left:0;width:0;height:100%;background-color:var(--glass-highlight);border-radius:6px;transition:left var(--transition-tabs),width var(--transition-tabs);z-index:0;box-shadow:0 .5px 1.5px #0000000a,0 0 0 .5px #00000005 inset}.note-content-wrapper{flex:1;overflow-y:auto;padding:0 40px 40px;position:relative;min-height:0;-webkit-overflow-scrolling:touch}.note-content{outline:none;min-height:100px;font-size:16px;line-height:1.7;color:var(--color-text);padding:12px 0;font-family:var(--font-primary);letter-spacing:-.01em;opacity:0;transform:scale(.985) translateY(8px);transition:opacity var(--transition-tabs),transform var(--transition-tabs);display:none;will-change:opacity,transform;position:relative}.note-content.active{opacity:1;transform:scale(1) translateY(0);display:block}#polishedNote.placeholder-active:before{content:attr(data-placeholder);position:absolute;top:12px;left:0;color:var(--color-text-tertiary);opacity:.6;pointer-events:none;-webkit-user-select:none;user-select:none;font-family:var(--font-primary);font-size:16px;line-height:1.7;letter-spacing:-.01em;white-space:pre-wrap;word-wrap:break-word}.note-content h1,.note-content h2,.note-content h3{margin-bottom:.75em;margin-top:1.25em;font-weight:600;color:var(--color-text)}.note-content h1{font-size:1.8em}.note-content h2{font-size:1.5em}.note-content h3{font-size:1.25em}.note-content p{margin-bottom:1em}.note-content ul,.note-content ol{margin-bottom:1em;padding-left:1.5em}.note-content li{margin-bottom:.5em}.note-content pre{background-color:var(--color-bg-alt);padding:1em;border-radius:8px;margin-bottom:1em;font-size:.9em;overflow-x:auto;transition:background-color var(--transition-normal);font-family:var(--font-mono)}.note-content code{font-family:var(--font-mono);background-color:var(--color-bg-alt);padding:.2em .4em;border-radius:4px;font-size:.9em}.note-content pre code{background-color:transparent;padding:0;border-radius:0}.recording-interface{height:calc(var(--footer-height) + env(safe-area-inset-bottom));width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:12px 20px;padding-bottom:calc(12px + env(safe-area-inset-bottom));background-color:transparent;border-top:1px solid transparent;flex-shrink:0;transition:opacity .3s ease-out,transform .35s ease-out,background-color var(--transition-slow) ease-in-out,height var(--transition-slow) ease-in-out;z-index:10;-webkit-user-select:none;user-select:none}.recording-interface.is-live{position:fixed;bottom:0;left:0;right:0;height:calc(var(--live-footer-height) + env(safe-area-inset-bottom));z-index:1000;background-color:var(--glass-recording-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--glass-recording-border);box-shadow:0 -4px 20px var(--glass-shadow);justify-content:flex-start;padding-top:20px;padding-bottom:calc(20px + env(safe-area-inset-bottom))}.status-indicator{margin-bottom:16px}.recording-interface.is-live .status-indicator{display:none}.status-text{font-size:14px;color:var(--color-text-tertiary);text-align:center;transition:color var(--transition-normal);font-family:var(--font-primary)}.live-recording-title,#liveWaveformCanvas,.live-recording-timer{opacity:0;transform:translateY(15px);transition:opacity .3s ease-out .1s,transform .35s ease-out .1s}.recording-interface.is-live .live-recording-title,.recording-interface.is-live #liveWaveformCanvas,.recording-interface.is-live .live-recording-timer{opacity:1;transform:translateY(0)}.live-recording-title{font-size:17px;color:var(--color-text);margin-bottom:12px;text-align:center;font-weight:500;font-family:var(--font-primary)}#liveWaveformCanvas{width:100%;max-width:340px;height:70px;margin-bottom:18px;border-radius:4px}.live-recording-timer{font-family:var(--font-mono);font-size:44px;font-weight:400;color:var(--color-text);margin-bottom:22px;text-align:center;letter-spacing:.01em}.recording-controls{display:flex;align-items:center;justify-content:center;gap:24px;position:relative;touch-action:manipulation;padding-bottom:44px}.emoji-icon{font-size:24px;line-height:1;display:block;-webkit-user-select:none;user-select:none;cursor:pointer}.action-button{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--transition-fast) transform,var(--transition-fast) box-shadow,var(--transition-fast) opacity;box-shadow:var(--shadow-sm);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:none;background-color:var(--glass-bg);touch-action:manipulation}#shareButton{background:linear-gradient(135deg,#4facfe,#00f2fe)}#exportButton{background:linear-gradient(135deg,#43e97b,#38f9d7)}#newButton{background:linear-gradient(135deg,#fa709a,#fee140)}#themeToggleButton{background:linear-gradient(135deg,#667eea,#764ba2)}.recording-interface.is-live .action-button{display:none}.action-button:hover{transform:translateY(-3px) scale(1.05);box-shadow:var(--shadow-md);opacity:.95}.action-button:active{transform:translateY(-1px) scale(.98)}.record-button{position:relative;width:72px;height:72px;border-radius:50%;border:none;outline:none;background:none;cursor:pointer;z-index:1;touch-action:manipulation}.record-button-inner{position:relative;width:100%;height:100%;border-radius:50%;background:var(--glass-bg);border:1px solid var(--glass-border);display:flex;align-items:center;justify-content:center;z-index:2;box-shadow:var(--shadow-md);transition:all var(--transition-normal);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}.record-button .emoji-icon{font-size:32px}.record-button:hover .record-button-inner{transform:scale(1.08);background-color:var(--color-surface-hover);border-color:var(--glass-highlight)}.record-button.recording .record-button-inner{background:linear-gradient(135deg,#ff0844,#ffb199);border:none}.record-button.recording:hover .record-button-inner{filter:brightness(1.1)}.record-waves{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;z-index:1;opacity:0;transition:opacity var(--transition-normal);pointer-events:none}.record-button.recording .record-waves{opacity:1}.recording-interface.is-live .record-waves{display:none}.wave{fill:none;stroke:var(--color-recording);stroke-width:1.5px;opacity:0;transform-origin:center}.record-button.recording .wave1{animation:wave 2s infinite ease-out}.record-button.recording .wave2{animation:wave 2s infinite ease-out;animation-delay:.4s}.record-button.recording .wave3{animation:wave 2s infinite ease-out;animation-delay:.8s}@keyframes wave{0%{transform:scale(.4);opacity:.8;stroke-width:2px}to{transform:scale(1.8);opacity:0;stroke-width:.5px}}.record-text{position:absolute;bottom:-30px;left:50%;transform:translate(-50%);font-size:12px;white-space:nowrap;color:var(--color-text-tertiary);opacity:0;transition:opacity var(--transition-fast);font-family:var(--font-primary)}.record-button:hover .record-text{opacity:1}.recording-interface.is-live .record-text{display:none}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-bg-alt);border-radius:5px}::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:5px;border:2px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background:var(--glass-highlight)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);z-index:3000;display:flex;justify-content:center;align-items:center;opacity:0;pointer-events:none;transition:opacity .3s ease;padding:20px}.modal-overlay:not(.hidden){opacity:1;pointer-events:auto}.modal-content{background:var(--color-bg);color:var(--color-text);border:1px solid var(--glass-border);box-shadow:var(--shadow-lg);border-radius:16px;width:100%;max-width:400px;padding:24px;transform:translateY(20px);transition:transform .3s ease;max-height:80vh;overflow-y:auto}.modal-overlay:not(.hidden) .modal-content{transform:translateY(0)}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.modal-header h2{font-size:20px;font-weight:600;margin:0}.close-modal{background:none;border:none;font-size:28px;cursor:pointer;color:var(--color-text-secondary);line-height:1;padding:10px;margin:-10px}.close-modal:hover{color:var(--color-text)}.theme-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.theme-option{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;padding:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:all .2s ease;touch-action:manipulation}.theme-option:hover{background:var(--color-surface-hover);transform:translateY(-2px);border-color:var(--color-accent)}.theme-emoji{font-size:32px}.theme-name{font-size:14px;font-weight:500;color:var(--color-text)}.subscribe-content{max-width:450px}.subscribe-form{display:flex;flex-direction:column;gap:16px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:14px;font-weight:500;color:var(--color-text-secondary)}.form-group input{padding:12px;border-radius:8px;border:1px solid var(--glass-border);background:var(--color-surface);color:var(--color-text);font-family:var(--font-primary);font-size:16px;outline:none;transition:border-color .2s}.form-group input:focus{border-color:var(--color-accent);background:var(--color-surface-hover)}.submit-btn{margin-top:8px;padding:12px;border-radius:8px;border:none;background:var(--color-accent);color:#fff;font-weight:600;font-size:16px;cursor:pointer;transition:opacity .2s}.submit-btn:hover{opacity:.9}.modal-divider{display:flex;align-items:center;text-align:center;margin:24px 0;color:var(--color-text-tertiary);font-size:12px;font-weight:500}.modal-divider:before,.modal-divider:after{content:"";flex:1;border-bottom:1px solid var(--glass-border)}.modal-divider span{padding:0 10px}.donate-section{text-align:center}.donate-section p{margin-bottom:12px;color:var(--color-text-secondary);font-size:14px}.donate-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background-color:#fd0;color:#000;text-decoration:none;font-weight:600;border-radius:8px;transition:transform .2s;width:100%}.donate-btn:hover{transform:translateY(-2px)}.debug-panel{background-color:#000000f2;color:#3f3;font-family:var(--font-mono);font-size:12px;padding:12px;position:fixed;bottom:0;left:0;max-height:200px;width:100%;z-index:2000;overflow-y:auto;display:none}.debug-panel.visible{display:block}.hidden{display:none!important}@media(max-width:768px){:root{--footer-height: 100px;--live-footer-height: 210px;overflow-y:auto}.app-navbar{padding:0 16px;padding-top:calc(env(safe-area-inset-top) + 8px);height:calc(56px + env(safe-area-inset-top))}.nav-links{gap:16px}.nav-link{font-size:13px}.note-area{padding:16px 0 0}.note-header{padding:0 16px 10px;flex-direction:column;align-items:stretch;gap:10px}.note-header{position:static}.note-header .tab-navigation-container{position:static!important;transform:none!important;width:100%;margin-left:0;display:block!important}.note-header .editor-title{max-width:none!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}.editor-title{padding:0;font-size:18px;margin-bottom:0;margin-right:0;text-align:left}.tab-navigation-container,.tab-navigation{width:100%}.tab-button{flex-grow:1;text-align:center;font-size:13px}.note-content-wrapper{padding:0 16px 16px}.recording-interface{padding:8px 16px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}.recording-interface.is-live{padding-left:12px;padding-right:12px;padding-top:14px;padding-bottom:calc(14px + env(safe-area-inset-bottom))}#liveWaveformCanvas{max-width:calc(100% - 24px);height:50px}.live-recording-title{font-size:15px;margin-bottom:8px}.live-recording-timer{font-size:32px;margin-bottom:14px}.action-button{width:40px;height:40px}.record-button{width:56px;height:56px}.recording-controls{gap:10px}.status-indicator{margin-bottom:10px}.status-text{font-size:12px}}@media(min-width:768px)and (max-width:1024px)and (orientation:landscape){:root{--footer-height: 80px;--live-footer-height: 180px;overflow-y:auto}.app-navbar{padding:0 24px;padding-top:calc(env(safe-area-inset-top) + 6px);height:calc(48px + env(safe-area-inset-top))}.nav-links{gap:20px}.nav-link{font-size:14px}.note-header{padding:0 24px 8px}.tab-button{font-size:12px}.note-content-wrapper{padding:0 24px 16px}.recording-interface{padding:6px 24px;padding-bottom:calc(6px + env(safe-area-inset-bottom))}.recording-interface.is-live{padding:12px 24px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}#liveWaveformCanvas{max-width:calc(100% - 32px);height:40px}.live-recording-title{font-size:13px;margin-bottom:4px}.live-recording-timer{font-size:28px;margin-bottom:8px}.action-button{width:36px;height:36px}.record-button{width:48px;height:48px}.recording-controls{gap:8px}.status-text{font-size:11px}}@media(min-width:768px)and (max-width:1024px)and (orientation:portrait){:root{--footer-height: 110px;--live-footer-height: 240px;overflow-y:auto}.app-navbar{padding:0 32px;padding-top:calc(env(safe-area-inset-top) + 8px);height:calc(60px + env(safe-area-inset-top))}.nav-links{gap:24px}.nav-link{font-size:14px}.note-header{padding:0 32px 10px;flex-direction:row;align-items:center;justify-content:space-between;gap:16px}.note-header .tab-navigation-container{position:absolute!important;left:50%!important;transform:translate(-50%)!important;display:inline-flex!important}.editor-title{font-size:20px;max-width:calc(100% - 280px)!important}.tab-button{font-size:13px}.note-content-wrapper{padding:0 32px 16px}.recording-interface{padding:12px 32px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}.recording-interface.is-live{padding:16px 32px;padding-bottom:calc(16px + env(safe-area-inset-bottom))}#liveWaveformCanvas{max-width:calc(100% - 64px);height:55px}.live-recording-title{font-size:15px;margin-bottom:10px}.live-recording-timer{font-size:40px;margin-bottom:12px}.action-button{width:44px;height:44px}.record-button{width:60px;height:60px}.recording-controls{gap:12px}.status-text{font-size:13px}}@media(min-width:1024px)and (orientation:landscape){:root{--footer-height: 90px;--live-footer-height: 200px;overflow-y:auto}.app-navbar{padding:0 48px;height:calc(60px + env(safe-area-inset-top))}.note-content-wrapper{padding:0 48px 16px}.recording-interface{padding:12px 48px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}}@media(min-width:1024px){:root{--footer-height: 130px;--live-footer-height: 360px;overflow-y:auto}}
