@import "https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700&display=swap";
:root{--background:#141210;--surface:#1e1b18;--surface-hover:#2d2824;--surface-subtle:#e8751a0f;--primary:#e8751a;--primary-hover:#d06815;--secondary:#c45a10;--text-main:#fff;--text-muted:#9a8e82;--border-radius:20px;--transition-speed:.2s}*{box-sizing:border-box;margin:0;padding:0}html,body{overscroll-behavior:none;-webkit-overflow-scrolling:touch;height:100vh;overflow:hidden}body{background:var(--background);color:var(--text-main);-webkit-font-smoothing:antialiased;width:100%;font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}.card{background:var(--surface);border-radius:var(--border-radius);transition:transform var(--transition-speed)ease,box-shadow var(--transition-speed)ease;border:1px solid #ffffff0d;padding:1.5rem;box-shadow:0 4px 15px #0000004d}.card:active{transform:scale(.98)}.btn-primary{background:var(--primary);color:#fff;cursor:pointer;transition:all var(--transition-speed)ease;border:none;border-radius:24px;justify-content:center;align-items:center;min-width:140px;padding:.8rem 1.5rem;font-size:1rem;font-weight:600;display:inline-flex;box-shadow:0 4px 10px #0003}.btn-primary:active{transform:scale(.96)}.container{max-width:1200px;margin:0 auto;padding:0 2rem}.glass{-webkit-backdrop-filter:blur(20px);background:#1c1c1ed9;border:1px solid #ffffff0d;box-shadow:0 4px 15px #0003}h1,h2,h3,h4{letter-spacing:-.02em;margin-bottom:.8rem}h1{letter-spacing:-.03em;font-weight:200}h2{font-weight:300}h3{font-weight:600}h4{font-weight:500}.text-gradient{background:linear-gradient(to right,var(--primary),var(--secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.works-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));align-items:start;gap:1.5rem;display:grid}.work-card-header{cursor:pointer;transition:background var(--transition-speed)ease}.work-card-header:active{background:#00000005}.work-details{transform-origin:top;animation:.3s ease-out forwards slideDown}@keyframes slideDown{0%{opacity:0;transform:scaleY(.95)}to{opacity:1;transform:scaleY(1)}}@media (max-width:768px){.container{padding:0 1rem}.card{padding:1.5rem}.btn-primary{width:100%;margin-bottom:.5rem}.stack-on-mobile{flex-direction:column!important;align-items:flex-start!important;gap:.8rem!important}.full-width-mobile{width:100%!important}h1{font-size:2rem!important}h2{font-size:1.5rem!important}h3{font-size:1.25rem!important}}.layout-content-wrapper{-webkit-overflow-scrolling:touch;height:100vh;padding-bottom:80px;overflow:auto}body:has(.trainer-main-area) .layout-content-wrapper{height:100vh!important;padding-bottom:0!important;overflow:hidden!important}body:has(.recording-main-area) .layout-content-wrapper{height:100vh!important;padding-bottom:0!important;overflow:hidden!important}body:has(.karaoke-main-area) .layout-content-wrapper{height:100vh!important;padding-bottom:0!important;overflow:hidden!important}.layout-content-wrapper:has(.trainer-main-area){height:100vh!important;padding-bottom:0!important;overflow:hidden!important}.layout-content-wrapper:has(.recording-main-area){height:100vh!important;padding-bottom:0!important;overflow:hidden!important}.layout-content-wrapper:has(.karaoke-main-area){height:100vh!important;padding-bottom:0!important;overflow:hidden!important}@media (max-height:500px){:is(body:has(.trainer-main-area) .layout-content-wrapper,body:has(.recording-main-area) .layout-content-wrapper){overflow:hidden!important}}