@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&family=IBM+Plex+Serif&display=swap";@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:wght@400;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Serif&display=swap";:root{--bg: #f8f9fa;--text: #212529;--accent: #6f42c1;--accent-hover: #5a32a3;--border: #dee2e6}body{margin:0;padding:0;font-family:Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}a{text-decoration:none;color:var(--accent)}a:hover{color:var(--accent-hover)}.container{max-width:900px;margin:40px auto;padding:0 16px}h1{font-size:2rem;margin-bottom:1.5rem}ul{list-style:none;padding:0}li{background:#fff;border:1px solid var(--border);border-radius:12px;padding:20px;margin-bottom:16px;transition:box-shadow .2s ease-in-out}li:hover{box-shadow:0 4px 12px #0000000d}.download-link{display:inline-block;margin-top:16px;padding:10px 16px;background-color:var(--accent);color:#fff;border-radius:6px;font-weight:500;transition:background-color .2s ease-in-out}.download-link:hover{background-color:var(--accent-hover)}.back-link{margin-top:24px;display:inline-block;color:var(--accent)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;margin-top:24px}.card{display:block;background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:0 2px 6px #0000000a;transition:transform .2s ease-in-out,box-shadow .2s;text-align:left}.card:hover{transform:translateY(-4px);box-shadow:0 6px 16px #0000001a}.preview{width:100%;height:180px;object-fit:cover;display:block;border-bottom:1px solid var(--border)}.card-info{padding:16px}.card-info h2{font-size:1.1rem;margin:0 0 8px}.card-info p{margin:0;color:#555;font-size:.9rem}.search-input{width:100%;max-width:400px;padding:12px 16px;margin:16px 0 32px;border:1px solid var(--border);border-radius:8px;font-size:1rem;outline:none;transition:border-color .2s ease-in-out}.search-input:focus{border-color:var(--accent)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;padding:2rem 1rem}.sheet-card{text-decoration:none;border:1px solid #eee;border-radius:16px;padding:1.5rem;box-shadow:0 2px 12px #0000000d;background:#fff;transition:all .2s ease-in-out}.sheet-card:hover{transform:translateY(-5px);box-shadow:0 4px 20px #00000014}.card-header{margin-bottom:.75rem;display:flex;gap:.5rem;flex-wrap:wrap}.badge.tag{background:#f1f1f1;color:#444;font-size:.75rem;padding:.3rem .6rem;border-radius:8px}.card-title{font-family:"IBM Plex Serif",serif;font-size:1.3rem;font-weight:700;margin:.5rem 0;color:#1a1a1a}.card-composer{color:#666;font-size:.95rem;margin-bottom:.75rem}.card-meta{font-size:.8rem;color:#999;margin-bottom:1rem}.card-buttons{display:flex;gap:1rem;flex-wrap:wrap}.btn{border:none;border-radius:8px;padding:.5rem 1rem;font-size:.85rem;cursor:pointer}.preview-btn{background:#7a4e29;color:#fff}.download-btn{background:#f1f1f1;color:#7a4e29}@media (max-width: 600px){.grid{gap:1rem;padding:1rem .5rem}.btn{flex:1 1 100%;text-align:center}}.main-header{width:100vw;height:100vh;background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;display:flex;align-items:center;justify-content:center;background-image:url(/images/cello.png)}.main-header .overlay{position:relative;z-index:2;color:#fff;text-align:center;padding:2rem;text-shadow:1px 1px 3px #000;max-width:800px}.main-header h1{font-family:"IBM Plex Serif";font-size:6rem;margin-bottom:1rem;color:#f7ffb9}.main-header h2{font-family:"IBM Plex Serif";font-size:6rem;margin-bottom:1rem;color:#ffd062}.main-header h3{font-family:"IBM Plex Serif",serif;font-size:2rem;margin-bottom:1.5rem;line-height:1.6;color:#8b9eab}.main-header p{font-family:IBM Plex Sans,sans-serif;font-size:1.5rem;margin-bottom:1.5rem;line-height:1.6}.main-header button{border:none;padding:.75rem 1.5rem;border-radius:999px;background-color:#fff;color:#333;font-weight:700;font-size:1rem;box-shadow:0 3px 15px #0000004d;transition:all .3s ease}.main-header button:hover{cursor:pointer;transform:translateY(-2px)}.button-link{display:inline-block;padding:.75rem 1.5rem;border-radius:999px;background-color:#fff;color:#333;font-weight:700;font-size:1rem;text-decoration:none;text-shadow:none;transition:all .3s ease;border:none}.button-link:hover{transform:translateY(-2px);background-color:#ffd062;color:#000;cursor:pointer}@media (max-width: 768px){.main-header h1,.main-header h2{font-size:3.5rem}.main-header p{font-size:1rem}.main-header button{font-size:.9rem;padding:.6rem 1.2rem}}@layer base,utilities,demo;@layer demo{section{--_offset-steps: 6rem;--_scale-steps: 25;--_opacity-steps: 15;--_ani-duration: .3s;--_ani-delay: .2s;--_offset-steps-two: calc(var(--_offset-steps) * -1);--_offset-steps-three: calc(var(--_offset-steps) * -2);--scale-steps-two: calc(1 - var(--_scale-steps) * .01);--scale-steps-three: calc(1 - var(--_scale-steps) * .02);--opacity-steps-two: calc(1 - var(--_opacity-steps) * .02);--opacity-steps-three: calc(1 - var(--_opacity-steps) * .04);display:grid;grid-template-areas:"stack";color:#000;width:min(calc(100% - 2rem),80rem)}@media (width > 600px){section{--_offset-steps: 4em}}article{--_bg-alpha: .5;--_border-radius: 10px;position:relative;isolation:isolate;background-color:#fff;grid-area:stack;transition:.5s ease-in-out;border-radius:var(--_border-radius);translate:0 var(--_offset);order:var(--_order);z-index:var(--_order);scale:var(--_scale);opacity:var(--_opacity);font-family:Kodchasan,sans-serif}article:before,article:after{content:"";position:absolute;border-radius:inherit;z-index:-1}article:before{z-index:-1}article:after{background-color:#fff;top:0;right:0;bottom:0;left:0}article:nth-of-type(1){--_bg-clr: rgba(184, 164, 146,var(--_bg-alpha,1));--_order: var(--_1-order);--_scale: var(--_1-scale);--_opacity: var(--_1-opacity);--_offset: var(--_1-offset);--_pointer-event: var(--_1-pointer-event);--_pointer-cursor: var(--_1-pointer-cursor)}article:nth-of-type(2){--_bg-clr: rgba(184, 164, 146,var(--_bg-alpha,1));--_order: var(--_2-order);--_scale: var(--_2-scale);--_opacity: var(--_2-opacity);--_offset: var(--_2-offset);--_pointer-event: var(--_2-pointer-event);--_pointer-cursor: var(--_2-pointer-cursor)}article:nth-of-type(3){--_bg-clr: rgba(184, 164, 146,var(--_bg-alpha,1));--_order: var(--_3-order);--_scale: var(--_3-scale);--_opacity: var(--_3-opacity);--_offset: var(--_3-offset);--_pointer-event: var(--_3-pointer-event);--_pointer-cursor: var(--_3-pointer-cursor)}section:has(input:nth-child(1):focus-visible) article:nth-of-type(1) label,section:has(input:nth-child(2):focus-visible) article:nth-of-type(2) label,section:has(input:nth-child(3):focus-visible) article:nth-of-type(3) label{rotate:90deg}section:has(input:nth-child(1):checked){--_1-order: 3;--_1-scale: 1;--_1-opacity: 1 --_1-offset: 0;--_1-pointer-event: auto;--_1-pointer-cursor: pointer;--_2-order: 2;--_2-scale: var(--scale-steps-two);--_2-opacity: var(--opacity-steps-two);--_2-offset: var(--_offset-steps-two);--_3-order: 1;--_3-scale: var(--scale-steps-three);--_3-opacity: var(--opacity-steps-three);--_3-offset: var(--_offset-steps-three)}section:has(input:nth-child(2):checked){--_2-order: 3;--_2-scale: 1;--_2-opacity: 1 --_2-offset: 1;--_2-pointer-event: auto;--_2-pointer-cursor: pointer;--_3-order: 2;--_3-scale: var(--scale-steps-two);--_3-opacity: var(--opacity-steps-two);--_3-offset: var(--_offset-steps-two);--_1-order: 1;--_1-scale: var(--scale-steps-three);--_1-opacity: var(--opacity-steps-three);--_1-offset: var(--_offset-steps-three)}section:has(input:nth-child(3):checked){--_3-order: 3;--_3-scale: 1;--_3-opacity: 1 --_3-offset: 0;--_3-pointer-event: auto;--_3-pointer-cursor: pointer;--_1-order: 2;--_1-scale: var(--scale-steps-two);--_1-opacity: var(--opacity-steps-two);--_1-offset: var(--_offset-steps-two);--_2-order: 1;--_2-scale: var(--scale-steps-three);--_2-opacity: var(--opacity-steps-three);--_2-offset: var(--_offset-steps-three)}article>header{padding:.5rem 1rem;display:flex;align-items:center;justify-content:space-between;background-color:var(--_bg-clr);transition:background-color var(--_ani-duration) ease-in-out;border-radius:var(--_border-radius) var(--_border-radius) 0 0}article>header>label{padding:.5rem 1rem!important;color:#000;transition:rotate .3s ease-in-out;pointer-events:var(--_pointer-event,none);cursor:var(--_pointer-cursor, none)}article>header>label:hover{rotate:90deg}article>header>h2{font-family:"IBM Plex Serif",serif;color:#5a2d09!important;margin:1rem 2rem!important;font-weight:550!important;font-size:1.1rem;transition:translate var(--_ani-duration) ease-in-out,opacity var(--_ani-duration) ease-in-out;transition-delay:var(--_delay-h2,0);opacity:var(--_opacity,0)}article>div{position:relative;padding:2rem;display:grid;grid-template-columns:1fr;place-items:start;gap:2rem}@media (width > 600px){article>div{grid-template-columns:1fr 2fr}}article img{width:100%;height:350px;object-fit:cover;transition:var(--_ani-duration) ease-in-out;opacity:var(--_opacity,0)}article .poem{width:100%;height:350px;overflow-y:auto}article p{transition:var(--_ani-duration) ease-in-out;transition-delay:.5s;opacity:var(--_opacity,0);margin:3rem 0rem 1rem 0!important;font-size:1.5rem;font-family:IBM Plex Sans,sans-serif}}@layer base{*{box-sizing:border-box}:root{color-scheme:light dark;--bg-dark: rgb(48, 48, 48);--bg-light: rgb(229, 229, 229);--txt-light: rgb(10, 10, 10);--txt-dark: rgb(245, 245, 245)}body{background-color:light-dark(var(--bg-light),var(--bg-dark));color:light-dark(var(--txt-light),var(--txt-dark));min-height:100svh;margin:0;padding:2rem;font-size:1rem;font-family:system-ui;line-height:1.5;display:grid;place-items:center;gap:2rem}}@layer utilities{.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}}@media (max-width: 768px){section{max-width:600px;width:100%;margin:0 auto;padding-left:1rem;padding-right:1rem;box-sizing:border-box}.web-cards{width:90%;margin:.5rem 0}.web-cards header{display:flex;justify-content:space-between;align-items:center}.web-cards h2{font-size:2rem;margin:0}.web-cards .poem{font-size:.5rem;padding:1.5rem}.web-cards label{font-size:1.5rem;margin-left:auto;line-height:1;padding-top:.15rem}}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,sans-serif;background-color:#fff8f4;margin:0;padding:0}.app-header{background-color:#fff;position:sticky;top:0;z-index:1030}.logo{color:#222;font-size:1.25rem}.nav-link{color:#555;font-weight:500;transition:color .2s ease}.nav-link:hover{color:#000}.nav-link.active{color:#0d6efd;border-bottom:2px solid #0d6efd}.fade-in{animation:fadeIn .5s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.content-wrapper{max-width:none;width:100%;padding-left:15vw;padding-right:15vw}.btn-download{background-color:#7a4e29;color:#fff;border:none}.btn-download:hover{background-color:#fff;color:#7a4e29}.navbar{width:100%;padding:.75rem 2rem;position:fixed;top:0;left:0;background-color:#d6cac0bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:space-between;align-items:center;font-family:IBM Plex Sans,sans-serif;border-bottom:1px solid #ddd;z-index:1200}.navbar-logo{font-family:"IBM Plex Serif",serif;font-size:1.5rem;font-weight:700;color:#5a2d09}.navbar-menu a{margin-left:2rem;text-decoration:none;color:#5a2d09;font-size:1.25rem;font-weight:600;transition:color .25s ease}.navbar-menu a:hover{color:#576a79}.navbar-toggle{display:none;flex-direction:column;justify-content:space-between;width:24px;height:20px;background:transparent;border:none;cursor:pointer;padding:0;z-index:1300}.navbar-toggle .bar{height:3px;width:100%;background-color:#5a2d09;border-radius:2px}@media (max-width: 768px){.navbar{flex-direction:row;justify-content:space-between;align-items:center;padding:1rem 1.5rem}.navbar-toggle{display:flex}.navbar-menu{display:none;width:100%;flex-direction:column;margin-top:.5rem;gap:.5rem}.navbar-menu.open{display:flex}.navbar-menu a{margin-left:0}}*{margin:0;padding:0;box-sizing:border-box}.banner-header{width:100vw;height:100vh;background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;display:flex;align-items:center;justify-content:center;background-image:url(/images/lib_cover.jpg)}.banner-header h1{font-family:"IBM Plex Serif";font-size:16rem;margin-bottom:1rem;color:#fff6cf}.banner-header .overlay{position:relative;z-index:2;color:#fff;text-align:center;padding:2rem;text-shadow:1px 1px 3px #000;max-width:800px}@media (max-width: 768px){.banner-header{height:50vh}.banner-header h1,.banner-header h2{font-size:6rem}}
