:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body,html{margin:0;padding:0;width:100%;height:100%;overflow:hidden}#root{width:100%;height:100%}.app-container{width:100%;height:100%;background-size:cover;background-position:center;transition:background-image .5s ease}.overlay{width:100%;height:100%;background:#0003;display:flex;justify-content:center;align-items:center;overflow-y:auto}.settings-container{background:#00000080;padding:1.5rem;border-radius:16px;max-width:450px;width:90%;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 4px 20px #0003;border:1px solid rgba(255,255,255,.08)}h1{text-align:center;margin-bottom:1.5rem;font-weight:100;font-size:1.5rem;letter-spacing:3px;text-transform:uppercase;opacity:.9}h2{font-size:.8rem;margin-bottom:.8rem;opacity:.6;text-transform:uppercase;letter-spacing:1px}.section{margin-bottom:1.5rem}.cards{display:flex;flex-direction:column;gap:.5rem}.card{background:transparent;padding:.8rem;border-radius:8px;cursor:pointer;transition:all .2s ease;border:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:center}.card:hover{background:#ffffff0d}.card.active{background:#ffffff1a;border-color:#fffc}.card h3{margin:0;font-size:.9rem;font-weight:500}.card p{margin:0;font-size:.75rem;opacity:.5}.buttons{display:flex;gap:.5rem}button{flex:1;background:transparent;border:1px solid rgba(255,255,255,.1);padding:.6rem;color:#ffffffb3;border-radius:6px;cursor:pointer;transition:all .2s;font-size:.85rem}button:hover{background:#ffffff0d;color:#fff}button.active{background:#ffffff26;border-color:#fff;color:#fff}.bg-options{display:flex;gap:.5rem}.bg-option{width:80px;height:50px;border-radius:6px;background-size:cover;background-position:center;cursor:pointer;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.2);transition:all .2s;opacity:.7}.bg-option:hover{opacity:1;transform:none}.bg-option span{display:none}.bg-option.active{opacity:1;border:2px solid white}.start-btn{width:100%;background:#fff;color:#000;border:none;font-weight:600;margin-top:1rem;padding:.8rem;letter-spacing:1px;text-transform:uppercase}.start-btn:hover{background:#ffffffe6}.session-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%}.breathing-circle-wrapper{position:relative;width:300px;height:300px;display:flex;align-items:center;justify-content:center;margin-bottom:3rem}.breathing-circle{width:150px;height:150px;background:radial-gradient(circle,#ffffffe6,#fff6);border-radius:50%;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 60px #fff6,inset 0 0 20px #fffc;will-change:transform;z-index:2}.breathing-circle-glow{position:absolute;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,#64c8ff66,#64c8ff00 70%);filter:blur(20px);z-index:1;transition:opacity .5s}.breathing-circle-glow.inhale{background:radial-gradient(circle,#a0dcff99,#a0dcff00 70%)}.breathing-circle-glow.holdIn{background:radial-gradient(circle,#c8ffdc99,#c8ffdc00 70%)}.breathing-circle-glow.exhale{background:radial-gradient(circle,#ffb4b499,#ffb4b400 70%)}.instruction-text-below{font-size:2.5rem;font-weight:200;text-transform:uppercase;letter-spacing:6px;text-shadow:0 2px 10px rgba(0,0,0,.3);height:60px;display:flex;align-items:center;justify-content:center}.controls{margin-top:2rem;text-align:center}.credit-icon{position:absolute;bottom:20px;right:20px;color:#ffffffb3;transition:all .3s ease;z-index:1000;background:#0000004d;padding:8px 16px;border-radius:30px;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);gap:8px;text-decoration:none}.credit-text{font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.credit-icon:hover{color:#fff;background:#0009;transform:translateY(-2px)}.timer{font-size:1.5rem;margin-bottom:1.5rem;opacity:.8;font-variant-numeric:tabular-nums;letter-spacing:1px}.stop-btn{background:#0006;border:1px solid rgba(255,255,255,.2);padding:.8rem 2.5rem;font-size:.9rem;text-transform:uppercase;letter-spacing:2px;border-radius:50px;transition:all .3s}.stop-btn:hover{border-color:#fff;background:#fff3;transform:translateY(-2px);box-shadow:0 5px 15px #0000004d}.overlay.dark-mode{background:#000000b3;-webkit-backdrop-filter:brightness(.6);backdrop-filter:brightness(.6)}.toggles-section{display:flex;justify-content:center;margin-bottom:2rem}.toggles{display:flex;gap:1rem;background:#ffffff1a;padding:.5rem;border-radius:50px}.toggle-btn{background:transparent;border:none;color:#fff9;padding:.5rem 1rem;border-radius:25px;cursor:pointer;font-size:.9rem;transition:all .3s ease;display:flex;align-items:center;gap:.5rem}.toggle-btn.active{background:#fff3;color:#fff;font-weight:500}.toggle-btn:hover{color:#fff}.legal-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:2000;display:flex;justify-content:center;align-items:center;padding:20px}.legal-modal{background:#1a1a1a;color:#fff;border-radius:12px;max-width:600px;width:100%;max-height:80vh;overflow-y:auto;position:relative;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 30px #00000080}.legal-content{padding:2rem}.legal-content h1{font-size:1.5rem;margin-top:2rem;margin-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:.5rem}.legal-content h1:first-child{margin-top:0}.legal-content h2{font-size:1.1rem;margin-bottom:.5rem;color:#fffc}.legal-content h3{font-size:.95rem;margin-bottom:.5rem;color:#fff9}.legal-content p,.legal-content ul{font-size:.9rem;line-height:1.6;color:#ffffffb3;margin-bottom:1rem}.legal-content ul{padding-left:20px}.close-btn{position:absolute;top:10px;right:15px;background:transparent;border:none;font-size:2rem;cursor:pointer;color:#ffffff80;transition:color .2s;padding:0;width:auto}.close-btn:hover{color:#fff;background:transparent}.legal-link-bottom-left{position:absolute;bottom:20px;left:20px;background:#0000004d;color:#fff9;border:none;font-size:.85rem;padding:8px 16px;border-radius:30px;cursor:pointer;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all .3s ease;letter-spacing:.5px;text-transform:uppercase;font-weight:500}.legal-link-bottom-left:hover{color:#fff;background:#0009;transform:translateY(-2px)}