@font-face{font-family:Comic Helvetic;src:url(/assets/fonts/ComicHelvetic_Heavy.otf) format("opentype");font-weight:700;font-style:normal}@font-face{font-family:Comic Helvetic;src:url(/assets/fonts/ComicHelvetic_Medium.otf) format("opentype");font-weight:400;font-style:normal}:root{--red-team: #e74c3c;--blue-team: #3498db;--gold: #f1c40f;--green: #2ecc71;--dark-overlay: rgba(0, 0, 0, .6);--glass: rgba(255, 255, 255, .15);--font-main: "Outfit", sans-serif;--font-comic: "Comic Helvetic", sans-serif}*{box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;user-select:none}body{font-family:var(--font-main);background:#2c3e50;overflow:hidden;height:100vh;width:100vw}#app{display:flex;flex-direction:column;height:100%;position:relative}.game-hud-top{height:auto;min-height:120px;background:transparent;display:flex;justify-content:space-between;align-items:flex-start;padding:1rem 2rem;position:absolute;top:0;left:0;width:100%;z-index:100;pointer-events:none}.game-hud-top>*{pointer-events:auto}.team-profile{position:absolute;top:57px;display:flex;align-items:center;gap:0px;z-index:50}.team-profile.red{right:50%;margin-right:215px;margin-left:0}.team-profile.blue{right:50%;margin-right:-365px;margin-left:0}.profile-inner{display:flex;align-items:center;gap:8px}.team-profile.blue .profile-inner{flex-direction:row-reverse;text-align:right}.avatar-frame img{width:48px;height:48px;border-radius:7px;border:3px solid #fff;background:#fff}.team-profile.red .avatar-frame img{background:#fcc}.team-profile.blue .avatar-frame img{background:#cef}.team-info{display:flex;flex-direction:column;justify-content:center}.team-name{font-family:var(--font-comic);font-weight:700;font-size:1rem;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.money-container{display:flex;align-items:center;gap:5px}.team-profile.blue .money-container{flex-direction:row-reverse;align-self:flex-end}.coin-icon{visibility:hidden;width:10px;height:10px}.money-container span{font-family:var(--font-comic);color:#f1c40f;font-weight:700;font-size:.8rem;text-shadow:0 1px 1px rgba(0,0,0,.5);position:relative;top:-3px}.battle-center{position:absolute;left:50%;transform:translate(-50%);top:10px;display:flex;flex-direction:column;align-items:center;z-index:10;width:auto}.game-title{display:none}.battle-bar-outer{width:100%;max-width:330px;height:24px;background:#00000080;border-radius:12px;border:2px solid rgba(255,255,255,.3);padding:2px;position:relative;display:flex;align-items:center;margin-bottom:0;top:60px;z-index:20}.progress-track{width:100%;height:100%;background:var(--blue-team);border-radius:10px;overflow:hidden;position:relative;box-shadow:inset 0 2px 4px #00000080}.battle-bar-container{width:100%;height:100%;position:relative}.progress-fill.red-fill{background:var(--red-team);height:100%;box-shadow:inset -2px 0 5px #0000004d;transition:width .3s cubic-bezier(.4,0,.2,1)}.vs-badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--font-comic);font-style:italic;font-weight:900;font-size:1rem;color:#fff;text-shadow:0 2px 2px rgba(0,0,0,.5);z-index:5}.center-wood-panel{background:url(/assets/panels/panel_score.png) no-repeat center center/100% 100%;width:750px;height:150px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:10px;filter:drop-shadow(0 5px 10px rgba(0,0,0,.3));margin-top:-40px;position:relative;z-index:1}.time-day-container{display:flex;flex-direction:row-reverse;align-items:center;justify-content:center;margin-top:0}.hud-pill{background:transparent;padding:0;min-width:auto;height:auto;filter:none}.hud-pill span{font-family:var(--font-comic);color:#fff;font-weight:700;font-size:1.2rem;text-shadow:0 2px 2px rgba(0,0,0,.5)}#game-timer{font-size:1rem!important;line-height:1;color:#f1c40f;position:relative;left:18px;top:-3px}.hud-pill .day-badge{font-size:1rem!important;color:#f1c40f!important;position:relative;right:27px;top:-1px}.battle-field{width:100%;max-height:100%;aspect-ratio:16/9;margin:auto;display:flex;position:relative;background:url(/assets/panels/backgorund-panel.png) no-repeat center bottom/cover;overflow:hidden;box-shadow:0 0 20px #00000080}.team-zone{flex:1;position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;overflow:hidden}.red-zone,.blue-zone{background:transparent}.divider-line{width:4px;background:#0000001a;height:100%;position:absolute;left:50%;transform:translate(-50%);z-index:10}.crowd-area{position:absolute;top:15%;bottom:25%;width:100%;background-image:radial-gradient(circle at center,rgba(0,0,0,.05) 2px,transparent 2px);background-size:20px 20px;z-index:30}.customer{position:absolute;width:125px;height:188px;background-repeat:no-repeat;background-position:center bottom;background-size:contain;transition:all .3s;cursor:pointer;display:flex;justify-content:center;filter:drop-shadow(0 4px 4px rgba(0,0,0,.3));z-index:100}.customer.red-team-cust{filter:drop-shadow(0 4px 4px rgba(0,0,0,.3)) drop-shadow(0 0 5px #e74c3c) drop-shadow(0 0 10px #e74c3c)}.customer.blue-team-cust{filter:drop-shadow(0 4px 4px rgba(0,0,0,.3)) drop-shadow(0 0 5px #3498db) drop-shadow(0 0 10px #3498db)}.order-popup{position:absolute;top:-60px;background:#fff;border-radius:12px;padding:8px 12px;box-shadow:0 4px 15px #0003;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275);display:flex;flex-direction:column;align-items:center;z-index:50;pointer-events:auto}.order-popup:after{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%);border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #fff}.order-text{font-weight:800;color:#2c3e50;font-size:.9rem}.order-timer-bar{width:100%;height:4px;background:#eee;margin-top:4px;border-radius:2px;overflow:hidden}.order-timer-fill{width:100%;height:100%;background:var(--red-team);animation:timerShrink linear forwards}@keyframes timerShrink{0%{width:100%;background:#2ecc71}to{width:0%;background:#c0392b}}@keyframes popIn{0%{transform:scale(0) translateY(20px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.gerobak-container{position:relative;width:200px;height:150px;background:#8e44ad;margin-bottom:2rem;border-radius:10px;display:flex;justify-content:center;align-items:flex-end}.red .gerobak-container{background:#c0392b}.stock-display{position:static;display:flex;flex-direction:column;width:175px;height:auto;background:transparent;border:none;box-shadow:none;padding:0;margin-bottom:-5px;z-index:200}.red-zone .stock-display{margin-left:auto;margin-right:-1.7rem}.blue-zone .stock-display{margin-right:auto;margin-left:-1.7rem;z-index:5}.stock-header{background:#f1c40f;color:transparent;height:35px;border:2px solid #000;border-bottom:2px solid #000;border-radius:8px 8px 0 0;width:100%}.stock-content{background:#fff;display:flex;align-items:center;justify-content:center;gap:12px;height:50px;border:2px solid #000;border-top:none;border-radius:0 0 8px 8px}.stock-display.red-stock .stock-header,.stock-display.red-stock .stock-content{border-top-right-radius:0;border-bottom-right-radius:0;border-right-width:1px}.stock-display.blue-stock .stock-header,.stock-display.blue-stock .stock-content{border-top-left-radius:0;border-bottom-left-radius:0;border-left-width:1px}.stock-display .value{font-size:1.8rem;font-weight:900;color:#000}.stock-icon{font-size:1.5rem;filter:drop-shadow(0 2px 2px rgba(0,0,0,.2))}.stock-display .label{display:none}.stock-label-overlay{position:absolute;bottom:70px;left:50%;transform:translate(-50%);color:#fff;font-family:var(--font-comic);font-size:1.1rem;font-weight:900;text-shadow:0 1px 2px rgba(0,0,0,.5);z-index:300;pointer-events:none;white-space:nowrap;width:200px;text-align:center}.habit-icon.blue-clock{filter:hue-rotate(200deg)}.red-stock .stock-icon{filter:sepia(1) saturate(5) hue-rotate(-50deg) drop-shadow(0 2px 2px rgba(0,0,0,.2))}.controls-area{width:100%;padding:1.5rem;display:flex;justify-content:flex-start;align-items:flex-end;gap:1rem}.btn-action-img{background:transparent;border:none;cursor:pointer;padding:0;transition:transform .1s}.btn-action-img:active{transform:scale(.95)}.btn-action-img img{height:45px;width:auto;filter:drop-shadow(0 4px 0 rgba(0,0,0,.2))}.btn-action-img:active img{filter:none;transform:translateY(4px)}.game-top-buttons{position:absolute;top:1rem;right:1rem;display:flex;gap:.5rem;z-index:200}.btn-game{background-color:transparent;width:50px;height:50px;border:none;cursor:pointer;transition:transform .2s;filter:drop-shadow(0 2px 3px rgba(0,0,0,.3));background-repeat:no-repeat;background-position:center;background-size:contain}.btn-game:hover{transform:scale(1.1);filter:drop-shadow(0 4px 5px rgba(0,0,0,.4))}.btn-game.fullscreen{background-image:url(/assets/buttons/fullscreen.png)}.btn-game.fullscreen.active{background-image:url(/assets/buttons/fullscreen_exit.png)}.btn-game.sound{background-image:url(/assets/buttons/unmute.png)}.btn-game.sound.muted{background-image:url(/assets/buttons/mute.png)}.btn-game.exit{background-image:url(/assets/buttons/exit.png)}.day-badge{font-size:.9rem}.hidden{display:none!important}#home-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;z-index:2000;color:#fff;overflow:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.btn-pulse{animation:pulseBtn 1.5s infinite}@keyframes pulseBtn{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.home-bg-animate{position:absolute;top:0;left:0;width:100%;height:100%;background:url(/assets/panels/background.png) no-repeat center bottom/cover;z-index:0}.home-overlay{display:none}.settings-top-right{position:absolute;top:20px;right:20px;z-index:10;display:flex;gap:.2rem}.icon-btn-large{background-color:transparent;width:60px;height:60px;border:none;cursor:pointer;transition:transform .2s;filter:drop-shadow(0 2px 5px rgba(0,0,0,.3));background-repeat:no-repeat;background-position:center;background-size:contain}.icon-btn-large:hover{transform:scale(1.1);filter:drop-shadow(0 4px 8px rgba(0,0,0,.4))}.btn-fullscreen-img{background-image:url(/assets/buttons/fullscreen.png)}.btn-fullscreen-img.active{background-image:url(/assets/buttons/fullscreen_exit.png)}.btn-settings-img{background-image:url(/assets/buttons/setting.png)}.btn-sound-img{background-image:url(/assets/buttons/unmute.png)}.btn-sound-img.muted{background-image:url(/assets/buttons/mute.png)}.home-content{position:absolute;bottom:17%;left:0;z-index:5;width:100%;display:flex;justify-content:center;margin-bottom:0;animation:popIn .8s cubic-bezier(.68,-.55,.265,1.55)}.btn-start-image{background:url(/assets/buttons/mulaipermainan.png) no-repeat center center/contain;background-color:transparent;width:300px;height:100px;border:none;cursor:pointer;transition:transform .1s;animation:pulseBtn 2s infinite;filter:drop-shadow(0 10px 10px rgba(0,0,0,.3))}.btn-start-image:hover{transform:scale(1.1);filter:drop-shadow(0 15px 15px rgba(0,0,0,.4))}.btn-start-image:active{transform:scale(.95)}.mode-selection{display:flex;gap:.5rem;align-items:center;justify-content:center}.btn-mode-image{background-color:transparent;width:200px;height:80px;border:none;cursor:pointer;transition:transform .1s;filter:drop-shadow(0 5px 5px rgba(0,0,0,.3))}.btn-mode-image:hover{transform:scale(1.1);filter:drop-shadow(0 10px 10px rgba(0,0,0,.4))}.btn-mode-image:active{transform:scale(.95)}.btn-mode-image.single{background:url(/assets/buttons/single.png) no-repeat center center/contain}.btn-mode-image.multi{background:url(/assets/buttons/multi.png) no-repeat center center/contain}#setup-screen,#settings-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;z-index:2000;overflow:hidden}.bokeh-bg{position:absolute;top:0;left:0;width:100%;height:100%;background:url(/assets/panels/background.png) no-repeat center bottom/cover;filter:blur(10px) brightness(.8);transform:scale(1.1);z-index:0}.setup-content{position:relative;z-index:10;width:90%;max-width:1000px;display:flex;flex-direction:column;align-items:center;gap:.5rem;animation:fadeIn .5s ease-out}.setup-title{font-family:var(--font-comic);font-size:3.5rem;color:#fff;text-shadow:0 4px 6px rgba(0,0,0,.5);font-weight:700;letter-spacing:2px;margin-bottom:.5rem;margin-top:2rem}.setup-forms{display:flex;width:100%;gap:3rem;justify-content:center}.team-input-card{flex:1;background:#ffffffe6;padding:2rem;border-radius:20px;box-shadow:0 10px 25px #0000004d;display:flex;flex-direction:column;gap:1.5rem;border:4px solid transparent;transition:transform .2s}.team-input-card.red{border-color:var(--red-team)}.team-input-card.blue{border-color:var(--blue-team)}.team-header{font-family:var(--font-comic);display:flex;align-items:center;gap:1rem;font-size:2rem;font-weight:400;text-transform:uppercase;border-bottom:2px solid #eee;padding-bottom:1rem}.team-input-card.red .team-header{color:var(--red-team)}.team-input-card.blue .team-header{color:var(--blue-team)}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-family:var(--font-comic);font-size:1.2rem;font-weight:400;color:#555;text-transform:uppercase}.form-group input{padding:.8rem;border:2px solid #ddd;border-radius:8px;font-size:1.2rem;font-family:var(--font-comic);outline:none;transition:border-color .2s}.form-group input:focus{border-color:#f1c40f}.btn-start-battle{background:url(/assets/buttons/start.png) no-repeat center center/contain;background-color:transparent;border:none;width:300px;height:100px;cursor:pointer;filter:drop-shadow(0 5px 10px rgba(0,0,0,.3));transition:transform .1s;margin-top:0}.btn-start-battle:hover{transform:scale(1.05);filter:drop-shadow(0 8px 15px rgba(0,0,0,.4))}.btn-start-battle:active{transform:scale(.95)}.btn-back{position:absolute;top:2rem;left:2rem;background:url(/assets/buttons/back.png) no-repeat center center/contain;background-color:transparent;width:60px;height:60px;border:none;cursor:pointer;z-index:20;transition:transform .2s;filter:drop-shadow(0 2px 5px rgba(0,0,0,.3))}.btn-back:hover{background-color:transparent;transform:scale(1.1);filter:drop-shadow(0 4px 8px rgba(0,0,0,.4))}.steam-container{position:absolute;width:50px;height:80px;z-index:25;pointer-events:none}.red-steam{left:25%;bottom:35%}.blue-steam{right:25%;bottom:35%}.home-steam{left:calc(31% - 7cm);bottom:45%;z-index:1}.home-steam .vapor{width:50px;height:50px;background:radial-gradient(circle,#ffffffe6,#fff0 70%);filter:blur(6px)}.home-steam .vapor:nth-child(2){width:60px;height:60px}.vapor{position:absolute;bottom:0;left:50%;width:30px;height:30px;background:radial-gradient(circle,#fff9,#fff0 70%);border-radius:50%;filter:blur(8px);opacity:0;transform:translate(-50%);animation:rise 2.5s infinite ease-out}.vapor:nth-child(1){animation-delay:0s}.vapor:nth-child(2){animation-delay:.8s;width:40px;height:40px}.vapor:nth-child(3){animation-delay:1.6s;width:25px;height:25px}@keyframes rise{0%{bottom:0;opacity:0;transform:translate(-50%) scale(.5)}30%{opacity:.8}to{bottom:120px;opacity:0;transform:translate(-50%) scale(2.5)}}.coin-wrapper{position:absolute;z-index:200;pointer-events:none;width:20px;height:20px;will-change:transform}.flying-coin{width:100%;height:100%;background:radial-gradient(#f1c40f,#d4ac0d);border:1px solid #b7950b;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0000004d;will-change:transform}.flying-coin:after{content:"Rp";color:#fff;font-family:var(--font-comic);font-weight:700;font-size:8px;text-shadow:0 1px 1px rgba(0,0,0,.5)}.team-input-card.gold{border-color:#f1c40f;border-width:4px}.settings-columns{display:flex;gap:2rem;width:100%}.settings-col{flex:1;display:flex;flex-direction:column;gap:1.5rem}.form-row{display:flex;gap:2rem;width:100%}.form-row .form-group{flex:1}.form-group select{padding:.8rem;border:2px solid #ddd;border-radius:8px;font-size:1.2rem;font-family:var(--font-comic);outline:none;background:#fff;cursor:pointer}.form-group select:focus{border-color:#f1c40f}.settings-columns{display:flex;flex-direction:row;gap:2rem;width:100%;justify-content:center}.settings-col{flex:1;display:flex;flex-direction:column;gap:1.5rem;justify-content:flex-start}.team-input-card.settings-layout{width:900px!important;max-width:95vw;padding:2rem;display:block}.settings-col .form-group{width:100%;margin:0}@media(max-width:768px){.settings-columns{flex-direction:column}}.btn-save-image{background:url(/assets/buttons/save.png) no-repeat center center/contain;background-color:transparent;border:none;width:300px;height:100px;cursor:pointer;filter:drop-shadow(0 5px 10px rgba(0,0,0,.3));transition:transform .1s;margin-top:1rem}.btn-save-image:hover{transform:scale(1.05);filter:drop-shadow(0 8px 15px rgba(0,0,0,.4))}.btn-save-image:active{transform:scale(.95)}.toast-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);background:#2ecc71f2;color:#fff;padding:1rem 2rem;border-radius:50px;font-family:var(--font-comic);font-size:1.2rem;box-shadow:0 5px 15px #0000004d;z-index:3000;opacity:0;animation:toastFadeInOut 3s forwards;pointer-events:none;display:flex;align-items:center;gap:10px}.toast-notification:before{content:"✅";font-size:1.5rem}@keyframes toastFadeInOut{0%{opacity:0;transform:translate(-50%,-20px)}10%{opacity:1;transform:translate(-50%)}80%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-20px)}}.modal-overlay .bokeh-bg{background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);filter:none}.modal-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:2500}.modal-content{position:relative;z-index:10;background:#fff;padding:2rem;border-radius:20px;box-shadow:0 10px 40px #00000080;display:flex;flex-direction:column;align-items:center;gap:1.5rem;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275);max-width:90%}.result-card{width:600px;border:4px solid var(--gold)}.confirmation-card{width:500px;text-align:center}.modal-title{font-family:var(--font-comic);font-size:2.5rem;color:var(--gold);text-shadow:2px 2px 0 #000;-webkit-text-stroke:1px #000;margin:0}.winner-display{text-align:center}#winner-text{font-family:var(--font-comic);font-size:2rem;margin-top:10px;color:#2c3e50}.score-summary{display:flex;align-items:center;justify-content:center;gap:2rem;width:100%;margin:1rem 0}.team-score-card{text-align:center;background:#f8f9fa;padding:1rem;border-radius:12px;min-width:150px}.team-score-card h4{font-family:var(--font-comic);color:#7f8c8d;margin-bottom:.5rem}.team-score-card.red h4{color:var(--red-team)}.team-score-card.blue h4{color:var(--blue-team)}.team-score-card span{font-family:var(--font-main);font-weight:900;font-size:1.5rem;color:#2c3e50}.vs-divider{font-family:var(--font-comic);font-weight:900;font-size:2rem;color:#bdc3c7}.modal-actions{display:flex;gap:1rem}.btn-primary-action{background:var(--green);color:#fff;border:none;padding:1rem 2rem;font-family:var(--font-comic);font-size:1.2rem;border-radius:50px;cursor:pointer;box-shadow:0 4px #27ae60;transition:transform .1s}.btn-primary-action:active{transform:translateY(4px);box-shadow:0 0 #27ae60}.btn-secondary-action{background:#95a5a6;color:#fff;border:none;padding:1rem 2rem;font-family:var(--font-comic);font-size:1.2rem;border-radius:50px;cursor:pointer;box-shadow:0 4px #7f8c8d}.btn-danger-action{background:var(--red-team);color:#fff;border:none;padding:1rem 2rem;font-family:var(--font-comic);font-size:1.2rem;border-radius:50px;cursor:pointer;box-shadow:0 4px #c0392b}.btn-secondary-action:active,.btn-danger-action:active{transform:translateY(4px);box-shadow:none}.confirmation-card p{font-size:1.2rem;color:#7f8c8d}.habit-tracker{position:absolute;top:50%;transform:translateY(-50%);width:60px;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:30px;padding:10px 0;display:flex;flex-direction:column;gap:12px;align-items:center;z-index:2100;box-shadow:0 4px 15px #0000004d;border:2px solid rgba(255,255,255,.1)}.habit-tracker.left-side{left:2%}.habit-tracker.right-side{right:2%}.habit-item{width:44px;height:44px;border-radius:50%;background:#ffffff26;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s cubic-bezier(.34,1.56,.64,1);position:relative;border:2px solid transparent}.habit-icon{font-size:22px;opacity:.5;filter:grayscale(.8);transition:all .3s ease;-webkit-user-select:none;user-select:none}.habit-item:hover{background:#ffffff40;transform:scale(1.1)}.habit-item.good{background:linear-gradient(135deg,#2ecc71,#27ae60);box-shadow:0 0 15px #2ecc7199;transform:scale(1.15);border-color:#fff;animation:popIn .4s cubic-bezier(.175,.885,.32,1.275)}.habit-item.average{background:linear-gradient(135deg,gold,#fdb931);box-shadow:0 0 15px #fdb93199;transform:scale(1.15);border-color:#fff;animation:popIn .4s cubic-bezier(.175,.885,.32,1.275)}.habit-item.bad{background:linear-gradient(135deg,#e74c3c,#c0392b);box-shadow:0 0 15px #e74c3c99;transform:scale(1.15);border-color:#fff;animation:popIn .4s cubic-bezier(.175,.885,.32,1.275)}.habit-item.good .habit-icon,.habit-item.average .habit-icon,.habit-item.bad .habit-icon{opacity:1;filter:grayscale(0)}.habit-tooltip{position:absolute;background:#fff;color:#2c3e50;padding:8px 16px;border-radius:12px;opacity:0;pointer-events:none;transition:all .3s cubic-bezier(.34,1.56,.64,1);bottom:auto;z-index:9999;box-shadow:0 5px 20px #0000004d;font-family:Outfit,sans-serif;width:max-content;visibility:hidden;text-align:center;line-height:1.3;display:flex;flex-direction:column;gap:2px}.habit-tooltip strong{font-size:14px;font-weight:800;color:#2c3e50}.habit-tooltip small{font-size:11px;font-weight:600;color:#7f8c8d;text-transform:uppercase;letter-spacing:.5px}.habit-tracker.left-side .habit-item .habit-tooltip{left:50%;top:50%;transform:translateY(-50%) translate(-20px) scale(.8)}.habit-tracker.left-side .habit-item:hover .habit-tooltip{left:125%;opacity:1;visibility:visible;transform:translateY(-50%) translate(0) scale(1)}.habit-tracker.right-side .habit-item .habit-tooltip{right:50%;top:50%;transform:translateY(-50%) translate(20px) scale(.8)}.habit-tracker.right-side .habit-item:hover .habit-tooltip{right:125%;opacity:1;visibility:visible;transform:translateY(-50%) translate(0) scale(1)}.battle-field,.team-zone,.habit-tracker,.habit-tracker.left-side,.habit-tracker.right-side{overflow:visible!important}@media(max-width:768px){.habit-tracker{width:40px;padding:5px 0;gap:8px}.habit-tracker.left-side{left:5px}.habit-tracker.right-side{right:5px}.habit-item{width:32px;height:32px}.habit-icon{font-size:16px}.habit-item:after{display:none}}#day-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:2500;color:#fff;overflow:hidden}.day-screen-wrapper{display:flex;flex-direction:column;align-items:center;width:95%;max-width:1200px;position:relative;z-index:20;animation:fadeIn .5s ease-out}.day-header-center{text-align:center;margin-bottom:2rem}.day-title-main{font-family:var(--font-comic);font-size:3.5rem;color:#f1c40f;text-shadow:0 4px 0 #c0392b;margin-bottom:.5rem}.day-subtitle-main{font-family:var(--font-main);font-size:1.5rem;font-weight:300;letter-spacing:3px;text-transform:uppercase;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.5)}.day-split-view{display:flex;justify-content:center;gap:3rem;width:100%;align-items:stretch}.day-team-panel{flex:1;max-width:450px;background:#0009;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:3px solid rgba(255,255,255,.2);border-radius:20px;padding:1.5rem;display:flex;flex-direction:column;align-items:center;box-shadow:0 10px 30px #0000004d;transition:transform .3s}.day-team-panel:hover{transform:translateY(-5px)}.red-panel{border-color:#e74c3c;box-shadow:0 0 20px #e74c3c33}.blue-panel{border-color:#3498db;box-shadow:0 0 20px #3498db33}.dt-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;border-bottom:2px solid rgba(255,255,255,.1);padding-bottom:1rem;width:100%;justify-content:center}.dt-avatar-frame{width:60px;height:60px;border-radius:50%;overflow:hidden;border:3px solid #fff;background:#fff}.dt-avatar-frame img{width:100%;height:100%}.dt-header h3{font-family:var(--font-comic);font-size:1.8rem;margin:0;text-shadow:0 2px 2px rgba(0,0,0,.5)}.red-panel h3{color:#e74c3c}.blue-panel h3{color:#3498db}.habits-list-compact{display:flex;flex-direction:column;gap:.8rem;width:100%}.habit-row-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:#ffffff1a;padding:.8rem 1rem;border-radius:10px;transition:background .2s}.h-left{display:flex;align-items:center;gap:1rem}.habit-row-item:hover{background:#fff3}.habit-row-item .h-icon{font-size:2rem}.h-text{display:flex;flex-direction:column;align-items:flex-start}.habit-row-item .h-name{font-family:var(--font-main);font-weight:700;font-size:1.1rem;color:#fff;line-height:1.2}.habit-row-item .h-desc{font-family:var(--font-main);font-size:.8rem;color:#f1c40f;opacity:.8}.h-right{display:flex;align-items:center}.habit-select{background:#0000004d;border:1px solid rgba(255,255,255,.3);color:#fff;padding:4px 8px;border-radius:6px;font-family:var(--font-main);font-size:.9rem;outline:none;cursor:pointer}.habit-select option{background:#333;color:#fff}.custom-checkbox{display:block;position:relative;padding-left:0;cursor:pointer;font-size:22px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:24px;height:24px}.custom-checkbox input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.checkmark{position:absolute;top:0;left:0;height:24px;width:24px;background-color:#0000004d;border:1px solid rgba(255,255,255,.5);border-radius:6px}.custom-checkbox:hover input~.checkmark{background-color:#00000080}.custom-checkbox input:checked~.checkmark{background-color:#2ecc71;border-color:#2ecc71}.checkmark:after{content:"";position:absolute;display:none}.custom-checkbox input:checked~.checkmark:after{display:block}.custom-checkbox .checkmark:after{left:8px;top:4px;width:6px;height:12px;border:solid white;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}#day-timer-container{position:absolute;bottom:30px;width:80px;height:80px;display:flex;justify-content:center;align-items:center}.timer-svg{transform:rotate(-90deg);width:100%;height:100%}.timer-circle-bg{fill:none;stroke:#fff3;stroke-width:8}.timer-circle-fg{fill:none;stroke:#f1c40f;stroke-width:8;stroke-dasharray:283;stroke-dashoffset:0;transition:stroke-dashoffset 1s linear}.timer-text{position:absolute;font-family:var(--font-comic);font-size:2rem;color:#fff}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}#learning-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2200;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem}#learning-screen.hidden{display:none!important}.learning-title-overlay{z-index:120;margin-top:0;margin-bottom:0;text-align:center}.learning-content{position:relative;top:auto;left:auto;transform:none;width:90%;max-width:800px;background:#fffffff2;border-radius:20px;padding:2rem;box-shadow:0 10px 30px #00000080;display:flex;flex-direction:column;align-items:center;z-index:100;animation:fadeIn .5s ease-out}.learning-scroll-box{width:100%;max-height:50vh;overflow-y:auto;background:#f8f9fa;border:2px solid #ddd;border-radius:12px;padding:1.5rem;margin:1.5rem 0;scrollbar-width:thin;scrollbar-color:var(--gold) #eee}.learning-scroll-box::-webkit-scrollbar{width:8px}.learning-scroll-box::-webkit-scrollbar-track{background:#eee;border-radius:4px}.learning-scroll-box::-webkit-scrollbar-thumb{background-color:var(--gold);border-radius:4px}.learning-section{margin-bottom:2rem;border-bottom:1px solid #eee;padding-bottom:1rem}.learning-section:last-child{border-bottom:none;margin-bottom:0}.learning-section h3{font-family:var(--font-comic);color:var(--blue-team);font-size:1.4rem;margin-bottom:.5rem}.learning-section p,.learning-section li{font-family:var(--font-main);color:#2c3e50;line-height:1.6;font-size:1.1rem;margin-bottom:.5rem}.learning-section ul{padding-left:1.5rem;margin-bottom:1rem}.learning-section strong{color:#c0392b;font-weight:700}.learning-section em{display:block;background:#fff8e1;padding:.5rem;border-radius:6px;border-left:4px solid var(--gold);font-style:normal;color:#7f8c8d;margin-top:.5rem}.learning-actions{display:none}.btn-next{position:absolute;top:2rem;right:2rem;background:url(/assets/buttons/next.png) no-repeat center center/contain;background-color:transparent;width:60px;height:60px;border:none;cursor:pointer;z-index:110;transition:transform .2s;filter:drop-shadow(0 2px 5px rgba(0,0,0,.3))}.btn-next:hover{transform:scale(1.1);filter:drop-shadow(0 4px 8px rgba(0,0,0,.4))}.settings-layout-tabs{display:flex!important;width:100%;height:400px;border:1px solid #ddd;border-radius:8px;overflow:hidden;background:#fff;flex-direction:row!important}.settings-sidebar{width:30%;min-width:150px;background:#f8f9fa;border-right:1px solid #ddd;display:flex;flex-direction:column}.tab-btn{padding:15px 20px;text-align:left;border:none;background:transparent;width:100%;cursor:pointer;font-family:Comic Neue,cursive,sans-serif;font-weight:700;font-size:1rem;color:#555;transition:all .2s;border-bottom:1px solid #eee}.tab-btn:hover{background:#e9ecef}.tab-btn.active{background:#fff;color:#f1c40f;border-left:5px solid #f1c40f;border-right:none;position:relative;z-index:2;margin-right:-1px}.settings-content-area{flex:1;padding:20px;overflow-y:auto;position:relative;background:#fff}.tab-pane{display:none;animation:fadeIn .3s}.tab-pane.active{display:block!important}.tab-title{margin-top:0;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid #f1c40f;color:#333}.tab-pane .form-group{margin-bottom:15px}.tab-pane .form-group label{display:block;font-weight:700;margin-bottom:5px;color:#555}.tab-pane .form-group input,.tab-pane .form-group select{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px}