:root{--bg-light: #ffffff;--bg-dark: #f5e6e9;--text: #b76e79;--text-soft: #caa1a8}*{margin:0;padding:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}@font-face{font-family:Aref Ruqaa;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/aref-ruqaa-v26-latin-regular.woff2) format("woff2")}body{background:#f5e6e9;background:-webkit-radial-gradient(circle,#ffffff,#f5e6e9);background:radial-gradient(circle at 50% 50%,#fff,#f5e6e9);color:#b76e79;font-family:Cormorant Garamond,serif;overflow:hidden;height:100vh;height:100dvh}.app{position:relative;width:100vw;height:100vh;height:100dvh;overflow:hidden}canvas{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}.content{font-size:50px;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;z-index:2;width:90%;pointer-events:auto;opacity:1;-webkit-transition:opacity 2s ease;transition:opacity 2s ease}h1{font-family:Aref Ruqaa,serif;font-weight:400;letter-spacing:3px;opacity:.85;pointer-events:none;line-height:1;-webkit-transform:translateY(-12px);-ms-transform:translateY(-12px);transform:translateY(-12px);margin-right:2rem}.subtitle{-webkit-writing-mode:vertical-rl;-ms-writing-mode:tb-rl;writing-mode:vertical-rl;text-orientation:upright;font-family:Aref Ruqaa,serif;font-size:1.4rem;border-left:1px solid #b76e79;padding-left:10px;opacity:.8;letter-spacing:2px;pointer-events:none;white-space:nowrap}.credits{position:absolute;bottom:15px;left:0;right:0;text-align:center;font-size:.7rem;z-index:3;opacity:.6;-webkit-transition:opacity .3s;transition:opacity .3s}.credits:hover{opacity:1}.credits a,.back-link{color:inherit;text-decoration:none}.credits a:hover,.back-link:hover{border-bottom:1px solid #b76e79}@media (max-width: 768px){.content{font-size:38px}}@media (max-width: 600px){.content{-webkit-box-direction:normal;-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;font-size:26px;text-align:center;top:45%}h1{letter-spacing:1px;margin-right:0;margin-bottom:1.2rem}.subtitle{-webkit-writing-mode:horizontal-tb;-ms-writing-mode:lr-tb;writing-mode:horizontal-tb;text-orientation:mixed;font-size:1.1rem;border-left:none;border-top:1px solid #b76e79;padding-left:0;padding-top:10px;letter-spacing:6px;text-indent:6px}.audio-dashboard{position:relative;top:auto;left:auto;-webkit-transform:none;-ms-transform:none;transform:none;margin-top:1rem;opacity:.6}.credits{position:absolute;bottom:20px;left:0;right:0;font-size:.75rem;opacity:.8;z-index:10}}@media (max-width: 360px){.content{font-size:22px}}.audio-dashboard{position:absolute;top:calc(100% + 25px);left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translate(-50%);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:6px 16px;background-color:#b76e79;border-radius:30px;box-shadow:0 2px 12px #b76e7933;opacity:.3;-webkit-transition:opacity .3s ease;transition:opacity .3s ease;pointer-events:auto}.audio-dashboard:hover{opacity:.95}.audio-transport{display:-webkit-box;display:-ms-flexbox;display:flex}.audio-transport .audio-btn:first-child{margin-right:.4rem}.audio-volume-wrapper{margin-left:1.2rem}.audio-btn{background:none;border:none;cursor:pointer;width:24px;height:24px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-transition:-webkit-transform .1s ease;transition:-webkit-transform .1s ease;transition:transform .1s ease}.audio-btn:hover{-webkit-transform:scale(1.15);-ms-transform:scale(1.15);transform:scale(1.15)}.icon-play-pause{display:block;width:0;height:0;border-style:solid;border-width:5px 0 5px 9px;border-color:transparent transparent transparent #ffffff;-webkit-transition:all .1s ease;transition:all .1s ease}.audio-btn.is-playing .icon-play-pause{width:8px;height:10px;border-style:double;border-width:0px 0px 0px 8px;border-color:#fff}.icon-stop{display:block;width:8px;height:8px;background-color:#fff;border-radius:1px}.audio-volume-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:70px}#audioSlider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:2px;background:#fff;background:linear-gradient(to right,#ffffff var(--volume-percent, 100%),rgba(255,255,255,.2) var(--volume-percent, 100%));outline:none;cursor:pointer}#audioSlider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:6px;height:6px;border-radius:50%;background:#fff}#audioSlider::-moz-range-thumb{width:6px;height:6px;border:none;border-radius:50%;background:#fff;cursor:pointer}.legal-page{max-width:780px;margin:0 auto;padding:60px 25px;font-family:Georgia,Times New Roman,serif;font-size:1rem;line-height:1.7;color:#b76e79;overflow-y:auto}.legal-page h1{font-size:2rem;margin-bottom:40px;letter-spacing:1px;text-align:left;opacity:.9}.legal-section{margin:0 auto 45px;max-width:650px;text-align:left}.legal-section h2{font-size:1.3rem;margin-bottom:14px;letter-spacing:.5px;opacity:.85}.legal-section p{margin-bottom:12px}.legal-section strong{font-weight:700}.back-link{display:inline-block;margin-top:40px;font-size:.9rem;text-decoration:none;border-bottom:1px solid transparent;-webkit-transition:border-color .3s;transition:border-color .3s;color:inherit}.back-link:hover{border-color:#b76e79}
