/* DRUTO_LUDO_CLEAN_UI_V3 */
html.druto-clean-v3{--clean-gold:#eac15f;--clean-line:#85b5dc30;--clean-panel:#143a60;color-scheme:dark}
html.druto-clean-v3 body{background-color:#0c2948;background-image:linear-gradient(45deg,#2c608014 25%,transparent 25%,transparent 75%,#2c608014 75%),linear-gradient(-45deg,#2c608014 25%,transparent 25%,transparent 75%,#2c608014 75%),radial-gradient(ellipse at 50% 0,#245582,#092640 80%);background-size:64px 64px,64px 64px,100% 100%;background-attachment:fixed;overflow-x:hidden}
html.druto-clean-v3 body:before{display:none}
html.druto-clean-v3 .lobby{background:radial-gradient(ellipse at 50% 10%,#3777a955,transparent 60%),linear-gradient(135deg,#234d7440 25%,transparent 25%) 0 0/48px 48px,#103456;padding:25px 14px;align-items:center}
html.druto-clean-v3 .lobby:before,html.druto-clean-v3 .lobby:after{display:none}
html.druto-clean-v3 .lobby .lobbyCard{width:min(440px,100%);padding:24px;border:1px solid #8ac3f026;border-radius:27px;background:linear-gradient(165deg,#1c4a74ed,#113455f2);box-shadow:0 25px 65px #03142666,inset 0 1px #ffffff15;animation:none;backdrop-filter:none}
html.druto-clean-v3 .lobbyBrand{margin:0 0 24px;text-align:center}
html.druto-clean-v3 .cleanEyebrow{font-size:9px;color:#9dc5e5;letter-spacing:3px;font-weight:800;display:block;margin-bottom:4px}
html.druto-clean-v3 .lobbyBrand img{width:156px;height:144px;object-fit:contain;filter:none;animation:none;margin:-2px 0 -10px;border-radius:0}
html.druto-clean-v3 .lobbyBrand h1{font-size:38px;font-weight:950;letter-spacing:-1.4px;line-height:1.2;color:#f8fcff;margin:0;text-shadow:0 3px 0 #062745}
html.druto-clean-v3 .lobbyBrand h1 span{color:#f0d185}
html.druto-clean-v3 .lobbyBrand p{display:block;font-size:12px;color:#a5c5dd;margin:8px 0 0}
html.druto-clean-v3 .lobbyTitle{color:#d7e9f6;font-size:13px;letter-spacing:.2px;margin:0 0 12px;font-weight:750}
html.druto-clean-v3 .lobbyOptions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
html.druto-clean-v3 .lobbyOption{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:130px;padding:17px 12px;border:1px solid #72a8d055;border-bottom:4px solid #0a263f;border-radius:17px;background:linear-gradient(160deg,#2e6089,#1a4368);box-shadow:inset 0 1px #ffffff1c,0 5px 12px #031d3240;text-align:center;color:#f3f9ff;font-size:16px;transition:transform .12s,border-color .12s;cursor:pointer}
html.druto-clean-v3 .lobbyOption:after{display:none}
html.druto-clean-v3 .lobbyOption b{font-size:15px;font-weight:850;line-height:1.5}
html.druto-clean-v3 .lobbyOption small{display:block;font-size:10px;font-weight:500;color:#adcbe0;margin-top:4px;line-height:1.5}
html.druto-clean-v3 .lobbyOption.active{outline:0;border-color:#edc971;box-shadow:inset 0 0 0 1px #edc97199,0 5px 12px #031d3240;background:linear-gradient(160deg,#386e98,#245276)}
html.druto-clean-v3 .lobbyOption.active:before{content:'✓';position:absolute;top:8px;right:9px;font-size:10px;display:grid;place-items:center;background:#edc971;color:#173554;width:17px;height:17px;border-radius:50%}
html.druto-clean-v3 .cleanModeIcon{font-size:36px;line-height:1;letter-spacing:-5px;margin-bottom:10px;color:#f1d28a;text-shadow:0 3px 7px #061b3d}
html.druto-clean-v3 .cleanOnline{grid-column:1/-1;min-height:116px;align-items:flex-start;text-align:left;padding:18px 20px 18px 88px;border-color:#61b5d979;background:linear-gradient(120deg,#237691,#235679)}
html.druto-clean-v3 .cleanOnline .cleanModeIcon{position:absolute;left:23px;top:32px;font-size:42px;color:#a6e8f8}
html.druto-clean-v3 .cleanOnline b{font-size:19px}
html.druto-clean-v3 .cleanOnline small{font-size:10px;margin-top:1px}
html.druto-clean-v3 .cleanPill{display:block;background:#061f363d;color:#b5f2e6;font-size:8px;letter-spacing:.5px;padding:4px 8px;border-radius:8px;margin-top:8px;border:1px solid #9deac62e}
html.druto-clean-v3 .cleanClassic{grid-template-columns:1fr}
html.druto-clean-v3 .cleanClassic .lobbyOption{min-height:185px;padding:22px}
html.druto-clean-v3 .lobbyGrid{grid-template-columns:repeat(3,1fr);gap:10px}
html.druto-clean-v3 .lobbyGrid .lobbyOption{min-height:115px;padding:12px 5px}
html.druto-clean-v3 .cleanNumber{font-size:40px;color:#f1d28a;font-weight:900;line-height:1.2}
html.druto-clean-v3 .lobbyActions{grid-template-columns:100px 1fr;gap:10px;margin-top:20px}
html.druto-clean-v3 .lobbyActions button{min-height:49px;border-radius:13px;font-size:13px;cursor:pointer}
html.druto-clean-v3 .lobbyBack{background:#10304e;border:1px solid #6b9ac249!important;color:#b4d3e9}
html.druto-clean-v3 .lobbyNext{background:linear-gradient(#ffe39c,#e9bb55);color:#3c2a0d;border-bottom:3px solid #b38733!important;box-shadow:inset 0 1px #fff8,0 5px 14px #00152e55}
html.druto-clean-v3 .lobbyPolicy{display:block;margin-top:18px;font-size:10px;color:#7ea5c4}
html.druto-clean-v3 .musicFloat{position:fixed;top:15px;right:15px;width:40px;height:40px;background:#103454;border:1px solid #96c2df4d;box-shadow:none;border-radius:13px;font-size:0}
html.druto-clean-v3 .musicFloat:after{font-size:21px;color:#e9ce86}
html.druto-clean-v3 .app{width:min(760px,100%);padding:14px 14px 24px}
html.druto-clean-v3 .bar{min-height:48px;height:auto;flex-wrap:wrap;gap:8px;padding:0 0 12px}
html.druto-clean-v3 .logo{font-size:17px;color:#e1eff9}.druto-clean-v3 .logo span{color:#f0cf78}
html.druto-clean-v3 .back{border:1px solid #8dbadb33;background:#133d60;color:#bdd7eb;font-size:11px;border-radius:10px}
html.druto-clean-v3 .v4hud{margin:0;display:flex;gap:5px;flex-wrap:wrap}
html.druto-clean-v3 .v4pill{border:1px solid #77a7ca22;background:#174064;box-shadow:none;border-radius:8px;padding:6px 8px;font-size:10px}
html.druto-clean-v3 .v4buy{font-size:10px;padding:6px 8px;background:#d9bd7b}
html.druto-clean-v3 .proStrip{gap:7px;margin:0 0 12px}
html.druto-clean-v3 .proStat{padding:8px;background:#153d60;border:1px solid #80afd126;border-radius:12px;box-shadow:none;color:#8fb2cc;font-size:9px}
html.druto-clean-v3 .proStat b{color:#e8f4fd;font-size:12px;margin-top:3px}
html.druto-clean-v3 .game{max-width:580px;margin:auto}
html.druto-clean-v3 .boardBox{padding:7px;border:2px solid #d8b965;border-radius:18px;background:#173c5d;box-shadow:0 0 0 3px #071e344d,0 16px 35px #03132259}
html.druto-clean-v3 .boardBox:after{display:none}
html.druto-clean-v3 .board{border:3px solid #f1ead6;border-radius:9px;box-shadow:none;animation:none;background:#fffdf4;isolation:isolate}
html.druto-clean-v3 .board:before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(#fffdf5,#fffdf5) 9.09% 9.09%/26.6667% 26.6667% no-repeat,linear-gradient(#fffdf5,#fffdf5) 90.91% 9.09%/26.6667% 26.6667% no-repeat,linear-gradient(#fffdf5,#fffdf5) 9.09% 90.91%/26.6667% 26.6667% no-repeat,linear-gradient(#fffdf5,#fffdf5) 90.91% 90.91%/26.6667% 26.6667% no-repeat}
html.druto-clean-v3 .board:after{content:'';position:absolute;left:40%;top:40%;width:20%;height:20%;background:conic-gradient(from -45deg,#22ad71 0deg 90deg,#efc241 90deg 180deg,#368bd2 180deg 270deg,#e64f59 270deg);z-index:1;pointer-events:none}
html.druto-clean-v3 .cell{border-color:#7893a44d;box-shadow:none}
html.druto-clean-v3 .yard{border:0;box-shadow:none}
html.druto-clean-v3 .yard.red{background:#e64f59}html.druto-clean-v3 .yard.green{background:#22ad71}html.druto-clean-v3 .yard.blue{background:#368bd2}html.druto-clean-v3 .yard.yellow{background:#efc241}
html.druto-clean-v3 .yard:after{content:'';display:none;position:absolute;inset:-12%;border:2px solid currentColor;border-radius:50%;z-index:2;pointer-events:none;opacity:.38}
html.druto-clean-v3 .yard.red:after{color:#d5414c}html.druto-clean-v3 .yard.green:after{color:#129562}html.druto-clean-v3 .yard.blue:after{color:#217abe}html.druto-clean-v3 .yard.yellow:after{color:#d3a10f}
html.druto-clean-v3 .yard:is([data-key='1-1'],[data-key='1-4'],[data-key='4-1'],[data-key='4-4'],[data-key='1-10'],[data-key='1-13'],[data-key='4-10'],[data-key='4-13'],[data-key='10-1'],[data-key='10-4'],[data-key='13-1'],[data-key='13-4'],[data-key='10-10'],[data-key='10-13'],[data-key='13-10'],[data-key='13-13']):after{display:block}
html.druto-clean-v3 .track{background:#fffdf5}html.druto-clean-v3 .safe{background:#dce8ed}html.druto-clean-v3 .safe:after{color:#708b9b;font-size:clamp(10px,2.5vw,18px)}
html.druto-clean-v3 .home-red{background:#ee7b80}html.druto-clean-v3 .home-green{background:#68c596}html.druto-clean-v3 .home-yellow{background:#f2d471}html.druto-clean-v3 .home-blue{background:#79b4df}
html.druto-clean-v3 .token{width:58%;height:64%;border:0;border-radius:45% 45% 35% 35%;box-shadow:inset 0 -3px 4px #0004,0 3px 4px #0005;z-index:4}
html.druto-clean-v3 .token:before{box-shadow:0 1px 3px #0005;border:1px solid #ffffff9c}
html.druto-clean-v3 .token:after{border:1px solid #ffffffb0;box-shadow:0 2px 3px #0005}
html.druto-clean-v3 .token.can{filter:drop-shadow(0 0 4px #fff);animation:cleanPawn 1s ease-in-out infinite alternate}
@keyframes cleanPawn{to{filter:drop-shadow(0 0 5px #f1cd70);translate:0 -8%}}
html.druto-clean-v3 .side{gap:7px;margin-top:12px;grid-template-columns:1fr 94px}
html.druto-clean-v3 .card{box-shadow:none;border:1px solid #77a5c526;background:#143a5b;border-radius:12px}
html.druto-clean-v3 .turn{font-size:15px;min-height:46px;border:1px solid #ffffff33;border-radius:12px;box-shadow:none;padding:8px}
html.druto-clean-v3 .turn.red{background:#ae3547}html.druto-clean-v3 .turn.green{background:#167855}html.druto-clean-v3 .turn.yellow{background:#99720f}html.druto-clean-v3 .turn.blue{background:#246fa5}
html.druto-clean-v3 .status{font-size:11px;color:#c8e2f4;padding:8px;line-height:1.6}
html.druto-clean-v3 .diceCard{padding:5px;border-color:#d2b26966;background:#14334f}
html.druto-clean-v3 .dice{width:76px;height:76px;font-size:52px;border:2px solid #fffae5;border-radius:18px;background:#fff9e8;color:#1e405e;box-shadow:inset -3px -4px 0 #d1cab7,0 4px 6px #071d333d}
html.druto-clean-v3 .dice.disabled{opacity:.55}
html.druto-clean-v3 .players{grid-template-columns:repeat(4,1fr);padding:7px;gap:6px}
html.druto-clean-v3 .p{border:1px solid #80afcb20;box-shadow:none;border-radius:9px;background:#1c4567;padding:7px 3px;font-size:10px;color:#c5dff2}
html.druto-clean-v3 .tools{border:0;padding:0;background:transparent;box-shadow:none;gap:6px}
html.druto-clean-v3 .tool{box-shadow:none;background:#174264;border:1px solid #71a4c735;border-radius:11px;min-height:42px;font-size:10px;color:#c5e1f4}
html.druto-clean-v3 .soundPulse{animation:none;border-color:#80c5b777}
html.druto-clean-v3 #drutoOnlinePanel{background:#08243bf2}
html.druto-clean-v3 #drutoOnlinePanel .lobbyCard{width:min(460px,100%);background:#143c5f;border:1px solid #9bbfd133;border-radius:24px;box-shadow:0 24px 60px #00182c66;padding:23px;animation:none}
html.druto-clean-v3 #drutoOnlinePanel h2{font-size:21px;color:#f1d793;margin-top:0}
html.druto-clean-v3 #drutoOnlinePanel p{font-size:12px;line-height:1.7;color:#b0cee2}
html.druto-clean-v3 #drutoOnlinePanel input,html.druto-clean-v3 #drutoOnlinePanel select{background:#0b2d49;border:1px solid #77acc25e;border-radius:12px;font-size:14px}
html.druto-clean-v3 #drutoOnlinePanel .onlineRow button{background:#285d81;border:1px solid #87b7cd33;border-radius:12px;font-size:12px;padding:11px}
html.druto-clean-v3 #drutoOnlinePanel :is(#onlineCreate,#onlineStart){background:linear-gradient(#f1d58c,#ddaf50);color:#322507}
html.druto-clean-v3 #drutoOnlineStrip{background:#164361;border:1px solid #70a6bc3b;border-radius:12px;font-size:10px}
html.druto-clean-v3 #drutoOnlineStrip button{background:#2b6182;color:#dfedf7}
html.druto-clean-v3 #ludoSocialDock{border-color:#7aa9c336;border-radius:20px;background:#103350;box-shadow:0 16px 35px #061c3033}
html.druto-clean-v3 .socialSeat{border-width:2px;border-radius:13px;background:#153c5d;box-shadow:none}
html.druto-clean-v3 .socialSeat.active-turn{box-shadow:0 0 0 2px #ebc66d6e;border-color:#ebc66d}
html.druto-clean-v3 .socialName{background:#062741df}
html.druto-clean-v3 #socialText{background:#092a44;border-color:#8db5ce33}
html.druto-clean-v3 #ludoSocialDock button{background:#1f4c6b;border-color:#8db5ce2b}
html.druto-clean-v3 #ludoSocialDock #socialCamera{background:#24745f}
html.druto-clean-v3 .socialTitle h2{color:#e9f4fb}.druto-clean-v3 .socialComment{background:#1b436044}
html.druto-clean-v3 .winbox,html.druto-clean-v3 .proModalBox{background:#153d60;border:1px solid #cbaa5266;box-shadow:0 25px 60px #00182c80;border-radius:22px}
html.druto-clean-v3 button:focus-visible{outline:3px solid #f6d991;outline-offset:3px}
@media(max-width:520px){html.druto-clean-v3 .app{padding:8px 8px 20px}html.druto-clean-v3 .lobby{padding:20px 12px}html.druto-clean-v3 .lobby .lobbyCard{padding:20px 18px;border-radius:23px}html.druto-clean-v3 .lobbyBrand{margin-bottom:18px}html.druto-clean-v3 .lobbyBrand img{width:130px;height:120px}html.druto-clean-v3 .lobbyBrand h1{font-size:34px}html.druto-clean-v3 .lobbyOption{min-height:113px;padding:13px 8px}html.druto-clean-v3 .cleanOnline{min-height:112px;padding-left:80px}html.druto-clean-v3 .cleanOnline b{font-size:18px}html.druto-clean-v3 .lobbyBrand p{font-size:11px}html.druto-clean-v3 .bar .v4hud{display:none}html.druto-clean-v3 .boardBox{padding:4px;border-radius:13px}html.druto-clean-v3 .board{border-width:2px;border-radius:7px}html.druto-clean-v3 .side{margin-top:9px}html.druto-clean-v3 .players{grid-template-columns:repeat(4,1fr)}html.druto-clean-v3 .p{font-size:9px}html.druto-clean-v3 .proStat{padding:7px 4px}html.druto-clean-v3 .cleanModeIcon{font-size:31px}html.druto-clean-v3 .lobbyGrid .lobbyOption{min-height:110px}}
@media(max-height:720px){html.druto-clean-v3 .lobby{align-items:start;padding-top:15px}html.druto-clean-v3 .lobby .lobbyCard{padding-top:14px}html.druto-clean-v3 .lobbyBrand{margin-bottom:12px}html.druto-clean-v3 .lobbyBrand img{width:108px;height:100px}html.druto-clean-v3 .lobbyBrand h1{font-size:29px}html.druto-clean-v3 .lobbyBrand p{margin-top:4px}html.druto-clean-v3 .lobbyOption{min-height:100px}html.druto-clean-v3 .cleanOnline{min-height:102px}html.druto-clean-v3 .lobbyActions{margin-top:14px}}
@media(prefers-reduced-motion:reduce){html.druto-clean-v3 .token.can,html.druto-clean-v3 .token.moving{animation:none}}