:root{--paper: #f5f1e8;--surface: rgba(249, 246, 240, .88);--edge: rgba(32, 39, 37, .12);--edge-soft: rgba(32, 39, 37, .08);--ink-strong: #1c2422;--ink-soft: #51605b;--ink-muted: #7a857f;--accent: #365d4e;--accent-strong: #2b4f43;--display: "Baskerville", "Iowan Old Style", "Palatino Linotype", "Book Antiqua", serif;--sans: "Avenir Next", "Helvetica Neue", sans-serif;--mono: "SF Mono", "IBM Plex Mono", "Menlo", monospace;--shadow-soft: 0 18px 46px rgba(28, 33, 30, .08), 0 4px 12px rgba(28, 33, 30, .05);color:var(--ink-soft);background:radial-gradient(circle at top,rgba(255,255,255,.72),transparent 34%),linear-gradient(180deg,#f8f5ee,#f0ece4);font:16px/1.6 var(--sans);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html{min-height:100%}body{margin:0;min-height:100vh;color:var(--ink-soft)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(90deg,transparent 0,transparent calc(100% - 1px),rgba(255,255,255,.18) calc(100% - 1px)),linear-gradient(180deg,transparent 0,transparent calc(100% - 1px),rgba(255,255,255,.18) calc(100% - 1px));background-size:44px 44px;opacity:.34;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.26),transparent 82%);mask-image:linear-gradient(180deg,rgba(0,0,0,.26),transparent 82%)}#root{min-height:100vh}button,textarea{font:inherit}textarea:focus,button:focus-visible{outline:2px solid rgba(43,79,67,.22);outline-offset:2px}h1,h2,h3{font-family:var(--display);letter-spacing:-.035em}h1{font-size:clamp(2.5rem,4vw,4.2rem);line-height:.98;color:var(--ink-strong)}h2{font-size:1.72rem;line-height:1.02}h3{font-size:1rem;line-height:1.26}strong{font-weight:600}p,pre,ul{margin:0}::selection{background:#365d4e26}.app-shell{width:min(1500px,calc(100% - 28px));margin:0 auto;padding:18px 0 28px}.site-footer{margin-top:14px;text-align:center;font:600 .82rem/1 var(--sans);letter-spacing:.14em;color:var(--ink-muted)}.topbar{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:16px;padding:18px 22px;border-radius:26px;border:1px solid var(--edge);background:radial-gradient(circle at top left,rgba(255,252,245,.96),transparent 42%),linear-gradient(180deg,#f9f4eafa,#f1e9dcf0);box-shadow:var(--shadow-soft)}.brand-block h1{margin:0;font:700 clamp(2rem,5vw,3.75rem) / .95 var(--display);color:var(--ink-strong)}.panel-kicker{margin:0 0 7px;font:700 .72rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--accent-strong)}.tab-switcher{display:inline-flex;gap:8px;padding:7px;border-radius:999px;background:#ffffff9e;border:1px solid rgba(44,54,48,.08)}.tab-chip,.primary-button,.ghost-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:999px;border:1px solid transparent;padding:10px 15px;font:600 .9rem/1 var(--sans);cursor:pointer;transition:transform .14s ease,background .14s ease,border-color .14s ease}.tab-chip{background:transparent;color:var(--ink-muted)}.tab-chip.is-active{background:var(--accent-strong);color:#fffdfa;box-shadow:0 10px 18px #19282129}.primary-button{background:var(--accent-strong);color:#fffdfa}.ghost-button{background:#ffffffd1;color:var(--ink-strong);border-color:var(--edge-soft)}.ghost-button.is-danger{color:#8d302c;border-color:#8d302c2e;background:#fff7f6e0}.tab-chip:hover,.primary-button:hover,.ghost-button:hover{transform:translateY(-1px)}.tab-chip:disabled,.primary-button:disabled,.ghost-button:disabled{cursor:progress;opacity:.6;transform:none}.status-pill{display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border-radius:999px;background:#ffffffc7;border:1px solid var(--edge-soft);font-size:.84rem;color:var(--ink-soft)}.status-pill.is-busy:before{content:"";width:7px;height:7px;border-radius:999px;background:var(--accent);box-shadow:0 0 0 4px #2e534514}.workspace-grid{display:grid;gap:14px;align-items:start}.editor-layout,.library-layout{grid-template-columns:minmax(340px,.86fr) minmax(680px,1.2fr)}.panel{display:flex;flex-direction:column;min-height:780px;border-radius:26px;border:1px solid var(--edge);background:linear-gradient(180deg,#ffffffc2,#faf6f0e0),var(--surface);box-shadow:var(--shadow-soft);overflow:hidden}.control-panel{background:linear-gradient(180deg,#fffefaf0,#f5eee2f0),var(--paper)}.notebook-panel{background:linear-gradient(180deg,#f6f1e8f0,#ebe4d7eb)}.panel-header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid rgba(24,34,30,.06)}.button-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.source-editor,.markdown-output{width:calc(100% - 24px);margin:12px;border-radius:18px;border:1px solid var(--edge-soft);background:#ffffffd1;color:var(--ink-strong);font:500 .95rem/1.72 var(--mono)}.source-editor{resize:none;padding:18px;min-height:580px}.markdown-output{padding:18px;margin:0;overflow:auto;white-space:pre-wrap}.panel-footer{padding:16px 20px 18px;border-top:1px solid var(--edge-soft);background:#fdfbf7d6}.note-list{margin-top:12px;padding-left:18px;color:var(--ink-soft)}.note-list li+li{margin-top:7px}.markdown-drawer{margin:0 12px 12px;border-radius:18px;border:1px solid var(--edge-soft);background:#ffffffad;overflow:hidden}.notebook-drawer{margin-top:auto}.markdown-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;cursor:pointer;list-style:none;font:700 .82rem/1.2 var(--sans);color:var(--ink-strong)}.markdown-summary::-webkit-details-marker{display:none}.markdown-summary small{font:600 .72rem/1 var(--sans);color:var(--ink-muted)}.drawer-icon-row{display:inline-flex;align-items:center;gap:8px}.icon-chip{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:999px;border:1px solid var(--edge-soft);background:#ffffffd6;font:700 .82rem/1 var(--sans);color:var(--ink-strong)}.icon-button{width:34px;height:34px;padding:0;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:1rem}.markdown-drawer-body{border-top:1px solid var(--edge-soft);background:#ffffffb3}.library-box{margin:12px;padding:16px;border-radius:18px;border:1px solid var(--edge-soft);background:#ffffffb8}.standalone-library-box{display:flex;flex-direction:column;flex:1}.library-header{display:flex;justify-content:space-between;align-items:start;gap:12px}.library-search-row{margin-top:12px}.library-toolbar{margin-top:10px;display:flex;justify-content:flex-end}.search-input-wrap{position:relative}.library-search-input{width:100%;border-radius:14px;border:1px solid var(--edge-soft);background:#ffffffdb;padding:12px 88px 12px 14px;font:500 .92rem/1.2 var(--sans);color:var(--ink-strong)}.search-inside-button{position:absolute;top:50%;right:8px;transform:translateY(-50%);padding:8px 12px}.library-feedback,.library-empty{margin:12px 0 0;font-size:.84rem;color:var(--ink-muted)}.library-results{display:flex;flex-direction:column;gap:10px;margin-top:12px;max-height:260px;overflow:auto}.library-results.is-tall{max-height:none;flex:1}.library-item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;border-radius:14px;border:1px solid var(--edge-soft);background:#ffffffd1}.library-item.is-selected{border-color:#2e534542;background:#f3f8f4eb}.library-item-copy{min-width:0;display:flex;flex-direction:column;gap:4px}.library-item-copy strong,.library-item-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.library-item-copy span{font-size:.8rem;color:var(--ink-muted)}.library-item-actions{display:flex;gap:8px;flex-shrink:0}.text-link-button{display:inline-flex;align-items:center;text-decoration:none}.notebook-panel-body{padding:18px}.notebook-shell{display:flex;flex-direction:column;gap:14px;height:100%}.notebook-header{display:flex;justify-content:flex-end}.notebook-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.notebook-action-button{padding:8px 12px}.notebook-counter{font:600 .82rem/1 var(--sans);color:var(--ink-muted)}.notebook-frame{position:relative;padding:2px 6px}.binder-spine{position:absolute;top:16px;bottom:16px;left:50%;width:8px;transform:translate(-50%);border-radius:999px;background:linear-gradient(180deg,#c6b8a0b8,#b5a68db8);z-index:2}.binder-spine span{display:none}.notebook-pages{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.notebook-leaf{min-width:0;display:flex;justify-content:center;align-items:stretch}.preview-page{width:105mm;min-width:105mm;min-height:148mm;margin:0 auto;padding:2.8mm;box-sizing:border-box;border-radius:12px;background:#fffcf7f5;box-shadow:0 8px 18px #1f221d14}.preview-placeholder{display:flex;align-items:center;justify-content:center;color:var(--ink-muted);font:600 .98rem/1.4 var(--sans)}.page-layout{display:grid;grid-template-columns:20% 1fr;gap:2.8mm;min-height:138.8mm}.page-layout.gutter-right{grid-template-columns:1fr 20%}.page-layout.gutter-right .page-content{grid-column:1;grid-row:1}.page-layout.gutter-right .page-gutter{grid-column:2;grid-row:1}.page-layout.gutter-left .page-gutter{grid-column:1;grid-row:1}.page-layout.gutter-left .page-content{grid-column:2;grid-row:1}.page-gutter{position:relative}.gutter-rule{position:absolute;top:0;bottom:0;width:.2mm;background:#161e1b14}.page-layout.gutter-right .gutter-rule{left:.8mm}.page-layout.gutter-left .gutter-rule{right:.8mm}.page-content{display:flex;flex-direction:column;min-height:100%;padding:2.4mm 2.5mm 2.2mm;border-radius:4mm;background:#ffffffeb;border:.22mm solid rgba(24,34,30,.08)}.page-topline{min-height:.8mm;margin-bottom:.9mm}.song-header{display:flex;flex-direction:column;align-items:flex-start;gap:2mm;min-height:13.8mm;margin-bottom:2.8mm}.song-header.is-placeholder{visibility:hidden}.song-title{margin:0;min-height:5.4mm;font:700 4.8mm/1.02 var(--display);color:var(--ink-strong);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-title.is-wide{font-size:4.15mm}.song-title.is-compact{font-size:3.55mm}.song-meta-inline{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:1.3mm 2.2mm;max-width:100%;font:600 2.15mm/1.2 var(--sans);color:var(--ink-muted)}.song-meta-inline span{white-space:nowrap}.page-body{display:flex;flex:1;flex-direction:column;gap:1.8mm}.page-body:after{content:"";flex:1}.page-footer{margin-top:1.4mm;display:flex;align-items:center;justify-content:space-between;font:600 2.18mm/1 var(--sans);letter-spacing:.08em;color:var(--ink-muted)}.page-footer.footer-even{flex-direction:row-reverse}.footer-index,.footer-page{white-space:nowrap}.footer-index{max-width:68%;overflow:hidden;text-overflow:ellipsis}.sheet-section{padding:1.28mm 0 0;border-radius:0;background:transparent;border:0;border-top:.2mm solid rgba(24,34,30,.08)}.sheet-section:first-child{padding-top:0;border-top:0}.sheet-table{width:100%;border-collapse:collapse}.sheet-table td{padding:.8mm 0 0;border-top:.2mm solid rgba(24,34,30,.08);vertical-align:top}.sheet-table tr:first-child td{border-top:0;padding-top:0}.variant-block+.variant-block{margin-top:.95mm}.sheet-grid{display:grid;align-items:end;width:fit-content;max-width:100%}.chord-grid{margin-bottom:.12mm}.grid-token{display:flex;align-items:end;justify-content:flex-start;min-width:0}.chord-token{font:700 3.44mm/1 var(--mono);color:var(--accent-strong);white-space:nowrap}.lyric-token{font:700 3.24mm/1.5 var(--mono);color:var(--ink-strong)}.sheet-line{white-space:pre-wrap;word-break:break-word}.chord-line{margin-bottom:.18mm;font:700 3.44mm/1.04 var(--mono);letter-spacing:.02em;color:var(--accent-strong)}.lyric-line{font:700 3.24mm/1.5 var(--mono);color:var(--ink-strong)}.export-stage{position:fixed;left:-10000px;top:0;display:flex;flex-direction:column;gap:16px;pointer-events:none}@media (max-width: 1420px){.editor-layout,.library-layout{grid-template-columns:1fr}}@media (max-width: 1160px){.topbar,.notebook-header{flex-direction:column;align-items:flex-start}.notebook-pages{grid-template-columns:1fr}.binder-spine{display:none}}@media (max-width: 860px){.app-shell{width:min(100%,calc(100% - 18px));padding-top:14px}.panel{min-height:auto}.source-editor{min-height:420px}.button-row,.notebook-nav,.library-item-actions,.tab-switcher{width:100%;justify-content:flex-start}}