:root{--font-primary: "Quicksand", "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-welcome: "Pixelify Sans", sans-serif;--theme-btn-bg: rgba(0, 0, 0, 1);--theme-btn-hover: rgba(0, 0, 0, .85);--theme-btn-color: #ffffff;--bg-x: 50%}body{background-image:url(/images/backgrounds/Background_Day.jpg);background-size:cover;background-position:var(--bg-x, 50%) center;background-attachment:fixed;transition:background-position .5s ease,background-image .3s ease;font-family:var(--font-primary);margin:0;min-height:100vh;display:flex;justify-content:center;align-items:center}body.theme-day{--theme-btn-bg: rgba(255, 200, 80, 1);--theme-btn-hover: rgba(255, 170, 30, .85);--theme-btn-color: #3a2a00;--theme-accent: #f5a623;background-image:url(/images/backgrounds/Background_Day.jpg)}body.theme-night{--theme-btn-bg: rgba(30, 20, 80, 1);--theme-btn-hover: rgba(60, 40, 140, .85);--theme-btn-color: #c8b8ff;--theme-accent: #7c5cbf;background-image:url(/images/backgrounds/Background_Night.jpg)}body.theme-pink{--theme-btn-bg: rgba(255, 160, 180, 1);--theme-btn-hover: rgba(255, 120, 150, .85);--theme-btn-color: #5a0020;--theme-accent: #e91e8c;background-image:url(/images/backgrounds/Background_Pink.png)}body.has-background{background-size:cover;background-position:var(--bg-x, 50%) center;background-repeat:no-repeat;background-attachment:fixed}body.has-background.theme-day{background-image:url(/images/backgrounds/Background_Day.jpg)}body.has-background.theme-night{background-image:url(/images/backgrounds/Background_Night.jpg)}body.has-background.theme-pink{background-image:url(/images/backgrounds/Background_Pink.png)}.hidden{display:none!important}#dynamic-text{font-family:var(--font-welcome);font-size:clamp(2rem,8vw,6rem);color:var(--theme-accent);margin-bottom:.5em;display:inline;white-space:normal;min-height:1.2em;border-right:4px solid var(--theme-accent);animation:blink 1s step-end infinite}@keyframes blink{50%{border-color:transparent}}#landing-content{display:flex;flex-direction:column;align-items:center;gap:2vh;padding:5vh 5vw;text-align:center}.theme-buttons button,#webcamButton,#info,#getstarted,.card-content #close-btn{font-family:var(--font-primary);font-weight:700;cursor:pointer;border-radius:6px;border:none}.theme-buttons button,#webcamButton,#info,#getstarted{padding:8px 12px;font-size:14px;border:2px solid var(--theme-btn-color);border-radius:.8em;background-color:var(--theme-btn-bg);color:var(--theme-btn-color);transition:background-color .2s,color .2s,border-color .2s}#info,#getstarted{font-size:clamp(.8rem,1.8vw,1.2rem);padding:.6em 1.4em;font-weight:700;border-radius:.8em}.theme-buttons button:hover,#webcamButton:hover,#info:hover,#getstarted:hover,.card-content #close-btn:hover{background-color:var(--theme-btn-hover)}.theme-buttons button:active,#webcamButton:active,#info:active,#getstarted:active,.card-content #close-btn:active{transform:scale(.95);transition:transform .1s ease}.theme-buttons{position:fixed;top:20px;right:20px;display:flex;gap:10px;z-index:1000}#status,#image-placeholder{font-family:var(--font-primary)}#info-card{position:fixed;inset:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.card-content{background:#fff;width:clamp(280px,40vw,600px);padding:clamp(16px,3vw,48px);max-width:500px;min-width:280px;border-radius:clamp(12px,1.5vw,24px);text-align:center;box-shadow:0 1vw 2vw #0000004d}.card-content h2{font-size:clamp(1.2rem,2.5vw,2rem);margin-bottom:clamp(12px,2vw,24px)}.card-content ol{display:inline-block;font-size:clamp(.9rem,1.4vw,1.3rem);text-align:left;padding-left:clamp(16px,2vw,28px);margin:0 auto clamp(16px,2.5vw,32px);width:fit-content}.card-content #close-btn{display:block;margin:clamp(16px,2.5vw,32px) auto 0;padding:clamp(6px,1vw,12px) clamp(14px,2.5vw,28px);border-radius:clamp(6px,1vw,14px);background-color:var(--theme-accent);color:#fff;font-size:clamp(.9rem,1.5vw,1.2rem);transition:filter .2s ease}.theme-toggle{position:fixed;top:clamp(15px,3vh,30px);right:clamp(15px,3vw,30px);display:flex;align-items:center;width:160px;height:46px;border-radius:25px;background:#fff3;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.35);padding:5px 8px;z-index:999;box-sizing:border-box;box-shadow:0 4px 18px #0000001f}.theme-toggle input{display:none}.theme-toggle label{flex:1;height:100%;display:flex;align-items:center;justify-content:center;font-size:18px;cursor:pointer;z-index:2;position:relative;transition:opacity .2s}.theme-toggle label:hover{opacity:.8}.theme-toggle input:checked+label{opacity:1}.theme-toggle input:not(:checked)+label{opacity:.5}.slider{position:absolute;width:34px;height:34px;top:5px;left:7px;border-radius:50%;background:#fff;box-shadow:0 2px 6px #0003;transition:left .3s cubic-bezier(.22,.9,.3,1);z-index:1}#day:checked~.slider{left:14px}#night:checked~.slider{left:calc(50% - 17px)}#pink:checked~.slider{left:calc(100% - 49px)}#camera-page{display:flex;flex-direction:column;align-items:center;gap:1.5vh;padding:2vh 2vw;width:100%}#camera-overlay{position:absolute;inset:0;background:#000000f2;color:#fff;display:flex;justify-content:center;align-items:center;font-size:1.2em}#video-container{position:relative;width:min(70vw,85vh);aspect-ratio:4/3;border-radius:2em;border:.5em solid var(--theme-btn-bg);overflow:hidden}#webcam{width:100%;height:100%;display:block;object-fit:cover}#expression-canvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}#camera-controls{display:flex;flex-direction:column;align-items:center;gap:.8em}#emotion-name{font-family:var(--font-primary);font-size:clamp(1.2rem,3vw,2rem);font-weight:700;color:var(--theme-btn-color);background:var(--theme-btn-bg);padding:.3em 1em;border-radius:2em;min-width:10ch;text-align:center;text-transform:capitalize;letter-spacing:.05em;transition:background-color .3s,color .3s}#image-placeholder{font-size:clamp(.85rem,1.5vw,1.1rem);color:var(--theme-btn-color);opacity:.7;font-style:italic}#status{display:none}