@font-face{font-family:Barlow;src:url('/site/fonts/barlow-500.woff2?v=501c4f18721925fd') format('woff2');font-style:normal;font-weight:500;font-display:swap} @font-face{font-family:Barlow Condensed;src:url('/site/fonts/barlow-condensed-500.woff2?v=501c4f18721925fd') format('woff2');font-style:normal;font-weight:500;font-display:swap} @font-face{font-family:Barlow Condensed;src:url('/site/fonts/barlow-condensed-700.woff2?v=501c4f18721925fd') format('woff2');font-style:normal;font-weight:700;font-display:swap} @font-face{font-family:Barlow Condensed;src:url('/site/fonts/barlow-condensed-900.woff2?v=501c4f18721925fd') format('woff2');font-style:normal;font-weight:900;font-display:swap} @font-face{font-family:Barlow;src:url('/site/fonts/barlow-400.woff2?v=501c4f18721925fd') format('woff2');font-style:normal;font-weight:400;font-display:swap} @font-face{font-family:Barlow;src:url('/site/fonts/barlow-600.woff2?v=501c4f18721925fd') format('woff2');font-style:normal;font-weight:600;font-display:swap} @font-face{font-family:Barlow;src:url('/site/fonts/barlow-700.woff2?v=501c4f18721925fd') format('woff2');font-style:normal;font-weight:700;font-display:swap} /* Shared visual contract for the public website and the game. */ :root{ --mastro-bg:#181818; --mastro-surface:#242424; --mastro-deep:#101010; --mastro-raised:#2e2e2e; --mastro-subtle:#1f1f1f; --mastro-line:#464646; --mastro-line-strong:#707070; --mastro-paper:#e6e6df; --mastro-ink:#202020; --mastro-muted:#b7b7b3; --mastro-gold:#ffd12a; --mastro-gold-hover:#ffdf66; --mastro-gold-border:#ffe887; --mastro-gold-subtle:#343120; --mastro-value-ink:#704b00; --mastro-success:#9bdfbf; --mastro-danger:#ffa296; --mastro-danger-surface:#382925; --mastro-danger-line:#a66e61; --mastro-shadow:#080808; --mastro-shadow-soft:#08080880; --mastro-backdrop:#050505db; --mastro-glow:#ffd12a06; --mastro-discord:#4f4d9e; --mastro-discord-hover:#6560b9; --mastro-discord-line:#aaa2ff; --mastro-white:#fff; --mastro-font-medium:500; --mastro-font-body:Barlow,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif; --mastro-font-display:Barlow Condensed,Impact,sans-serif; --mastro-radius-control:4px; --mastro-radius-card:6px; --mastro-space-xs:6px; --mastro-space-sm:10px; --mastro-space-md:12px; --mastro-space-lg:16px; --mastro-space-xl:24px; --mastro-control-height:44px; --mastro-font-screen:2.8rem; --mastro-font-card:1.55rem; --mastro-font-body-size:.875rem; --mastro-font-small:.75rem; } /* Purple identifies the training guide without changing the city's palette. */ .in-tutorial{ --mastro-tutorial-surface:#241a32; --mastro-tutorial-raised:#38264d; --mastro-tutorial-hover:#45305e; --mastro-tutorial-line:#9674bc; --mastro-tutorial-accent:#d3adff; --mastro-tutorial-text:#f6efff; --mastro-tutorial-muted:#d0bedf; } /* Shared symbols, help controls and readable tooltips across site and game. */ .ui-icon{display:inline-block;width:1em;height:1em;flex:none;vertical-align:-.125em;pointer-events:none} /* The icon occupies one fixed square; the invisible hit area never changes layout. */ .tooltip-trigger,.tooltip-trigger:hover,.tooltip-trigger:focus-visible,.tooltip-trigger:active{position:relative;display:inline-flex!important;align-items:center;justify-content:center;flex:none;width:18px!important;min-width:18px!important;max-width:18px!important;height:18px!important;min-height:18px!important;padding:0!important;margin-block:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;transform:none!important;cursor:help;line-height:1!important;text-decoration:none;transition:color .15s} .tooltip-trigger{color:var(--mastro-muted)!important} :root .tooltip-trigger:hover,:root .tooltip-trigger:focus-visible{color:var(--mastro-gold)!important} .tooltip-trigger::before{content:'';position:absolute;inset:-4px} .tooltip-trigger>.ui-icon{width:15px!important;height:15px!important;font-size:15px!important} .interface-tooltip{position:fixed;z-index:1800;max-width:min(310px,calc(100vw - 24px));padding:12px 14px;border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-card);background:var(--mastro-paper);color:var(--mastro-ink);box-shadow:0 7px 24px var(--mastro-shadow-soft);font:500 .875rem/1.45 var(--mastro-font-body);text-align:left;white-space:normal;overflow-wrap:anywhere} .interface-tooltip ul{margin:0;padding-left:18px} .interface-tooltip li+li{margin-top:6px} .interface-tooltip p{margin:12px 0 0;color:inherit} .interface-tooltip[hidden]{display:none} @media(pointer:coarse){.tooltip-trigger::before{inset:-5px}} [data-tooltip]:focus-visible{outline:2px solid var(--mastro-gold);outline-offset:3px} /* Medium is the default; game quantities have a deliberate bold exception. */ body{font-weight:var(--mastro-font-medium)} body :is(h1,h2,h3,h4,h5,h6,p,span,small,strong,b,em,a,button,input,select,textarea,label,summary,li,dt,dd,th,td,time,code,legend){font-weight:var(--mastro-font-medium)!important} body :where(p,span,small,strong,b,em,a,button,input,select,textarea,label,summary,li,dt,dd,th,td,time,legend){font-family:inherit} /* The consent dialog is mounted independently on both public and game pages. */ :root .analytics-choice{font:500 .875rem/1.45 var(--mastro-font-body);padding:14px;background:var(--mastro-surface);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-card);color:var(--mastro-paper);box-shadow:0 6px 30px var(--mastro-shadow-soft)} :root .analytics-choice::backdrop{background:var(--mastro-backdrop)} :root .analytics-choice a{color:var(--mastro-gold)} :root .analytics-choice button{font-family:var(--mastro-font-body);border-radius:var(--mastro-radius-control)} :root .analytics-choice .analytics-option{display:flex;align-items:flex-start;gap:10px;margin:10px 0;padding:10px;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-control);font-size:.875rem;color:var(--mastro-paper);cursor:pointer} :root .analytics-option input{width:18px;height:18px;min-height:18px;flex:none;margin:2px 0 0;accent-color:var(--mastro-gold)} :root .analytics-option small{display:block;font-size:.75rem;line-height:1.4;color:var(--mastro-muted);margin-top:3px} :root .analytics-choice .analytics-audience-note{font-size:.75rem;line-height:1.4;margin:10px 0 12px} :root{color-scheme:dark;--bg:#10151b;--panel:#1c242c;--line:#35414c;--text:#f0eee8;--muted:#aab5bd;--gold:#ffc54a;--teal:#76d5bb;--red:#f48c86;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #53616d;border-radius:7px;padding:10px 15px;background:#2b3742;color:var(--text);font-weight:650;line-height:1.2;min-height:40px}button:hover:not(:disabled){background:#3b4955;border-color:#a3b0b9}button:disabled{opacity:.4;cursor:not-allowed}.primary{background:var(--gold);border-color:#ffe1a0;color:#171b20;box-shadow:0 3px 0 #97702a}.primary:hover:not(:disabled){background:#ffda83;border-color:#fff0c9}.quiet,.level-link{background:#24313a;border-color:#53616d;color:var(--text);box-shadow:0 2px 0 #111a22}.quiet:active:not(:disabled),.level-link:active:not(:disabled){box-shadow:none;transform:translateY(1px)}:focus-visible{outline:3px solid var(--teal);outline-offset:3px}h1,h2,h3,p{margin-top:0}h1{font-size:1.7rem;line-height:1.25;margin-bottom:9px}h2{font-size:1.06rem;line-height:1.4;margin-bottom:10px}h3{font-size:1rem}p{line-height:1.55;color:var(--muted);margin-bottom:14px}small{color:var(--muted);font-size:.9rem;line-height:1.6}img{object-fit:contain;image-rendering:auto}button,select{touch-action:manipulation}.boot{padding:40px}.title-screen{max-width:1120px;min-height:100dvh;margin:auto;display:flex;align-items:center;padding:55px 60px;gap:40px}.title-copy{flex:1;position:relative;z-index:1}.logo{width:min(100%,360px);max-height:170px;object-position:left;margin-bottom:35px}.title-copy h1{font-size:2.7rem;max-width:500px;letter-spacing:-.04em}.title-copy p{max-width:390px}.title-actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 35px}.title-player{width:40%;max-height:610px;filter:none}.topbar{display:flex;align-items:center;gap:32px;max-width:1400px;margin:auto;padding:16px 28px}.brand{width:150px;max-height:65px}.resources{display:flex;align-items:center;gap:30px;flex:1}.resources>strong{font-size:1.5rem;color:var(--teal);min-width:120px;font-variant-numeric:tabular-nums}.resources>div{width:145px}.resources span{display:flex;justify-content:space-between;font-size:.9rem;color:var(--muted);margin-bottom:7px}.resources b{color:var(--text);font-variant-numeric:tabular-nums}progress{display:block;width:100%;height:7px;border:0;background:#34414a;border-radius:6px;overflow:hidden;accent-color:var(--teal)}progress::-webkit-progress-bar{background:#34414a;border-radius:6px}progress::-webkit-progress-value{background:var(--teal);border-radius:6px}.danger::-webkit-progress-value{background:var(--red)}.header-actions{display:flex;gap:5px;align-items:center}.header-actions button{padding:9px 11px}.tabs{display:flex;max-width:1344px;margin:auto;gap:5px;border-bottom:1px solid var(--line);padding:0 0 8px}.tabs button{border:0;background:transparent;color:var(--muted);padding:13px 23px;border-radius:7px 7px 0 0;white-space:nowrap}.tabs button.active{background:#26313a;color:var(--gold);box-shadow:inset 0 -3px var(--gold)}.budget-line{max-width:1344px;margin:auto;display:flex;align-items:center;gap:12px;padding:10px 2px;font-size:.9rem;color:var(--muted)}.budget-line button{font-size:.9rem;min-height:28px;padding:4px 8px;border:0;background:transparent;text-decoration:underline;color:var(--muted)}.save-state{margin-left:auto;font-size:.9rem}.game-content{max-width:1344px;margin:0 auto;padding:12px 0 65px}.objective{font-size:.9rem;border-left:3px solid var(--gold);padding:8px 12px;margin:6px 0 30px;color:#dce0df;max-width:800px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.section-head p{margin-bottom:0;font-size:.9rem;max-width:760px}.section-head>strong{color:var(--gold);white-space:nowrap}.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.card{padding:22px;border-radius:10px;background:var(--panel);border:1px solid var(--line);min-width:0}.card p{font-size:.9rem}.card-title{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.card-title h2{margin:0}.chance{color:var(--teal);font-size:1.3rem}.reward{font-size:1.2rem!important;color:var(--gold);font-weight:700;margin:15px 0}.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px}.card-bottom>span{color:var(--muted);font-size:.9rem}.card-bottom button{font-size:.9rem}details{color:var(--muted);font-size:.9rem}summary{cursor:pointer;padding:14px 0 3px}details[open] summary{margin-bottom:12px}details p{font-size:.9rem}.contribution{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:7px 0;border-top:1px solid var(--line);font-size:.9rem}.contribution span:last-child{text-align:right}.locked-list{margin-top:24px;max-width:800px}.locked-list p{padding:9px 0;margin:0;display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);font-size:.9rem}.locked-list span{font-size:.9rem;color:#c6cdd2;text-align:right}.result{padding:16px 20px;display:flex;gap:15px;align-items:center;border:1px solid #3c7364;border-radius:7px;margin-bottom:20px;background:#1a302c}.result strong{color:var(--teal)}.result span{font-size:.9rem}.result.failure{background:#382626;border-color:#844c49}.result.failure strong{color:var(--red)}.subtabs{display:flex;gap:8px;margin-bottom:22px}.subtabs button{background:transparent;color:var(--muted);border-color:var(--line)}.subtabs button.selected{color:var(--gold);border-color:var(--gold)}.people-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.person-card{display:flex;align-items:flex-start;gap:18px;padding:18px}.portrait{flex-shrink:0;display:block;width:105px;aspect-ratio:3/4;background-size:400% 200%;background-repeat:no-repeat;image-rendering:auto;border-radius:5px}.person-content{flex:1;min-width:0}.person-content .card-title{display:block}.person-content .card-title>span{font-size:.9rem}.person-content h2{margin-bottom:2px}.person-content p{font-size:.9rem;margin:10px 0}.stats-inline{color:#e0cfa8!important}.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.person-card button{font-size:.9rem;padding:9px 11px}.relation-ally,.relation-girlfriend{color:var(--teal)}.relation-enemy{color:var(--red)}.relation-neutral{color:var(--muted)}.arrears{border-top:1px solid #71534d;margin-top:14px;padding-top:10px;font-size:.9rem;color:#ffc3b6}.arrears button{margin-left:8px}.atlas{display:block;image-rendering:auto;background-repeat:no-repeat;width:100%;aspect-ratio:4/3}.building,.club-art{max-height:180px;margin-bottom:18px;object-fit:contain}label{display:block;color:var(--muted);font-size:.9rem;line-height:1.5}select{display:block;width:100%;background:#131b22;border:1px solid #4b5b68;border-radius:5px;color:var(--text);padding:10px;margin-top:6px;max-width:100%}.muted{color:var(--muted)}.services{margin-bottom:22px;border-color:#658b81}.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.service-grid p{font-size:.9rem}.clubs{grid-template-columns:repeat(3,minmax(0,1fr))}.club-card button{width:100%;margin-top:8px}.recovery{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:24px}.recovery p{margin:0;max-width:680px}.section-note{font-size:.9rem;margin-top:25px}.attributes{margin-top:25px;margin-bottom:25px}.stat-number{font-size:2.5rem;color:var(--gold)}.feed{font-size:.9rem;line-height:1.6;color:var(--muted);padding-left:18px}.feed li{padding:5px 0}.pause-banner{color:var(--gold);border:1px solid #6f613c;text-align:center;padding:14px;margin-bottom:24px;border-radius:6px}.point{display:inline-grid;place-items:center;background:var(--gold);color:#1b232c;width:19px;height:19px;border-radius:50%;font-size:.9rem}.empty{padding:20px 0}.modal-backdrop{position:fixed;inset:0;z-index:95;background:#05090edb;display:flex;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(4px)}.dialog{border:1px solid #566571;border-radius:12px;background:#1d2731;padding:28px;width:620px;max-width:100%;max-height:90dvh;overflow:auto;box-shadow:0 20px 100px #0008}.dialog-close{display:flex;justify-content:flex-end;margin-bottom:14px}.dialog-close button{padding:6px 12px;min-height:32px;font-size:.9rem}.menu-actions{display:grid;gap:10px}.dialog h2{font-size:1.5rem}.dialog label{margin-bottom:18px}.dialog input[type=range]{width:100%;display:block;margin-top:10px}.check{display:flex;align-items:center;gap:9px}.check input{width:18px;height:18px;accent-color:var(--gold)}dl{display:grid;grid-template-columns:1fr auto;gap:15px;font-size:.9rem;margin-bottom:28px}dt{color:var(--muted)}dd{margin:0;color:var(--gold)}.dialog>p{font-size:.9rem;margin-top:22px}.dialog>.actions{margin:22px 0}#toasts{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:100;max-width:min(600px,90vw);background:#344551;border:1px solid #94b5bf;color:white;border-radius:8px;padding:13px 19px;box-shadow:0 8px 30px #0008;opacity:0;pointer-events:none;font-size:.9rem;transition:opacity .18s}#toasts.visible{opacity:1}.large-text{font-size:18px} @media(max-width:1450px){.tabs,.budget-line,.game-content{margin-left:28px;margin-right:28px}.topbar{gap:20px}.resources{gap:20px}.tabs button{padding-left:20px;padding-right:20px}} @media(max-width:1050px){.brand{width:110px}.topbar{gap:20px}.resources{gap:16px}.resources>strong{font-size:1.2rem;min-width:100px}.resources>div{width:120px}.header-actions{gap:2px}.header-actions button{font-size:.9rem}.people-grid{grid-template-columns:1fr}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tabs{justify-content:space-between}.tabs button{padding:11px 15px}.title-screen{padding:40px}.title-copy h1{font-size:2.2rem}} @media(max-width:700px){:root{font-size:16px}.topbar{padding:14px 16px;flex-wrap:wrap;gap:14px}.brand{width:90px;height:44px}.resources{order:3;flex-basis:100%;justify-content:space-between;gap:18px}.resources>strong{font-size:1.25rem;min-width:100px}.resources>div{width:auto;flex:1}.header-actions{margin-left:auto}.tabs,.budget-line,.game-content{margin-left:16px;margin-right:16px}.tabs{overflow-x:auto;justify-content:flex-start;gap:0;scrollbar-width:thin}.tabs button{font-size:.9rem;padding:12px 16px}.budget-line{padding:12px 0}.save-state{display:none}.game-content{padding-top:0}.objective{margin-bottom:24px;font-size:.9rem}.section-head{align-items:flex-start;gap:15px}.section-head>button{font-size:.9rem;max-width:135px;padding:9px 11px;min-height:36px}.card-grid{grid-template-columns:1fr}.card{padding:19px}.frauds{gap:14px}.result{align-items:flex-start;flex-direction:column;gap:5px}.title-screen{padding:36px 24px;align-items:flex-start;position:relative;overflow:hidden}.title-copy{padding-top:40px}.logo{width:280px;max-height:140px;margin-bottom:30px}.title-copy h1{font-size:2.4rem;max-width:300px}.title-copy p{max-width:270px}.title-actions{flex-direction:column;align-items:flex-start;gap:13px;max-width:220px}.title-actions button{width:100%;min-height:45px}.title-player{position:absolute;bottom:-12px;right:-26px;width:53%;max-height:55vh;opacity:.55;pointer-events:none}.person-card{padding:15px;gap:13px}.portrait{width:82px}.person-content .actions{gap:5px}.person-content button{font-size:.9rem}.service-grid{grid-template-columns:1fr;gap:25px}.recovery{display:block}.recovery button{margin-top:18px}.section-head>strong{font-size:.9rem}.modal-backdrop{padding:14px}.dialog{padding:20px}.locked-list p{font-size:.9rem}.locked-list span{max-width:45%}dl{font-size:.9rem}.clubs{grid-template-columns:repeat(2,minmax(0,1fr))}.club-card{padding:14px}.club-card h2{font-size:.95rem}.club-card p{font-size:.9rem}.club-card button{padding:9px;font-size:.9rem}.club-art{max-height:100px}.building{max-height:165px}} .pixel-icon{display:inline-block;width:22px;height:22px;vertical-align:middle;flex-shrink:0;background-size:600% 400%;background-repeat:no-repeat;image-rendering:auto;margin-right:7px}button>.pixel-icon{width:20px;height:20px}.tabs .pixel-icon{width:22px;height:22px}.header-actions .pixel-icon{width:17px;height:17px}.atlas.building,.atlas.club-art{width:min(100%,180px);height:auto;max-height:none;margin:0 auto 18px}@media(max-width:700px){.atlas.club-art{width:min(100%,120px)}} .service-heading{margin-top:24px;color:var(--gold)}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.service-card{display:flex;gap:18px;align-items:center;padding:15px;background:#141d25;border-radius:8px}.service-card p{margin-bottom:10px;font-size:.9rem}.service-card h3{margin-bottom:6px}.service-art{width:82px;height:82px;flex-shrink:0}.service-card .portrait{width:82px}.lawyer-card{display:flex;gap:16px;align-items:flex-start}.lawyer-card .portrait{width:80px}.lawyer-card p{font-size:.9rem}.lawyer-card>div{min-width:0}.recovery .portrait{width:65px}.fraud-art{width:48px;height:48px;float:left;margin:0 12px 10px 0}.fraud-card .card-bottom{clear:both}.obligation-art{width:110px;height:110px;margin:0 auto 20px}@media(max-width:700px){.service-grid{grid-template-columns:1fr}.recovery .portrait{float:left;margin-right:15px}.service-card{gap:14px}} /* All atlas cells use measured source rectangles and a shared padded square. */ .sprite{display:block;aspect-ratio:1!important;overflow:hidden;image-rendering:auto;background:none!important;border-radius:0}.sprite image{image-rendering:auto}.sprite.portrait{height:auto;width:105px}.sprite.pixel-icon{display:inline-block;width:22px;height:22px;vertical-align:middle;margin-right:7px;overflow:visible}.sprite.atlas{height:auto}.sprite.fraud-art{width:48px;height:48px}.sprite.building,.sprite.club-art{width:min(100%,180px);height:auto;margin:0 auto 18px}.sprite.service-art{width:82px;height:82px}.sprite.obligation-art{width:110px;height:110px}.shop-card{display:flex;flex-direction:column;align-items:flex-start}.shop-card h2{margin-bottom:8px}.shop-card p{margin-bottom:12px}.shop-card>button{margin-top:auto}.shop-art{width:160px!important;max-width:100%;height:160px!important;align-self:center;margin-bottom:15px}.shop-total{font-size:.9rem;color:var(--teal);margin-bottom:20px}.shop-filters{flex-wrap:wrap}.tabs{overflow-x:auto}.tabs button{padding-left:15px;padding-right:15px}.lawyer-card .sprite.portrait{width:80px}.recovery .sprite.portrait{width:65px}.service-card .sprite.portrait{width:82px} .shop-divider{grid-column:1/-1;display:flex;align-items:center;gap:12px;margin:10px 0 0;color:var(--muted);font-size:.95rem}.shop-divider:first-child{margin-top:0}.shop-divider:after{content:'';height:1px;flex:1;background:var(--line)}.shop-card h3{font-size:1.06rem;line-height:1.4;margin-bottom:8px} @media(max-width:700px){.sprite.portrait{width:82px}.sprite.club-art{width:min(100%,120px)}.shop-art{width:140px!important;height:140px!important}.tabs button{padding:12px}.shop-filters{gap:6px}.shop-filters button{font-size:.9rem;padding:9px 11px}} /* Reference layout: left navigation | active area | persistent player panel. */ .game-shell{display:grid;grid-template-columns:190px minmax(0,1fr) 264px;max-width:1800px;min-height:100dvh;margin:0 auto;align-items:start}.navigation-panel,.player-panel{position:sticky;top:0;height:100dvh;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.navigation-panel{display:flex;flex-direction:column;gap:24px;padding:24px 16px;background:#141c24;border-right:1px solid var(--line)}.sidebar-brand{display:block;width:148px;max-width:100%;height:76px;margin:0 auto;object-fit:contain}.side-nav{display:flex;flex-direction:column;gap:8px}.side-nav button{display:flex;align-items:center;gap:10px;width:100%;min-height:49px;padding:12px;text-align:left;background:transparent;border:1px solid transparent;color:var(--muted);font-size:.9rem;white-space:nowrap}.side-nav .pixel-icon{margin:0;width:24px;height:24px}.side-nav button.active{color:var(--gold);background:#30302a;border-color:#665735;box-shadow:inset 3px 0 var(--gold)}.side-nav .point{margin-left:auto;flex-shrink:0}.navigation-footer{margin-top:auto;display:grid;gap:9px;padding-top:25px}.navigation-footer button{text-align:left;font-size:.9rem;padding:10px 12px}.sidebar-save{display:block;font-size:.9rem;color:var(--muted);padding:4px 12px}.game-shell>.game-content{margin:0;padding:30px 26px 55px;min-width:0;width:100%;min-height:100dvh;container-type:inline-size}.game-content .section-head{gap:18px;margin-bottom:25px}.game-content h1{font-size:1.6rem}.game-content .section-head p{font-size:.9rem;line-height:1.5}.game-content .card-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:16px}.game-content .card{padding:19px}.game-content .people-grid{grid-template-columns:1fr;gap:15px}.game-content .service-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,265px),1fr));gap:14px}.game-content .result{flex-direction:column;align-items:flex-start;gap:5px;padding:14px 17px}.game-content .card-bottom{flex-wrap:wrap}.game-content .subtabs{flex-wrap:wrap}.game-content .recovery{flex-wrap:wrap;gap:15px}.game-content .recovery p{font-size:.9rem}.player-panel{display:flex;flex-direction:column;gap:14px;padding:20px 16px;background:#141c24;border-left:1px solid var(--line)}.player-block{margin:0;padding:16px;background:#1b252e;border:1px solid var(--line);border-radius:8px;min-width:0}.avatar-panel{padding:8px 12px 12px;text-align:center}.avatar-panel .sprite.avatar-sprite{display:block;width:100%;height:auto;max-width:240px;margin:auto}.avatar-panel figcaption{font-size:.9rem;font-weight:700;color:var(--text);margin-top:0}.player-cash{display:block;color:var(--teal);font-size:1.65rem;font-variant-numeric:tabular-nums;line-height:1.3;margin-bottom:7px}.player-budget{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:22px;color:var(--muted);font-size:.9rem}.player-budget button{padding:0;min-height:24px;border:0;background:none;font-size:.9rem;color:var(--muted);text-decoration:underline}.resource-meter+.resource-meter{margin-top:17px}.resource-meter>span{display:flex;justify-content:space-between;gap:10px;font-size:.9rem;color:var(--muted);margin-bottom:8px}.resource-meter b{color:var(--text);font-variant-numeric:tabular-nums}.player-attributes h2{font-size:.94rem;margin:0 0 13px}.side-stats{display:flex;flex-direction:column;gap:12px;margin:0 0 22px;font-size:.9rem}.side-stats>div{display:flex;justify-content:space-between;gap:15px}.side-stats dd{color:var(--gold);font-weight:700;font-variant-numeric:tabular-nums}.player-level-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:9px;font-size:.9rem}.player-level-row small{font-size:.9rem}.distribute-points{margin-top:12px;padding:8px 10px;font-size:.9rem;width:100%;min-height:32px}.game-content .lawyer-card{gap:13px}.game-content .lawyer-card .portrait{width:72px}.game-content .lawyer-card h2{overflow-wrap:anywhere}.game-content .lawyer-card button{font-size:.9rem;padding:9px 11px} @media(min-width:1450px){.game-shell{grid-template-columns:210px minmax(0,1fr) 288px}.navigation-panel{padding:28px 20px}.player-panel{padding:24px 20px}.game-shell>.game-content{padding:35px}.avatar-panel .sprite.avatar-sprite{max-width:250px}} @media(min-width:901px) and (max-height:760px){.player-panel{gap:10px;padding-top:14px;padding-bottom:14px}.player-block{padding:13px}.avatar-panel{padding:4px 12px 7px}.avatar-panel .sprite.avatar-sprite{max-width:190px}.player-budget{margin-bottom:14px}.side-stats{gap:9px;margin-bottom:15px}.resource-meter+.resource-meter{margin-top:13px}} @media(min-width:701px) and (max-width:1050px){.game-shell{grid-template-columns:164px minmax(0,1fr) 228px}.navigation-panel{padding:20px 10px;gap:20px}.sidebar-brand{width:135px}.side-nav button{font-size:.9rem;padding:10px 8px;gap:8px}.side-nav .pixel-icon{width:21px;height:21px}.player-panel{padding:16px 12px;gap:12px}.player-block{padding:13px}.game-shell>.game-content{padding:25px 20px 45px}.player-cash{font-size:1.4rem}.game-content .card{padding:17px}.game-content .section-head{flex-wrap:wrap}.game-content .section-head>button{font-size:.9rem;padding:9px 10px}.game-content .card-grid{grid-template-columns:1fr}.game-content .lawyer-card .portrait{width:80px}} @media(max-width:700px){.game-shell{grid-template-columns:60px minmax(0,1fr);grid-template-rows:auto 1fr}.navigation-panel{grid-column:1;grid-row:1 / 3;padding:12px 5px;gap:16px;height:100dvh;z-index:2}.sidebar-brand{width:48px;height:38px}.side-nav{gap:6px}.side-nav button{padding:10px 5px;min-height:46px;justify-content:center;position:relative}.side-nav button>span:not(.pixel-icon){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.side-nav .point{clip-path:none!important;width:14px!important;height:14px!important;top:0;right:0;font-size:.9rem}.side-nav .pixel-icon{width:25px;height:25px}.navigation-footer{padding-top:10px;gap:8px}.navigation-footer button{padding:9px 3px;min-height:40px;font-size:0;text-align:center}.navigation-footer .pixel-icon{margin:0;width:22px;height:22px}.sidebar-save{display:none}.player-panel{position:static;grid-column:2;grid-row:1;display:grid;grid-template-columns:minmax(0,1fr) 82px;gap:8px;height:auto;overflow:visible;border-left:0;border-bottom:1px solid var(--line);padding:12px;background:#141c24}.avatar-panel{grid-column:2;grid-row:1;align-self:center;padding:0;border:0;background:transparent}.avatar-panel .sprite.avatar-sprite{width:82px;height:82px}.avatar-panel figcaption{display:none}.player-resources{grid-column:1;grid-row:1;display:block;padding:0;border:0;background:transparent}.player-cash{font-size:1.35rem;line-height:1.2;margin-bottom:5px}.player-budget{margin-bottom:10px;font-size:.9rem;justify-content:flex-start;gap:10px}.player-budget button{font-size:.9rem;min-height:18px}.resource-meter>span{font-size:.9rem;margin-bottom:5px}.resource-meter+.resource-meter{margin-top:8px}.resource-meter progress{height:5px}.player-attributes{grid-column:1 / 3;display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:9px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent}.player-attributes h2{display:none}.side-stats{flex-direction:row;justify-content:space-between;flex:1;gap:12px;width:100%;margin:0;font-size:.9rem}.side-stats>div{gap:6px}.player-level-row{margin:4px 0 0;width:100%;font-size:.9rem}.player-attributes>progress{height:4px}.distribute-points{width:auto;font-size:.9rem;padding:5px 7px;min-height:25px;margin:0 0 0 auto}.game-shell>.game-content{grid-column:2;grid-row:2;min-height:calc(100dvh - 180px);padding:22px 12px 40px}.game-content .section-head{display:block;margin-bottom:20px}.game-content .section-head>button{max-width:none;margin-top:12px}.game-content h1{font-size:1.5rem}.game-content .section-head p{font-size:.9rem}.game-content .card-grid{grid-template-columns:1fr;gap:13px}.game-content .card{padding:15px}.game-content .person-card{gap:9px;padding:13px}.game-content .person-card .portrait{width:64px}.game-content .person-content button{font-size:.9rem;padding:8px 9px}.game-content .person-content h2{font-size:.92rem}.game-content .person-content p{font-size:.9rem}.game-content .lawyer-card .portrait{width:64px}.game-content .lawyer-card{gap:10px}.game-content .lawyer-card p{font-size:.9rem}.game-content .service-card{padding:12px;gap:10px}.game-content .service-card .portrait,.game-content .service-art{width:64px;height:64px}.game-content .subtabs{gap:6px}.game-content .subtabs button{padding:9px 10px;min-height:35px;font-size:.9rem}.game-content .recovery .portrait{float:none}.game-content .card-bottom>span{font-size:.9rem}.game-content .card-bottom button{font-size:.9rem;padding:9px 11px}.game-content .shop-art{width:140px!important;height:140px!important}.game-content .locked-list p{font-size:.9rem}.game-content .locked-list span{font-size:.9rem}.game-content .section-note{font-size:.9rem}} /* Fraud reference: selected operation at left, complete catalogue at right. */ .fraud-view .section-head{margin-bottom:20px}.fraud-workspace{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(190px,.9fr);gap:18px;align-items:start;height:calc(100dvh - 130px);min-height:470px}.game-content .fraud-detail{max-height:100%;height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:18px}.fraud-overview{display:grid;grid-template-columns:minmax(92px,140px) minmax(0,1fr);gap:12px;align-items:center;margin-bottom:20px}.sprite.fraud-scene{width:100%;height:auto;max-width:160px}.fraud-heading{min-width:0}.fraud-heading h2{font-size:1.12rem;margin:0 0 18px;line-height:1.35;overflow-wrap:anywhere}.fraud-chance{display:flex;flex-direction:column;gap:0}.fraud-chance>span{color:var(--muted);font-size:.9rem}.fraud-chance .chance{font-size:1.65rem;line-height:1.15}.fraud-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 18px;margin:0 0 20px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.9rem}.fraud-metrics>div{min-width:0}.fraud-metrics dt{font-size:.9rem;margin-bottom:4px}.fraud-metrics dd{font-weight:700;color:var(--text)}.fraud-heading>.fraud-description{margin:0;color:#c9d2d8;font-size:.9rem;line-height:1.45}.metric-return dd{font-size:1.12rem;color:var(--gold)}.fraud-apply{width:100%;margin-bottom:4px}.fraud-lock{color:var(--gold);font-size:.9rem!important;margin:0 0 14px}.fraud-result{display:flex;flex-wrap:wrap;gap:5px 12px;margin:16px 0 0;padding:11px 12px;border-radius:5px;font-size:.9rem;background:#20382f;color:var(--teal)}.fraud-result.failure{background:#3a2828;color:var(--red)}.fraud-participants-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:24px 0 12px}.fraud-participants-head h3{font-size:.9rem;margin:0}.fraud-participants-head small{font-size:.9rem}.fraud-participants{display:grid;gap:10px}.fraud-participant{display:flex;align-items:center;gap:12px;background:#151e26;border:1px solid #2d3b46;border-radius:6px;padding:9px;min-width:0}.fraud-participant .sprite.portrait{width:54px;height:54px}.fraud-participant>div{min-width:0}.fraud-participant h3{font-size:.9rem;margin:0 0 4px;line-height:1.3}.fraud-participant p{font-size:.9rem;margin:0;line-height:1.45}.positive{color:var(--teal)!important}.negative{color:var(--red)!important}.fraud-catalogue{display:flex;flex-direction:column;height:100%;max-height:100%;min-width:0;border:1px solid var(--line);border-radius:8px;background:#141d25;overflow:hidden}.fraud-catalogue>h2{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0;padding:17px 14px;border-bottom:1px solid var(--line);font-size:.9rem}.fraud-catalogue h2 small{font-size:.9rem}.fraud-list{display:flex;flex-direction:column;gap:7px;overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain;padding:9px;flex:1;min-height:0}.fraud-list-button{display:flex;align-items:center;gap:10px;flex-shrink:0;width:100%;text-align:left;background:#1b2630;border:1px solid transparent;padding:9px 8px;border-radius:5px;min-height:67px}.fraud-list-button.selected{background:#332f24;border-color:#917339;box-shadow:inset 3px 0 var(--gold)}.fraud-list-button.is-locked{background:#171f27;color:#98a3ad}.fraud-list-button.is-locked .fraud-thumbnail{opacity:.5}.fraud-list-button.is-locked.selected{border-color:#9b824e;background:#2b2922}.sprite.fraud-thumbnail{width:42px;height:42px;flex-shrink:0}.fraud-option-copy{min-width:0}.fraud-option-copy>strong{display:block;font-size:.9rem;line-height:1.3;font-weight:650}.fraud-option-copy>small{display:block;font-size:.9rem;line-height:1.4;margin-top:5px;color:var(--muted)}.fraud-list-button.selected .fraud-option-copy>strong{color:var(--gold)} @container(max-width:540px){.fraud-workspace{grid-template-columns:1fr;height:auto;min-height:0}.game-content .fraud-detail{max-height:none;height:auto}.fraud-catalogue{height:320px;max-height:320px}.fraud-overview{grid-template-columns:130px minmax(0,1fr)}} @media(max-width:700px){.fraud-workspace{display:flex;flex-direction:column;height:auto;min-height:0;gap:16px}.fraud-catalogue{order:0;width:100%;height:235px;max-height:235px}.game-content .fraud-detail{order:1;width:100%;height:auto;max-height:none;padding:15px}.fraud-overview{grid-template-columns:110px minmax(0,1fr);gap:10px}.fraud-heading h2{font-size:1rem;margin-bottom:12px}.fraud-chance .chance{font-size:1.35rem}.fraud-list-button{min-height:62px}.fraud-metrics{font-size:.9rem}.fraud-participant .sprite.portrait{width:48px;height:48px}.fraud-participants-head{flex-wrap:wrap;gap:4px}} .game-shell>.game-content.fraud-view{padding-bottom:20px} @media(min-width:701px) and (max-height:760px){.fraud-overview{grid-template-columns:110px minmax(0,1fr);margin-bottom:14px}.fraud-metrics{padding:12px 0;gap:10px 16px;margin-bottom:14px}.fraud-participants-head{margin-top:18px;margin-bottom:10px}.fraud-participant .sprite.portrait{width:48px;height:48px}.fraud-participants{gap:8px}.fraud-participant{padding:8px}.fraud-heading h2{margin-bottom:12px}} /* Compact, readable controls and account detail. */ :root{font-size:16px;font-weight:500}body{font-weight:500}button,input,select,summary{font-weight:600}p,small,dt,label,time,span,li{font-weight:500}h1,h2,h3,strong,b{font-weight:700}p{line-height:1.45;margin-bottom:9px}small{line-height:1.4}h2{margin-bottom:8px}button{padding:9px 12px;min-height:40px}button:disabled{opacity:.6}button .pixel-icon{margin-right:5px} .game-shell{grid-template-columns:184px minmax(0,1fr) 264px}.navigation-panel{padding:18px 12px;gap:16px}.side-nav{gap:4px}.side-nav button{min-height:46px;padding:10px;gap:8px}.navigation-footer{padding-top:14px;gap:5px}.sidebar-brand{height:68px}.sidebar-save{padding:4px 8px}.game-shell>.game-content{padding:20px 18px 32px}.game-content .section-head{margin-bottom:14px;gap:10px}.game-content h1{font-size:1.55rem;margin-bottom:4px}.game-content .card{padding:14px}.game-content .card-grid,.game-content .people-grid{gap:10px}.game-content .people-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr))}.game-content .card-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,245px),1fr))}.subtabs{gap:6px;margin-bottom:12px}.card-bottom{margin-top:12px;gap:8px}.reward{margin:9px 0}.person-card{gap:12px;align-items:center}.person-content p{margin:7px 0}.person-card .sprite.portrait{width:80px;height:80px}.person-content button{font-size:.9rem}.person-content h2{font-size:1rem}.sprite.building,.sprite.club-art{width:min(100%,145px);margin:0 auto 8px}.shop-art{width:130px!important;height:130px!important;margin-bottom:8px}.shop-card p{margin-bottom:8px}.shop-total{margin-bottom:12px}.service-heading{margin-top:14px;margin-bottom:10px}.services{margin-bottom:12px}.service-card{padding:10px;gap:10px}.game-content .service-grid{gap:10px}.service-card .sprite.portrait,.service-art{width:70px;height:70px}.section-note{margin-top:14px}.attributes{margin-top:14px;margin-bottom:12px}.bonus-section{margin-bottom:12px}.feed{margin-top:8px;margin-bottom:0}.feed li{padding:3px 0}.pause-banner{padding:8px;margin-bottom:12px}.game-content .recovery{margin:0 0 14px;gap:10px;padding:12px}.recovery>div{flex:1;min-width:min(100%,220px)}.recovery h2{margin-bottom:4px} .player-panel{padding:14px 12px;gap:10px}.player-block{padding:12px}.avatar-panel{padding:3px 10px 6px}.avatar-panel .sprite.avatar-sprite{max-width:184px}.avatar-panel figcaption{font-size:.95rem}.player-cash{font-size:1.65rem;margin-bottom:5px}.player-budget{margin-bottom:5px;flex-wrap:wrap;font-size:.9rem}.player-budget button{font-size:.9rem;min-height:28px}.player-spending{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px;font-size:.9rem!important;margin:3px 0 12px}.player-spending strong{color:var(--text)}.resource-meter>span{font-size:.9rem;margin-bottom:6px}.resource-meter+.resource-meter{margin-top:11px}.side-stats{gap:8px;margin-bottom:12px;font-size:.95rem}.player-attributes h2{margin-bottom:9px}.player-level-row{margin-bottom:7px;font-size:.9rem}.player-level-row small{font-size:.9rem}.distribute-points{font-size:.9rem;margin-top:9px}.negative,.player-cash.negative{color:var(--red)!important} .fraud-view .section-head{margin-bottom:12px}.fraud-workspace{gap:12px;height:calc(100dvh - 105px);min-height:470px;grid-template-columns:minmax(0,1.2fr) minmax(200px,.9fr)}.game-content .fraud-detail{padding:14px}.fraud-overview{grid-template-columns:minmax(84px,125px) minmax(0,1fr);gap:10px;margin-bottom:12px}.fraud-heading h2{font-size:1.2rem;margin-bottom:10px}.fraud-chance>span{font-size:.9rem}.fraud-metrics{gap:10px 14px;padding:12px 0;margin-bottom:12px;font-size:.95rem}.fraud-metrics dt{font-size:.9rem;margin-bottom:2px}.fraud-metrics dd{font-size:1rem}.fraud-metrics .metric-return dd{font-size:1.15rem}.fraud-participants-head{margin:16px 0 8px;flex-wrap:wrap;gap:4px}.fraud-participants-head h3{font-size:1rem}.fraud-participants-head small{font-size:.9rem}.fraud-participant{padding:8px;gap:9px}.fraud-participant .sprite.portrait{width:52px;height:52px}.fraud-participant h3{font-size:.95rem;margin-bottom:3px}.fraud-participant p{font-size:.9rem}.fraud-participants{gap:7px}.fraud-list{gap:5px;padding:7px}.fraud-catalogue>h2{padding:12px;font-size:1rem}.fraud-list-button{min-height:70px;padding:7px;gap:8px}.fraud-option-copy>strong{font-size:.95rem}.fraud-option-copy>small{font-size:.9rem;margin-top:3px}.sprite.fraud-thumbnail{width:46px;height:46px}.fraud-apply{font-size:.95rem;min-height:44px} .manager-picker{position:relative;margin:8px 0;font-size:.9rem}.manager-picker>summary{list-style:none;display:flex;align-items:center;gap:8px;padding:7px 9px;background:#121b23;border:1px solid #61717c;border-radius:6px;color:var(--text);min-height:48px;margin:0}.manager-picker>summary::-webkit-details-marker{display:none}.manager-picker .sprite.portrait{width:34px;height:34px}.manager-picker>summary>span:not(.picker-arrow){flex:1;min-width:0;overflow-wrap:anywhere}.picker-arrow{margin-left:auto}.manager-options{margin-top:5px;padding:5px;max-height:290px;overflow-y:auto;background:#111a22;border:1px solid #61717c;border-radius:6px;display:grid;gap:4px;scrollbar-width:thin}.manager-option{display:flex;align-items:center;gap:8px;text-align:left;width:100%;font-size:.9rem;padding:6px 8px;background:#26333e}.manager-option>span{min-width:0}.manager-option small{display:block;font-size:.9rem;color:var(--muted);margin-top:2px}.manager-options>p{padding:7px;margin:0}.manager-options .portrait{width:40px!important;height:40px!important}.manager-option:disabled{opacity:.65}.manager-picker[open]>summary{border-color:var(--gold)} .locked-person{background:#171e25;border-color:#303b44;min-height:112px}.silhouette{filter:brightness(0)}.unlock-requirement{display:flex;align-items:center;gap:5px;color:#c1c8ce!important}.unlock-requirement .pixel-icon{width:18px;height:18px}.managed-business{display:flex;align-items:center;gap:8px;margin:6px 0 8px;padding:5px 8px;background:#141c23;border-radius:5px}.managed-business .sprite.managed-art{width:44px;height:44px;flex-shrink:0}.managed-business strong,.managed-business small{display:block;font-size:.9rem}.managed-business small{margin-bottom:2px} .bonus-sources{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:8px}.bonus-source{display:flex;align-items:center;gap:10px;padding:8px;background:#131c24;border-radius:6px;min-width:0}.bonus-source h3{font-size:1rem;margin:0 0 3px}.bonus-source p{margin:5px 0 0}.sprite.bonus-art{width:58px;height:58px;flex-shrink:0}.bonus-source>div{min-width:0} .dialog{padding:20px;width:720px;max-height:92dvh}.dialog-close{margin-bottom:7px}.dialog h2{margin-bottom:12px}.budget-summary{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.budget-summary>div{display:flex;flex-direction:column;gap:4px;padding:10px;background:#111b24;border:1px solid var(--line);border-radius:6px}.budget-summary span{font-size:.9rem;color:var(--muted)}.budget-summary strong{font-size:1.08rem}.budget-groups{display:grid;gap:7px}.budget-group{border:1px solid var(--line);border-radius:6px;overflow:hidden}.budget-group>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;list-style:none;padding:12px;margin:0!important;color:var(--text);font-size:.95rem}.budget-group>summary:before{content:'';width:16px;height:16px;flex:none;background:var(--gold);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 6 6 6-6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}.budget-group[open]>summary:before{transform:rotate(90deg)}.budget-group>summary>span{flex:1}.budget-group summary strong{white-space:nowrap}.budget-items{padding:0 10px 6px}.budget-items>p{padding:8px;margin:0}.budget-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:.95rem}.budget-item>div{flex:1;min-width:0}.budget-item h3{font-size:.95rem;margin:0 0 3px}.budget-item p{margin:3px 0}.budget-item>strong{white-space:nowrap}.sprite.budget-art{width:48px;height:48px;flex-shrink:0}.budget-group>.budget-item{margin:0 12px}.budget-group>button{margin:0 12px 12px;max-width:calc(100% - 24px)}.budget-totals{gap:9px;margin:16px 0 0}.dialog>p{margin-top:14px;font-size:.9rem}.dialog-close button{font-size:.9rem}.dialog label{font-size:1rem}.dialog input[type=range]{min-height:30px}#toasts{font-size:1rem;font-weight:600;padding:12px 18px;max-width:min(640px,92vw);text-align:center}#toasts[data-kind=success]{background:#163b30;border-color:var(--teal)}#toasts[data-kind=failure]{background:#442824;border-color:var(--red)}#toasts:not(.visible){visibility:hidden} @container(max-width:540px){.fraud-workspace{grid-template-columns:1fr;height:auto;min-height:0}.game-content .fraud-detail{height:auto;max-height:none}.fraud-catalogue{height:320px;max-height:320px}} @media(min-width:701px) and (max-width:1050px){.game-shell{grid-template-columns:158px minmax(0,1fr) 232px}.navigation-panel{padding:14px 8px}.side-nav button{padding:9px 6px;gap:6px}.game-shell>.game-content{padding:18px 14px 28px}.player-panel{padding:12px 10px}.player-block{padding:10px}.player-cash{font-size:1.5rem}.game-content .card-grid{grid-template-columns:1fr}} @media(max-width:700px){.game-shell{grid-template-columns:56px minmax(0,1fr)}.navigation-panel{padding:10px 4px;gap:10px}.sidebar-brand{width:46px;height:36px}.side-nav button{min-height:45px;padding:9px 3px}.navigation-footer button{font-size:0}.side-nav .point{font-size:.9rem!important;width:19px!important;height:19px!important}.player-panel{grid-template-columns:minmax(0,1fr) 70px;padding:10px;gap:7px}.avatar-panel{padding:0}.avatar-panel .sprite.avatar-sprite{width:70px;height:70px}.player-resources{padding:0}.player-attributes{padding:7px 0 0}.player-cash{font-size:1.5rem}.player-budget{gap:7px;margin-bottom:3px}.player-spending{margin:3px 0 8px}.player-budget,.player-budget button,.resource-meter>span,.side-stats,.player-level-row,.distribute-points{font-size:.9rem}.side-stats{gap:6px;flex-wrap:wrap}.side-stats>div{gap:5px}.player-level-row{margin:3px 0 0}.game-shell>.game-content{padding:16px 10px 26px}.game-content .card{padding:12px}.game-content .card-grid,.game-content .people-grid{grid-template-columns:1fr;gap:9px}.game-content .section-head{margin-bottom:12px}.game-content .person-card{padding:11px;gap:8px;align-items:flex-start}.game-content .person-card>.portrait{width:56px;height:56px}.game-content .person-content h2{font-size:1rem}.game-content .person-content p,.game-content .person-content button,.game-content .lawyer-card p,.game-content .subtabs button,.game-content .section-note,.game-content .card-bottom>span,.game-content .card-bottom button,.game-content .section-head p{font-size:.9rem}.game-content .subtabs{gap:5px}.game-content .subtabs button{padding:8px;min-height:38px}.game-content .subtabs .pixel-icon{width:16px;height:16px;margin-right:4px}.game-content .lawyer-card{gap:8px}.game-content .lawyer-card .portrait{width:58px;height:58px}.game-content .service-card{padding:9px;gap:7px;align-items:flex-start}.game-content .service-card .portrait,.game-content .service-art{width:54px;height:54px}.fraud-workspace{display:flex;gap:10px;height:auto;min-height:0}.fraud-catalogue{height:250px;max-height:250px;width:100%}.game-content .fraud-detail{height:auto;max-height:none;width:100%}.fraud-overview{grid-template-columns:92px minmax(0,1fr)}.fraud-heading h2{font-size:1.05rem}.fraud-chance .chance{font-size:1.5rem}.fraud-list-button{min-height:69px}.fraud-metrics{gap:9px 12px}.fraud-participant .sprite.portrait{width:46px;height:46px}.game-content .shop-art{width:125px!important;height:125px!important}.dialog{padding:14px}.modal-backdrop{padding:10px}.budget-group>summary{padding:10px;gap:6px;flex-wrap:wrap}.budget-group summary strong{font-size:.9rem}.budget-item{flex-wrap:wrap;gap:7px}.budget-item>strong{margin-left:auto}.budget-item .sprite.budget-art{width:42px;height:42px}.budget-summary{gap:6px}.budget-summary>div{padding:8px}.budget-summary strong{font-size:1rem}.budget-totals{font-size:.9rem}.locked-person{min-height:90px}.bonus-source{padding:7px;gap:7px}.sprite.bonus-art{width:48px;height:48px}#toasts{bottom:14px;font-size:.95rem}} @media(min-width:701px){.game-content .fraud-detail{height:auto}} .game-content .person-card{align-items:flex-start} .manager-picker[open]>summary{margin-bottom:0} [data-scroll]{overflow-anchor:none} /* 0.5.5: viewport shell, floating pickers and consistent visual feedback. */ body.is-playing{height:100dvh;overflow:hidden}body.is-playing #app{height:100dvh;overflow:hidden}.game-shell{height:100dvh;min-height:0;overflow:hidden;align-items:stretch}.game-shell>.game-content{height:100%;min-height:0!important;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}.navigation-panel,.player-panel{height:100%;min-height:0;position:static;overscroll-behavior:contain}.player-panel{overflow-y:auto}.game-content .people-grid{grid-template-columns:minmax(0,1fr);gap:8px}.game-content .person-card{padding:12px;gap:12px;align-items:flex-start}.game-content .person-card>.portrait{width:64px;height:64px}.person-content{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 14px;align-items:start}.person-content .card-title{display:flex;align-items:baseline;justify-content:flex-start;gap:10px;grid-column:1}.person-content h2{font-size:1rem;margin:0}.person-content .card-title>span{font-size:.9rem}.person-content p{margin:0;grid-column:1}.person-content .actions,.person-content>button{grid-column:2;grid-row:1 / span 4;align-self:center;justify-self:end}.person-content .actions{max-width:260px;justify-content:flex-end}.person-content .managed-business{grid-column:1;margin:1px 0 0;max-width:360px;padding:4px 7px}.managed-business .sprite.managed-art{width:36px;height:36px}.locked-person{min-height:80px}.unlock-requirement{margin-top:6px!important}.game-content .person-card.locked-person>.portrait{width:56px;height:56px} @media(min-width:951px){.game-shell>.game-content.fraud-view{display:flex;flex-direction:column;overflow:hidden;padding-bottom:20px}.fraud-view>.section-head,.fraud-view>.pause-banner{flex:none}.fraud-workspace{flex:1;height:auto;min-height:0;align-items:start;overflow:hidden}.game-content .fraud-detail{max-height:100%;height:auto;min-height:0;overflow-y:auto}.fraud-catalogue{height:100%;min-height:0}.fraud-view>} @media(min-width:701px) and (max-width:950px){.fraud-workspace{height:auto;min-height:0}.game-content .fraud-detail{height:auto;max-height:none}.fraud-catalogue{height:320px;max-height:320px}} .manager-options{position:fixed;inset:auto;z-index:90;margin:0;padding:5px;width:300px;max-width:calc(100vw - 24px);max-height:300px;overflow-y:auto;box-shadow:0 12px 35px #0009;border:1px solid #71828d;border-radius:8px;background:#17232e;color:var(--text);gap:4px}.manager-options:not(:popover-open){display:none}.manager-options:popover-open{display:grid}.manager-option{display:grid;grid-template-columns:40px minmax(0,1fr);min-height:58px;gap:9px;padding:7px;text-align:left}.manager-option>span:last-child{display:block}.manager-placeholder{width:40px;height:40px;display:grid;place-items:center}.manager-placeholder .sprite.pixel-icon{width:25px;height:25px;margin:0}.manager-option .portrait{margin:0}.manager-option small{font-size:.9rem;line-height:1.3} .stat-label{display:inline-flex;align-items:center;gap:5px;vertical-align:middle;white-space:nowrap;line-height:1.4}.stat-label .sprite.pixel-icon{width:21px;height:21px;margin:0;flex-shrink:0}.stat-label strong{margin-left:2px}.stat-labia{color:#ffcf72}.stat-analise{color:#7cddce}.stat-influencia{color:#d9b0f4}.stats-inline,.shop-total{display:flex;flex-wrap:wrap;gap:5px 13px;align-items:center;line-height:1.45}.stats-inline{color:var(--text)!important}.side-stats dt .stat-label .pixel-icon{width:20px;height:20px}.side-stats>div{align-items:center}.side-stats dd{color:var(--text)}.attributes h2 .stat-label{font-size:1rem}.bonus-source p{margin-top:5px}.stat-number{line-height:1.35}.bonus-source>div{flex:1} .player-balance{display:flex;align-items:center;gap:8px;margin:3px 0 7px}.player-balance>.pixel-icon{width:27px;height:27px;margin:0}.player-balance>.player-cash{margin:0}.player-budget{margin-bottom:8px;align-items:center}.resource-caption{display:flex;gap:5px;align-items:center;flex:1;min-width:0}.resource-caption>.pixel-icon{width:18px;height:18px;margin:0}.resource-caption [data-live=budget]{font-size:.9rem}.player-spending{padding-top:7px;border-top:1px solid var(--line);margin:0 0 12px;align-items:center}.player-spending>span,.resource-meter>span>span{display:inline-flex;align-items:center;gap:5px}.player-spending .pixel-icon,.resource-meter .pixel-icon{width:20px;height:20px;margin:0}.player-spending strong{color:#f2b880}.resource-meter [data-live=energy]{color:#7cddce}.resource-meter [data-live=wanted]{color:#f49f9a}.resource-meter .pixel-icon{vertical-align:middle}.resource-meter>span{align-items:center}.upkeep-value{color:#f2b880!important;display:flex;align-items:center;gap:4px}.upkeep-value .pixel-icon{width:18px;height:18px;margin:0}.energy-value{color:#7cddce}.risk-value{color:#f49f9a}.money-value{color:#ffcf72}.service-facts{display:flex;flex-direction:column;gap:5px;margin:6px 0 8px}.service-facts>span{display:flex;align-items:center;gap:5px;font-size:.9rem}.service-facts .pixel-icon{width:19px;height:19px;margin:0}.service-card .stats-inline{margin:6px 0;font-size:.9rem}.service-card small{display:block;margin-bottom:7px}.fraud-metrics dt{display:flex;align-items:center;gap:4px}.fraud-metrics dt .pixel-icon{width:18px;height:18px;margin:0}.fraud-metrics dd{padding-top:2px}.reward{display:flex;align-items:center;gap:5px}.reward .pixel-icon{margin:0} .game-content .card-grid:has(.lawyer-card){grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}.game-content .lawyer-card{gap:12px}.game-content .lawyer-card>.portrait{width:64px;height:64px}.lawyer-card>div{flex:1}.fact-list{display:grid;grid-template-columns:1fr;gap:8px;margin:10px 0 12px;font-size:.9rem}.fact-list>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px;align-items:center}.fact-list dt{display:flex;align-items:center;gap:5px;font-size:.9rem}.fact-list .pixel-icon{width:18px;height:18px;margin:0}.fact-list dd{font-size:.95rem;text-align:right}.fact-cost dd{color:#ffcf72}.fact-upkeep dd{color:#f2b880}.fact-protection dd{color:#7cddce}.fact-list dt{color:#bec8d0} .history-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}.history-heading h2{margin:0}.history-summary{display:flex;flex-wrap:wrap;gap:8px 16px;padding-bottom:12px;border-bottom:1px solid var(--line);font-size:.9rem}.history-summary>span{display:flex;gap:5px;align-items:center}.history-summary .pixel-icon{width:19px;height:19px;margin:0}.activity-list{list-style:none;padding:0;margin:0}.activity-row{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);align-items:flex-start}.activity-row:last-child{border-bottom:0;padding-bottom:0}.sprite.event-art{width:42px;height:42px;flex-shrink:0}.activity-row>.pixel-icon{width:34px;height:34px;margin:4px;flex-shrink:0}.activity-copy{flex:1;min-width:0}.activity-heading{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.activity-heading>strong{font-size:.95rem}.activity-heading time{font-size:.9rem;color:var(--muted);font-variant-numeric:tabular-nums;flex-shrink:0}.activity-copy>p{margin:4px 0 0;font-size:.9rem}.activity-footer{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:7px}.activity-footer>small{margin-right:auto;font-size:.9rem}.activity-success .activity-heading>strong{color:#99e1c7}.activity-failure .activity-heading>strong,.activity-warning .activity-heading>strong{color:#ffb0a1}.change-chip{display:inline-flex;gap:4px;align-items:center;border-radius:5px;padding:3px 6px;background:#111b24;white-space:nowrap;font-size:.9rem}.change-chip .pixel-icon{width:16px;height:16px;margin:0}.change-cash.is-gain{color:#99e1c7}.change-cash.is-cost,.change-debt.is-gain{color:#f2b880}.change-energy{color:#7cddce}.change-xp{color:#ffcf72} #toasts{left:auto;bottom:20px;right:max(280px,calc((100vw - 1800px)/2 + 280px));transform:none;width:min(410px,calc(100vw - 480px));max-width:none;padding:0;background:none;border:0;box-shadow:none;text-align:left;pointer-events:none;border-radius:10px;opacity:0;transition:opacity .16s,translate .16s;translate:0 8px}#toasts.visible{opacity:1;translate:0 0}#toasts[data-kind=success],#toasts[data-kind=failure]{background:none;border:0}.toast-card{position:relative;display:flex;align-items:flex-start;gap:11px;padding:14px 12px 16px;border:1px solid #53646e;border-left:3px solid #89b6c9;background:#1b2833;box-shadow:0 12px 36px #0009;border-radius:9px;overflow:hidden;pointer-events:auto}.toast-success{border-left-color:#7cddba}.toast-failure{border-left-color:#ff9c91}.toast-warning{border-left-color:#ffc966}.toast-art{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:7px;background:#111b24}.toast-art>.event-art{width:38px;height:38px}.toast-art>.pixel-icon{width:28px;height:28px;margin:0}.toast-copy{min-width:0;flex:1;padding-right:4px}.toast-copy>strong{display:block;font-size:1rem;line-height:1.35;color:#f3f0e7}.toast-copy>p{margin:4px 0 0;font-size:.9rem;color:#b9c8d2}.toast-changes{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}.toast-changes:empty{display:none}.toast-dismiss{display:grid;place-items:center;min-height:26px;width:26px;padding:4px;border:0;background:none;border-radius:5px;flex-shrink:0}.toast-dismiss .pixel-icon{width:16px;height:16px;margin:0}.toast-timer{position:absolute;bottom:0;left:0;height:2px;width:100%;background:#89b6c9;transform-origin:left;animation:toast-countdown 4s linear forwards}.toast-success .toast-timer{background:#7cddba}.toast-failure .toast-timer{background:#ff9c91}.toast-warning .toast-timer{background:#ffc966}@keyframes toast-countdown{to{transform:scaleX(0)}} @media(max-width:1050px) and (min-width:701px){#toasts{right:245px;width:min(380px,calc(100vw - 425px))}} @media(max-width:700px){.game-shell{grid-template-rows:auto minmax(0,1fr)}.navigation-panel{height:100dvh}.player-panel{height:auto;overflow:visible}.game-shell>.game-content{height:100%;min-height:0!important}.game-content .fraud-workspace{height:auto;min-height:0;overflow:visible}.game-content .fraud-detail{max-height:none}.game-content .person-card{gap:8px;padding:11px}.game-content .person-card>.portrait,.game-content .person-card.locked-person>.portrait{width:48px;height:48px}.person-content{grid-template-columns:minmax(0,1fr);gap:5px}.person-content .actions,.person-content>button{grid-column:1;grid-row:auto;justify-self:start;justify-content:flex-start;max-width:100%;margin-top:3px}.person-content .card-title{flex-wrap:wrap;gap:2px 8px}.person-content .managed-business{width:100%;max-width:100%}.stats-inline,.shop-total{gap:5px 9px}.stat-label .sprite.pixel-icon{width:18px;height:18px}.player-attributes .side-stats{gap:6px 10px}.side-stats dt .stat-label .pixel-icon{width:17px;height:17px}.side-stats .stat-label{gap:3px}.resource-caption>.pixel-icon{width:16px;height:16px}.player-balance{margin:2px 0 5px;gap:6px}.player-balance>.pixel-icon{width:23px;height:23px}.player-spending{padding-top:5px;margin-bottom:8px}.player-budget{gap:5px;margin-bottom:5px}.player-budget button{min-height:24px}.player-attributes .side-stats>div{gap:4px}.resource-meter+.resource-meter{margin-top:8px}.game-content .lawyer-card>.portrait{width:52px;height:52px}.fact-list>div{grid-template-columns:1fr;gap:2px}.fact-list dd{text-align:left;padding-left:23px}.activity-heading{flex-wrap:wrap;gap:4px}.activity-heading time{font-size:.9rem}.activity-row{gap:7px}.activity-row>.event-art{width:34px;height:34px}.activity-footer>small{width:100%;margin-right:0}.history-heading{flex-wrap:wrap;gap:4px}.history-summary{gap:6px}#toasts{right:10px;bottom:12px;width:calc(100vw - 76px)}.toast-card{padding:11px 9px 13px;gap:8px}.toast-art{width:34px;height:34px}.toast-art>.event-art{width:30px;height:30px}.toast-art>.pixel-icon{width:24px;height:24px}.toast-copy>strong{font-size:.95rem}.toast-dismiss{width:24px;min-height:24px}.toast-changes{gap:4px}.toast-changes .change-chip{padding:3px 4px}.toast-copy>p{font-size:.9rem}} .club-facts{display:grid;gap:6px;margin:9px 0;font-size:.9rem}.club-facts>span{display:flex;align-items:center;gap:5px}.club-facts .pixel-icon{width:19px;height:19px;margin:0}.shop-role{display:flex;flex-wrap:wrap;gap:5px 12px;align-items:center}.shop-role .upkeep-value{display:inline-flex;align-items:center;gap:5px}.shop-role .pixel-icon{width:18px;height:18px;margin:0}.budget-summary>div>span{display:flex;align-items:center;gap:5px}.budget-summary .pixel-icon{width:18px;height:18px;margin:0}.fraud-metrics .metric-energy dd{color:#7cddce}.fraud-metrics .metric-cost dd{color:#f2b880}.fraud-metrics .metric-return dd{color:#99e1c7} @media(min-width:701px){.activity-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px}.activity-heading{grid-column:1 / 3}.activity-copy>p{grid-column:1;margin:0}.activity-footer{grid-column:2;grid-row:2;margin:0;justify-content:flex-end}.activity-row{padding:10px 0}.activity-footer:empty{display:none}} /* 0.5.6: notices stay at the upper content corner; all businesses remain visible. */ #toasts{top:12px;bottom:auto;overflow:auto;transform:translateY(-8px)}#toasts.visible{transform:translateY(0)} .fraud-repeat{display:flex;gap:6px;margin:2px 0 8px}.fraud-repeat button{flex:1;min-height:34px;padding:6px 8px;font-size:14px;font-weight:600}.fraud-repeat button.selected{border-color:var(--gold);background:#3b3323;color:var(--gold)}.fraud-batch-estimate{font-size:14px;color:var(--muted);margin:0 0 8px;line-height:1.4} .fraud-timer{padding:12px;border:1px solid #557c70;border-radius:6px;background:#1b302b;margin:8px 0 12px}.fraud-timer-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.fraud-timer-heading time{font-size:1.35rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--teal)}.fraud-timer p{margin:7px 0!important;overflow-wrap:anywhere}.game-shell .player-resources .fraud-timer-compact{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 10px;width:100%;min-width:0;margin:10px 0 14px;padding:10px;border:1px solid #3f5e53;border-radius:7px;background:#192b27;box-shadow:none;text-align:left}.fraud-timer-compact .fraud-timer-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:500;color:var(--text)}.fraud-timer-compact time{white-space:nowrap;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--teal)}.fraud-timer-compact progress{grid-column:1 / -1;height:3px} .toast-card{pointer-events:none}.toast-dismiss{pointer-events:auto} .fraud-energy-help{margin:13px 0 4px;padding:12px;border:1px solid #37615e;border-radius:8px;background:#142b2c}.fraud-energy-help p{display:flex;align-items:center;gap:7px;margin:0 0 10px;font-size:14px;color:#c6ddd6}.fraud-energy-help p>.pixel-icon{width:21px;height:21px;margin:0;flex-shrink:0}.energy-recovery-link{width:100%;min-height:44px;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px;background:#23473f;border-color:#76b7a3;color:#c5f3df;font-size:14px}.energy-recovery-link>.pixel-icon{width:22px;height:22px;margin:0;flex-shrink:0}.energy-recovery-link:hover:not(:disabled){background:#2d5d50;border-color:#a2d9c4} /* Health, medicines and purchases stay visible beside the content. */ @media(min-width:701px){.player-panel{display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden}.player-resources{overflow-y:auto;scrollbar-width:thin}.player-attributes{min-height:0}.player-attributes .side-stats{margin-bottom:9px}} .player-attributes h2{margin-bottom:5px}.attribute-price{display:flex;justify-content:space-between;gap:6px;margin:0 0 9px;font-size:14px;color:var(--muted)}.attribute-price strong{color:var(--gold)}.side-stats>div{display:grid;grid-template-columns:minmax(0,1fr) auto 32px;gap:5px}.side-stats dd{white-space:nowrap;margin:0}.bought{color:#89d9bf;font-size:.75em}.buy-attribute{min-height:28px;width:32px;padding:3px;font-size:14px;color:var(--gold)}.health-meter [data-live=health],.health-value{color:#9bdfa9}.health-cost{color:#f2b880}progress.health{accent-color:#9bdfa9}progress.health::-webkit-progress-value{background:#9bdfa9}.change-health{color:#9bdfa9}.participant-impact{margin-left:7px;font-weight:700;white-space:nowrap}.pharmacy-status{margin-bottom:14px}.pharmacy-status h2{display:flex;gap:7px;align-items:center}.pharmacy-status h2 strong{margin-left:auto;color:#9bdfa9}.medicine-card{display:flex;gap:12px;align-items:center}.medicine-card .medicine-art{width:80px;height:80px;flex-shrink:0}.medicine-card>div{min-width:0}.medicine-card p{display:flex;align-items:center;gap:6px;margin:7px 0}.medicine-card .pixel-icon{width:20px;height:20px;margin:0}.medicine-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))!important}.attributes .bought{font-size:.6em}.player-panel .avatar-panel .avatar-sprite{width:112px;height:112px}.player-panel .avatar-panel{padding:8px}.player-panel .avatar-panel figcaption{overflow-wrap:anywhere} @media(max-width:700px){.player-panel .avatar-panel{padding:0}.player-panel .avatar-panel .avatar-sprite{width:60px;height:60px}.player-attributes{display:block}.player-attributes .side-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:100%;flex:none;margin-bottom:5px}.player-attributes .side-stats>div{display:grid;grid-template-columns:minmax(0,1fr) 30px;gap:2px}.player-attributes .side-stats dt{grid-column:1 / 3}.player-attributes .side-stats dd{font-size:14px}.player-attributes .buy-attribute{width:30px;min-height:28px}.attribute-price{margin-bottom:5px;width:100%}.player-attributes .stat-label{font-size:14px}.player-level-row{margin-top:6px}.player-attributes .side-stats .bought{font-size:14px}.resource-meter+.resource-meter{margin-top:6px}.clock-speed{margin-bottom:5px}.player-panel{padding:8px;grid-template-columns:minmax(0,1fr) 60px}.side-nav{gap:4px}.side-nav button{min-height:42px}.medicine-card .medicine-art{width:58px;height:58px}} .night-encounters{margin:14px 0 16px;padding:12px;background:#111c25;border:1px solid #3b4e5a;border-radius:8px}.encounters-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}.encounters-heading h3{margin:0}.encounters-heading button{font-size:14px}.encounter-odds{display:flex;flex-wrap:wrap;gap:6px 14px;margin:7px 0}.encounter-odds>span{display:inline-flex;align-items:center;gap:5px;font-size:14px}.encounter-odds .pixel-icon{width:19px;height:19px;margin:0}.meeting-place{display:flex;align-items:center;gap:8px;margin:8px 0}.meeting-place .meeting-art{width:42px;height:42px;flex-shrink:0}.meeting-place strong,.meeting-place small{display:block}.game-content .night-encounters .person-card{margin:0}.night-encounters .empty{padding:8px 0}.night-encounters .section-note{margin:8px 0 12px}.encounter-card .person-content>button{margin-top:7px} .business-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}.game-content .business-card{display:grid;grid-template-columns:84px minmax(0,1fr);align-items:center;gap:12px;padding:14px;min-height:112px}.game-content .business-card>.building{width:84px;height:84px;margin:0}.business-content{min-width:0}.business-content h2{margin:0 0 6px}.business-content>.reward{margin:4px 0 8px}.business-content .manager-picker{max-width:420px}.business-content>.card-bottom{margin:8px 0 0}.business-offer{display:flex;flex-wrap:wrap;gap:6px 18px;margin:7px 0 9px}.business-offer>span{display:inline-flex;align-items:center;gap:5px}.business-offer .pixel-icon{width:19px;height:19px;margin:0}.locked-business{background:#171e25;border-color:#303b44}.services-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px 12px}.services-heading h2{margin:0}.service-description{display:block;margin:4px 0 7px}.service-card>div{min-width:0}.service-facts{flex-wrap:wrap}.service-card .stats-inline{margin:7px 0 3px}.service-card small+button{margin-top:9px} @media(max-width:700px){.game-content .business-card{grid-template-columns:54px minmax(0,1fr);gap:8px;padding:11px}.game-content .business-card>.building{width:54px;height:54px}.business-content .card-bottom{flex-wrap:wrap}.business-offer{gap:5px 10px}.service-description{font-size:14px}} /* Shared controls: actions 44px, compact utilities 32px, catalog/manager rows retain their image layout. */ .police-screen{max-width:850px;margin:0 auto;border-color:#7376a1}.fraud-view>.police-screen{overflow:auto;max-height:100%;min-height:0}.police-scene{display:flex;align-items:center;justify-content:center;gap:15px;padding:6px 0 16px;background:#141e29;border-radius:8px;margin-bottom:18px}.police-scene .police-officer{width:100px;height:100px}.police-scene .police-car{width:140px;height:100px}.police-heat{display:flex;align-items:center;gap:7px;font-size:14px;color:#f3c478}.police-heat .pixel-icon{width:20px;height:20px;margin:0;flex-shrink:0}.police-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}.police-choices>article{display:flex;flex-direction:column;padding:14px;border:1px solid #465465;border-radius:8px;background:#14202b}.police-choices article>button{width:100%;margin-top:auto}.police-choices article p{font-size:14px}.police-choices .money-value{display:flex;gap:5px;align-items:center}.police-choices .money-value>.pixel-icon{width:20px;height:20px;margin:0}.police-warning{font-size:14px;margin:16px 0 0;color:#f6b0a0} @container(max-width:650px){.police-choices{grid-template-columns:minmax(0,1fr)}} @media(max-width:700px){.police-scene{gap:5px}.police-scene .police-officer{width:66px;height:66px}.police-scene .police-car{width:86px;height:66px}.police-choices{grid-template-columns:minmax(0,1fr)}.police-choices>article{padding:12px}.police-screen h1{font-size:1.35rem}} :root{--button-height:44px;--button-compact:32px;--button-radius:7px;--button-font:14px;--button-gap:7px} .game-shell button,.game-shell .game-content button,.dialog button,.title-screen button{display:inline-flex;align-items:center;justify-content:center;gap:var(--button-gap);min-height:var(--button-height);padding:10px 12px;border-radius:var(--button-radius);font-size:var(--button-font);font-weight:650;line-height:20px;vertical-align:middle;max-width:100%} .game-shell button>.pixel-icon,.dialog button>.pixel-icon,.title-screen button>.pixel-icon{width:20px;height:20px;margin:0;flex-shrink:0} .game-shell .side-nav button,.game-shell .navigation-footer button{justify-content:flex-start;min-height:var(--button-height)} .game-shell .game-content .fraud-list-button{display:flex;justify-content:flex-start;min-height:70px;padding:7px;gap:8px;text-align:left} .game-shell .game-content .manager-option{display:grid;grid-template-columns:40px minmax(0,1fr);min-height:58px;padding:7px;gap:9px;justify-content:stretch;line-height:20px} .game-shell .game-content .manager-option .portrait{width:40px;height:40px} .game-shell .manager-picker>summary{min-height:44px;padding:6px 10px;font-size:14px;gap:7px;align-items:center}.game-shell .manager-picker>summary .portrait{width:28px;height:28px} .game-shell .buy-attribute,.game-shell .player-budget button{min-height:var(--button-compact);padding:4px 6px;font-size:var(--button-font);line-height:20px} .game-shell .buy-attribute{width:var(--button-compact);height:var(--button-compact);padding:4px;gap:0} .game-shell .side-stats>div{grid-template-columns:minmax(0,1fr) auto var(--button-compact)} .toast-card .toast-dismiss{display:inline-flex;align-items:center;justify-content:center;width:var(--button-compact);min-height:var(--button-compact);height:var(--button-compact);padding:7px;gap:0;border-radius:var(--button-radius)} .toast-card .toast-dismiss>.pixel-icon{width:18px;height:18px;margin:0} .game-shell .medicine-card>div,.game-shell .service-card>div{flex:1;min-width:0} .game-shell .game-content .medicine-card button,.game-shell .game-content .service-card button,.game-shell .game-content .lawyer-card button,.game-shell .game-content .shop-card button,.game-shell .game-content .attributes button{width:100%} .player-level-row>strong,.business-content .card-bottom>span{display:inline-flex;align-items:center;gap:5px} .player-level-row .level-icon,.business-content .card-bottom .level-icon,.unlock-requirement .level-icon{width:20px;height:20px;margin:0;flex-shrink:0} .night-fraud-return{display:flex;align-items:center;gap:12px;margin:0 0 14px;border-color:#508778;background:#192e2b} .night-fraud-return>.return-fraud-art{width:66px;height:66px;flex-shrink:0} .night-fraud-return>div{flex:1;min-width:0}.night-fraud-return h2{color:#a3e2c9;margin:0 0 3px}.night-fraud-return p{margin:0 0 9px;color:var(--text)} @media(max-width:700px){.game-shell .side-nav button{min-height:44px;width:44px;justify-content:center;padding:10px;margin-inline:auto}.game-shell .navigation-footer button{width:44px;min-height:44px;padding:10px;justify-content:center;font-size:0;gap:0;margin-inline:auto}.game-shell .player-attributes .side-stats>div{grid-template-columns:minmax(0,1fr) var(--button-compact)}.game-shell .player-attributes .buy-attribute{width:var(--button-compact);min-height:var(--button-compact)}.night-fraud-return>.return-fraud-art{width:44px;height:44px;align-self:flex-start}.night-fraud-return{gap:9px}.night-fraud-return button{width:100%}} .account-label{font-size:14px;color:var(--muted,#b9b5ad);overflow-wrap:anywhere} .target-defense{margin:18px 0;padding:14px;border:1px solid var(--line);border-radius:8px;background:#171f27}.target-defense h3{margin:0 0 10px}.target-defenders{display:flex;flex-wrap:wrap;gap:12px}.target-defender{display:flex;align-items:center;gap:8px;min-width:0}.target-defender .portrait{width:48px;height:48px}.target-defender strong{font-size:14px;overflow-wrap:anywhere}.target-defenders>p{margin:0} .nickname-invite{margin-bottom:18px}.nickname-invite>label{color:var(--text);font-weight:650;margin-bottom:8px}.nickname-invite-controls{display:flex;gap:10px;align-items:stretch}.nickname-invite-controls input{flex:1;min-width:0;min-height:44px;padding:10px 12px;border:1px solid #53616d;border-radius:7px;background:#131b22;color:var(--text)}.nickname-invite small{display:block;margin-top:9px}.nickname-invite-controls button{flex-shrink:0} @media(max-width:700px){.nickname-invite-controls{flex-direction:column}.nickname-invite-controls button{width:100%}} .title-actions .oauth-google,.title-actions .oauth-discord{min-height:48px;justify-content:center} .access-back{display:block;color:var(--muted);font-size:.8rem;margin-bottom:22px;text-decoration:none}.access-back:hover,.access-help:hover{color:var(--gold);text-decoration:underline}.access-screen .title-copy{padding-top:0}.access-screen .title-copy>.logo{max-height:110px;margin-bottom:22px}.access-screen .title-actions{margin-top:22px}.access-screen .access-note{font-size:.73rem;margin:19px 0 8px;color:var(--muted)}.access-help{display:inline-block;color:var(--gold);font-size:.77rem;margin-bottom:23px}.access-screen .season-panel{margin-top:0;margin-bottom:22px}.access-screen .title-copy>.legal-link{display:block}@media(max-width:700px){.access-screen.title-screen{padding-top:24px}.access-screen .title-copy>.logo{max-height:95px;width:220px;margin-bottom:17px}.access-screen .title-copy h1{font-size:2rem}.access-screen .title-actions{margin-top:20px}.access-screen .title-player{opacity:.35;z-index:-1}.access-screen .title-copy{isolation:isolate}} .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0} .character-selection{max-width:1000px;min-height:100dvh;margin:auto;padding:32px 40px;display:flex;flex-direction:column;justify-content:center} .character-selection-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:48px}.selection-brand{width:180px;height:90px;object-position:left}.character-selection h1{margin-bottom:24px;font-size:1.8rem} .character-selection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,280px));gap:20px}.character-card{min-width:0;padding:24px;border:1px solid #725e39;border-radius:12px;background:radial-gradient(ellipse at 50% 25%,#302838,#19212a 72%);text-align:center}.character-card .sprite.selection-avatar{display:block;width:160px;height:180px;margin:0 auto 16px}.character-card h2{margin:0 0 8px;font-size:1.3rem;overflow-wrap:anywhere}.character-card p{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:14px;margin-bottom:20px;font-size:14px}.character-card .level-badge{margin:0}.character-card button{width:100%;min-height:44px} .character-create{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-height:280px;border:1px dashed #58636b;border-radius:12px;background:#171f26;color:var(--muted);font-size:16px}.character-create>span{display:grid;place-items:center;width:56px;height:56px;border:1px solid #46545d;border-radius:50%;font-size:32px;font-weight:400;color:var(--gold)}.character-create:hover{color:var(--text)}.selection-saves{align-self:flex-start;margin-top:20px}.selection-version{margin-top:32px;font-size:12px}.connection-notice{display:grid;gap:5px;color:var(--gold);font-size:13px}.connection-notice button{padding:5px;font-size:13px} @media(max-width:600px){.character-selection{padding:20px;justify-content:flex-start}.character-selection-header{margin-bottom:28px;gap:10px}.selection-brand{width:145px;height:72px}.character-selection-header button{font-size:13px;padding:8px}.character-selection h1{font-size:1.45rem}.character-selection-grid{grid-template-columns:minmax(0,1fr)}.character-card{padding:20px}.character-card .sprite.selection-avatar{height:150px;margin-bottom:12px}.character-create{min-height:120px;flex-direction:row;gap:12px}.character-create>span{width:40px;height:40px;font-size:26px}.selection-version{margin-top:24px}} .title-actions .oauth-discord{background:#404aa5;border-color:#7b84ed;color:#fff;box-shadow:0 3px 0 #272f72} .title-actions>p,.title-actions>small{flex-basis:100%;max-width:100%;margin:0} .title-actions [role="alert"]{color:#ffc7a8;max-width:40ch} .level-badge{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font-size:14px;color:var(--gold)}.level-badge .level-icon{width:20px;height:20px;margin:0}.person-card .card-title .level-badge{margin:4px 12px 4px 0}.business-status{display:flex;align-items:center;flex-wrap:wrap;gap:8px 20px}.business-status .reward{margin:0;font-size:1rem!important}.power-breakdown{margin:9px 0!important;color:var(--text)}.power-breakdown strong{color:var(--gold);font-size:1.2rem}.power-breakdown small{display:block}.defense-roster{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0}.defense-roster>span{font-size:13px;background:#16302c;color:#b9e6d6;padding:4px 8px;border:1px solid #385f55;border-radius:5px}.defense-help{padding:10px 8px;font-size:13px!important;margin:0!important}.manager-option.selected{background:#234137;border-color:#6bae92}.manager-options .level-badge{font-size:12px}.manager-options .level-icon{width:15px;height:15px}.closed-business{border-color:#aa5e50;background:#2c2225}.social-rules{margin-bottom:18px}.social-rules p:last-child{margin-bottom:0}.social-offline{color:var(--gold)}.war-button{border-color:#b47065;background:#4a2c2b;color:#ffc3b6}.cooldown{display:block;color:#f4c17a!important}.ally-power{font-weight:700;color:var(--gold)}.relation-pending,.relation-sent{color:var(--gold)}.attack-team{border:1px solid var(--line);border-radius:8px;margin:18px 0;padding:10px;min-width:0}.attack-member{display:flex;align-items:center;gap:10px;margin:0!important;padding:9px 0;border-bottom:1px solid var(--line)}.attack-member:last-child{border-bottom:0}.attack-member input{width:20px;height:20px;accent-color:var(--gold);flex-shrink:0}.attack-member .portrait{width:42px;height:42px}.attack-member>span{min-width:0;overflow-wrap:anywhere}.attack-member small{display:block}.combat-preview{display:flex;gap:10px;flex-wrap:wrap;padding:14px;background:#14272c;border:1px solid #4b706c;border-radius:8px}.combat-preview>span{flex-basis:100%;color:var(--gold)}.player-meeting-note{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.player-card h2{overflow-wrap:anywhere} @media(max-width:700px){.business-content .card-bottom{gap:8px}.business-content .card-bottom>button{width:100%}.defense-roster{gap:4px}.person-content .actions>button{max-width:100%}.attack-team{padding:6px}.attack-member{gap:7px}.attack-member .portrait{width:32px;height:32px}} .stay-countdown{font-variant-numeric:tabular-nums;color:var(--gold)}.room-chat{margin-top:18px;min-width:0}.room-chat-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.room-chat-heading h2{margin:0}.room-chat-heading small{color:var(--teal)}.room-chat-messages{height:280px;overflow-y:auto;overscroll-behavior:contain;margin:14px 0;padding:0 10px;list-style:none;border:1px solid var(--line);border-radius:8px;background:#111c23}.room-message{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}.room-message:last-child{border-bottom:0}.room-message .sprite.portrait{width:36px;height:36px;flex-shrink:0}.room-message>div{flex:1;min-width:0}.room-message-heading{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px}.room-message-heading strong{font-size:.9rem;overflow-wrap:anywhere}.room-message-heading time{color:var(--muted);font-size:.75rem;font-variant-numeric:tabular-nums}.room-message p{white-space:pre-wrap;overflow-wrap:anywhere;margin:5px 0 0}.room-message-self strong{color:var(--teal)}.room-chat form label{display:block;margin-bottom:7px}.room-chat-compose{display:flex;gap:10px}.room-chat-compose input{min-width:0;flex:1;width:100%;min-height:44px;background:#111c23;border:1px solid #53616d;border-radius:7px;color:var(--text);padding:10px 12px;font:inherit}.room-chat-compose button{flex-shrink:0}.room-chat form small{display:block;margin-top:7px;color:var(--muted)}.room-chat>button{margin-top:12px}.room-chat #room-chat-error:empty{display:none} @media(max-width:700px){.room-chat-heading{flex-wrap:wrap}.room-chat-messages{height:240px;padding-inline:8px}.room-chat-compose{flex-direction:column}.room-chat-compose button{width:100%}.room-message{gap:7px}.room-message .sprite.portrait{width:28px;height:28px}} /* Paginated global ranking, using the same identity portraits as Social. */ .highscores-heading{align-items:flex-start}.highscores-heading>button{flex-shrink:0}.highscores-panel{overflow-x:auto}.highscores-table{width:100%;border-collapse:collapse;font-size:.95rem;font-variant-numeric:tabular-nums}.highscores-table caption{text-align:left;color:var(--muted);padding:0 0 14px;font-size:.9rem}.highscores-table th,.highscores-table td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:right}.highscores-table thead th{color:var(--muted);font-size:.85rem;font-weight:600;white-space:nowrap}.highscores-table th:first-child,.highscores-table td:first-child,.highscores-table th:nth-child(2){text-align:left}.highscores-table tbody tr:last-child>*{border-bottom:0}.highscore-player{display:flex;align-items:center;gap:12px;min-width:0}.highscore-player .sprite.portrait{width:44px;height:44px;flex-shrink:0}.highscore-player>span{overflow-wrap:anywhere;min-width:0}.highscore-position{width:78px;color:var(--muted);font-weight:700}.highscore-podium{color:var(--gold);font-size:1.15rem}.highscore-level{color:var(--gold);font-weight:700}.highscore-self{background:#ffc54a0d}.highscore-self>td:first-child{box-shadow:inset 3px 0 var(--gold)}.highscore-you{display:block;color:var(--teal);font-size:.75rem;font-weight:600} @media(max-width:700px){.highscores-heading{flex-wrap:wrap}.highscores-table{font-size:.85rem}.highscores-table th,.highscores-table td{padding:10px 5px}.highscores-table thead th{font-size:.75rem}.highscore-position{width:46px}.highscore-player{gap:7px}.highscore-player .sprite.portrait{width:32px;height:32px}} /* Notifications share the existing game event history. */ /* Account discoveries: a single small marker at each level of navigation. */ .unlock-dot{display:inline-block;vertical-align:middle;width:8px;height:8px;margin-left:8px;flex:0 0 8px;border-radius:50%;background:#ff5252;animation:unlock-pulse 1.2s ease-in-out infinite} .side-nav button{position:relative}.game-shell .side-nav .unlock-dot{position:absolute;right:9px;top:50%;transform:translateY(-50%);width:8px;height:8px;clip-path:none;overflow:visible;margin:0} .game-shell .subtabs .unlock-dot{margin-left:2px} @keyframes unlock-pulse{0%,100%{opacity:1}50%{opacity:.3}} @media(max-width:700px){.game-shell .side-nav .unlock-dot{right:2px;top:3px;transform:none}} .navigation-footer .sidebar-notifications{position:relative;display:flex;align-items:center;gap:6px;width:100%;min-height:44px;padding:10px 8px;color:var(--muted)} .notification-bell{width:22px;height:22px;flex-shrink:0;shape-rendering:crispEdges} .notification-label{min-width:0;flex:1;font-size:13px} .navigation-footer .sidebar-notifications.has-unread{color:#ffcf72;border-color:#79613b;background:#302b22} .notification-badge{display:inline-flex;align-items:center;justify-content:center;min-width:21px;height:21px;padding:0 5px;border:1px solid #ffd799;border-radius:6px;background:#ffc966;color:#211a12;font-size:12px;font-weight:800;line-height:1} .notification-badge[hidden]{display:none} .notifications-dialog{width:min(720px,100%);display:flex;flex-direction:column;overflow:hidden} .notifications-body{display:flex;flex-direction:column;min-height:0} .push-settings{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:8px;flex-shrink:0} .push-settings h3{font-size:16px;margin:0 0 8px}.push-settings p{font-size:13px;line-height:1.45;margin:8px 0}.push-settings .push-reward{color:var(--gold)} .push-settings summary{cursor:pointer;font-size:13px;min-height:32px;align-content:center}.push-settings details p{color:var(--muted)} .push-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.push-actions button{min-height:44px;white-space:normal;font-size:13px} .notifications-dialog .notifications-body{overflow-y:auto;overscroll-behavior:contain}.notifications-dialog .notification-list{flex-shrink:0;overflow:visible} .notification-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-shrink:0} .notification-heading h2{margin:0 0 3px} .notification-heading p{margin:0;font-size:14px;color:var(--gold)} .notification-read-all{font-size:13px;min-height:36px;flex-shrink:0} .notification-list{list-style:none;display:flex;flex-direction:column;gap:8px;padding:0 3px 3px;margin:16px 0 0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;min-height:0} .notification-item{border:1px solid var(--line);border-left:3px solid #526674;border-radius:8px;background:#15212b} .notification-item.is-unread{background:#21303a;border-color:#607780;border-left-color:#89b6c9} .notification-item.activity-success{border-left-color:#7cddba}.notification-item.activity-failure{border-left-color:#ff9c91}.notification-item.activity-warning{border-left-color:#ffc966} .notification-entry{display:flex;align-items:flex-start;gap:12px;width:100%;min-width:0;text-align:left;padding:14px 12px;border:0;background:transparent;border-radius:6px;white-space:normal;color:var(--text)} .notification-entry:hover:not(:disabled){background:#ffffff08}.notification-entry:focus-visible{outline:2px solid var(--gold);outline-offset:-3px} .notification-art{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;border-radius:6px;background:#111b24}.notification-art>.event-art{width:40px;height:40px}.notification-art>.pixel-icon{width:28px;height:28px;margin:0} .notification-copy{display:block;min-width:0;flex:1;overflow-wrap:anywhere}.notification-copy>strong{display:block;font-size:15px;line-height:1.4}.notification-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:3px 10px;margin-bottom:5px;color:var(--muted);font-size:12px;font-weight:400}.notification-meta time{font-size:12px}.notification-detail{display:block;margin-top:5px;color:#bdcbd5;font-size:14px;line-height:1.5;font-weight:400}.notification-copy .toast-changes{margin-top:8px}.notification-copy .toast-changes:empty{margin:0} .notification-unread-dot{display:block;width:7px;height:7px;border-radius:50%;margin-top:7px;flex-shrink:0;background:var(--gold)} .notification-empty{text-align:center;padding:35px 18px;color:var(--muted)}.notification-empty>.pixel-icon{width:42px;height:42px;margin:0 0 10px}.notification-empty h3{color:var(--text);font-size:16px}.notification-empty p{font-size:14px;line-height:1.5} @media(min-width:701px) and (max-width:1050px){.sidebar-notifications .notification-label{font-size:12px}.sidebar-notifications .notification-bell{width:20px;height:20px}.sidebar-notifications .notification-badge{min-width:18px;padding:0 4px;font-size:11px}.navigation-footer .sidebar-notifications{gap:5px}} @media(max-width:700px){.game-shell .navigation-footer .sidebar-notifications{position:relative;gap:0}.sidebar-notifications .notification-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.sidebar-notifications .notification-badge{position:absolute;right:-3px;top:-5px;min-width:19px;height:19px;font-size:11px;padding:0 4px}.notification-heading{align-items:flex-start;flex-wrap:wrap;gap:10px}.notification-read-all{font-size:12px;padding:7px 9px}.notification-entry{gap:8px;padding:12px 9px}.notification-art{width:34px;height:34px}.notification-art>.event-art{width:32px;height:32px}.notification-copy>strong{font-size:14px}.notification-description{font-size:13px}.notification-unread-dot{width:6px;height:6px}} /* Vorcoins and the featured Premium Shop. */ .premium-icon{object-fit:contain;image-rendering:auto;flex-shrink:0}.side-nav button.premium-nav{color:#f4d37d;border:1px solid #80612e;background:linear-gradient(110deg,#332916,#292036);box-shadow:inset 3px 0 #d8ac4b}.side-nav button.premium-nav.active,.side-nav button.premium-nav:hover{background:#493721;border-color:#e9c566;color:#ffe5a0}.player-coins{display:flex;align-items:center;gap:8px;width:100%;margin:10px 0 12px;padding:8px 10px;text-align:left;background:#2a251b;border:1px solid #67522c;color:#f4d37d}.player-coins .pixel-icon{width:30px;height:30px}.player-coins span{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}.player-coins small{font-size:.75rem;color:#dcc796}.vip-badge{display:inline-flex;align-items:center;padding:3px 8px;border:1px solid #b28a3e;border-radius:4px;background:#3b2c19;color:#ffe09a;font-size:.75rem;font-weight:800;letter-spacing:.08em}.avatar-panel .vip-badge{margin-left:8px}.premium-eyebrow{color:#d7b16c;font-size:.72rem;letter-spacing:.16em;font-weight:750;margin:0 0 7px}.premium-heading{align-items:center}.premium-heading h1{color:#ffe2a0}.premium-wallet{display:flex;align-items:center;gap:10px;padding:12px 16px;background:#282317;border:1px solid #70572f;border-radius:8px;flex-shrink:0}.premium-wallet .pixel-icon{width:38px;height:38px;margin:0}.premium-wallet div{display:grid;gap:4px}.premium-wallet small{color:#c8bca3}.premium-wallet strong{color:#ffe09a;font-size:.95rem}.premium-status{display:flex;align-items:center;gap:12px;padding:14px 16px;margin:20px 0 16px;border:1px solid #594831;background:#24231f;border-radius:8px}.premium-status>.pixel-icon{width:36px;height:36px}.premium-status div{flex:1}.premium-status strong{font-size:.95rem;color:#ead6ab}.premium-status p{font-size:.85rem;margin:4px 0 0;color:var(--muted)}.premium-status.is-vip{border-color:#9b7838;background:#29251b}.game-content .premium-product{display:grid;grid-template-columns:minmax(160px,.85fr) minmax(0,1.35fr);gap:28px;padding:28px;border:1px solid #8a6a35;background:linear-gradient(120deg,#302131,#1b222a 65%);overflow:hidden;max-width:1000px}.premium-product-visual{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;min-width:0;background:radial-gradient(ellipse,#60422655,transparent 72%)}.premium-pass-art{display:block;width:100%;max-width:240px;aspect-ratio:1;object-fit:contain;image-rendering:auto;filter:drop-shadow(0 12px 12px #0005)}.premium-duration{padding:6px 12px;border-top:1px solid #7d5e35;border-bottom:1px solid #7d5e35;letter-spacing:.15em;font-size:.72rem;color:#e7c88f}.premium-product-copy h2{font-size:1.7rem;color:#fff0c8;margin:0 0 10px}.premium-description{font-size:.9rem;color:#b9b6b2;max-width:34em}.premium-benefits{list-style:none;margin:20px 0;padding:0;display:grid;gap:16px}.premium-benefits li{display:flex;align-items:center;gap:12px}.premium-benefit-value{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:62px;height:46px;background:#3b3020;border:1px solid #7d6135;border-radius:6px;color:#ffd780;font-size:1.2rem;font-weight:800}.premium-benefits strong{font-size:.9rem}.premium-benefits p{margin:3px 0 0;color:var(--muted);font-size:.8rem}.premium-purchase{border-top:1px solid #5b4d3a;padding-top:18px}.premium-price{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:#ffe2a0}.premium-price>.pixel-icon{width:28px;height:28px}.premium-price strong{font-size:1.1rem}.premium-price small{flex-basis:100%;color:var(--muted);font-size:.8rem}.premium-buy{width:100%;margin-top:5px;min-height:46px}.premium-purchase-note{font-size:.8rem;color:var(--muted);margin:9px 0 0}.premium-coming-soon{display:flex;align-items:center;justify-content:center;gap:8px;margin:20px 0;color:#c9bd9f;font-size:.85rem}.premium-coming-soon .pixel-icon{width:23px;height:23px}.profile-vip-summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:.85rem;color:#e6c781}.profile-vip-summary .pixel-icon{width:26px;height:26px}.change-coins{color:#f4d37d}.premium-nav:focus-visible,.player-coins:focus-visible{outline:2px solid #ffe09a;outline-offset:3px} @container(max-width:640px){.game-content .premium-product{grid-template-columns:1fr;gap:20px;padding:20px}.premium-pass-art{max-width:180px}.premium-product-visual{gap:10px}.premium-wallet{margin-top:12px}.premium-product-copy h2{font-size:1.45rem}} @media(max-width:700px){.side-nav button.premium-nav{box-shadow:inset 0 -2px #d8ac4b}.player-coins{margin:7px 0;padding:5px 8px;min-height:32px}.player-coins .pixel-icon{width:22px;height:22px}.premium-wallet{width:100%;padding:10px 12px;margin-top:12px}.premium-status{padding:12px;margin-top:16px}.game-content .premium-product{grid-template-columns:1fr;gap:20px;padding:18px}.premium-pass-art{max-width:170px}.premium-product-visual{gap:10px}.premium-product-copy h2{font-size:1.45rem}.premium-coming-soon{align-items:flex-start;line-height:1.5}.premium-price strong{font-size:1rem}} /* Homes: paired generated facade/interior atlases and the player's room stage. */ .home-icon{color:var(--gold)}.home-scene{display:block;width:100%;aspect-ratio:3/2;overflow:hidden;image-rendering:auto;background:#272324}.home-scene image{image-rendering:auto}.home-avatar-stage{position:relative;aspect-ratio:3/2;overflow:hidden;border-radius:5px;background:#272324;isolation:isolate}.home-avatar-stage>.avatar-room{position:absolute;inset:0;width:100%;height:100%}.avatar-panel .home-avatar-stage>.sprite.avatar-sprite{position:absolute;z-index:1;left:50%;bottom:0;transform:translateX(-50%);width:74%;height:100%;max-width:none;margin:0;filter:drop-shadow(2px 3px 0 #0006)}.player-panel .avatar-panel{padding:6px 6px 9px}.avatar-panel:has(.home-avatar-stage) figcaption{padding:8px 4px 2px}.home-collection{align-self:center;color:var(--muted);font-size:.85rem;white-space:nowrap}.game-content .current-home{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);padding:0;overflow:hidden;gap:0;margin-bottom:28px;border-color:#75603c}.current-home-stage{position:relative;min-width:0;align-self:stretch;background:#211d22;overflow:hidden}.current-home-stage>.home-scene{height:100%;min-height:215px;object-fit:cover}.current-home-stage>.home-preview-avatar{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);width:54%;height:85%;filter:drop-shadow(2px 4px 0 #0006)}.home-scene-label{position:absolute;left:12px;bottom:10px;max-width:calc(100% - 24px);font-size:.65rem;letter-spacing:.04em;color:#fff1d2;background:#17191ddd;padding:5px 8px;border-radius:3px}.current-home-copy{padding:24px;align-self:center;min-width:0}.home-eyebrow{margin:0 0 8px;color:var(--gold);font-size:.64rem;font-weight:700;letter-spacing:.13em}.current-home-copy h2{font-size:1.35rem;margin:0 0 10px}.current-home-copy>p:not(.home-eyebrow){color:var(--muted);font-size:.85rem;line-height:1.6}.home-active-bonuses{margin:16px 0;gap:10px}.current-home-copy>.home-rules{font-size:.73rem;border-top:1px solid var(--line);padding-top:12px;margin-bottom:0}.homes-catalogue-title{font-size:1rem;margin:0 0 16px}.homes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:20px}.game-content .home-card{padding:0;overflow:hidden;display:flex;flex-direction:column}.home-card.is-current-home{border-color:#a17d40;box-shadow:inset 0 0 0 1px #a17d4033}.home-facade{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}.home-tier,.home-current-tag{position:absolute;font-size:.65rem;line-height:1.3;border-radius:3px;padding:5px 7px;background:#151b23e8;color:#f1d8a1}.home-tier{left:10px;top:10px;font-variant-numeric:tabular-nums;letter-spacing:.1em}.home-current-tag{right:10px;bottom:10px;background:#2d3524f0;color:#d8ecbb;border:1px solid #82945b}.home-current-tag.is-owned{background:#192c2cf0;color:#8fe1cf;border-color:#507f76}.home-card-copy{display:flex;flex:1;flex-direction:column;padding:17px;min-width:0}.home-card-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.home-card-heading h3{font-size:1rem;margin:0;line-height:1.4}.home-card-heading .level-badge{font-size:.65rem;flex-shrink:0}.home-description{color:var(--muted);font-size:.8rem;line-height:1.6;min-height:3.2em;margin:12px 0}.home-bonuses{font-size:.75rem;gap:8px;min-height:26px;margin-bottom:12px}.home-bonuses .pixel-icon,.home-active-bonuses .pixel-icon{width:20px;height:20px}.home-room-preview{border-top:1px solid var(--line);margin-bottom:14px}.home-room-preview summary{padding:10px 0;color:var(--muted);cursor:pointer;font-size:.73rem;line-height:1.5}.home-room-preview[open] summary{color:var(--gold)}.home-room-preview>.home-scene{border-radius:4px;margin-bottom:8px}.home-purchase{display:grid;gap:6px;margin-top:auto}.home-purchase>strong{font-size:1rem}.home-purchase>small{font-size:.68rem;color:var(--muted)}.home-purchase>button{width:100%;margin-top:7px;min-height:40px;font-size:.8rem}.home-purchase>button:disabled{opacity:.65}.home-room-preview summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px} @media(max-width:1100px){.game-content .current-home{grid-template-columns:1fr}.current-home-stage>.home-scene{min-height:0}.current-home-copy{padding:19px}.homes-grid{gap:16px}} @media(max-width:700px){.player-panel .avatar-panel:has(.home-avatar-stage){min-width:0;padding:5px 5px 8px}.avatar-panel:has(.home-avatar-stage) figcaption{padding:5px 2px 2px;font-size:.8rem}.home-avatar-stage{max-width:280px;margin:auto}.game-content .current-home{grid-template-columns:1fr}.current-home-stage{max-height:300px}.current-home-copy h2{font-size:1.15rem}.homes-grid{grid-template-columns:1fr}.home-collection{font-size:.7rem}.home-card-copy{padding:16px}} /* Monthly seasons on the welcome screen, character selection and ranking. */ .season-details{margin-top:12px}.season-details>summary{padding:0;font-size:.8rem;color:var(--muted)}.season-details[open]>summary{margin-bottom:8px}.legal-scroll-status:empty{display:none} .season-panel{padding:18px 20px;margin:0 0 24px;border:1px solid #675637;border-radius:10px;background:linear-gradient(120deg,#302b20,#1b252e);min-width:0}.season-summary{display:flex;align-items:center;justify-content:space-between;gap:20px}.season-summary small{display:block;font-size:.8rem}.season-summary h2{margin:4px 0 0;color:var(--gold);font-size:1.15rem}.season-timer{text-align:right;flex-shrink:0}.season-timer strong{display:block;margin-top:4px;font-size:1.05rem;font-variant-numeric:tabular-nums;color:var(--teal);white-space:nowrap}.season-panel .season-date{font-size:.8rem;margin:12px 0 0}.season-panel .season-rules{font-size:.8rem;line-height:1.6;margin:8px 0 0;max-width:none}.title-copy .season-panel{max-width:520px;margin-top:25px}.character-selection>.season-panel{max-width:840px;margin-bottom:30px} @media(max-width:700px){.season-panel{padding:15px}.season-summary{flex-wrap:wrap;gap:12px}.season-timer{text-align:left}.season-summary h2{font-size:1.05rem}.season-timer strong{font-size:1rem}.title-copy .season-panel{max-width:100%;position:relative;z-index:1}.title-copy .season-panel p{max-width:none}} /* Character attributes share the avatar card, directly below its name. */ .player-panel .character-panel{padding:6px 6px 12px;min-width:0}.player-panel .character-panel .avatar-panel{margin:0;padding:0;border:0;background:transparent}.avatar-attributes{margin:10px 6px 0;padding:12px 0 0;border-top:1px solid var(--line);text-align:left}.avatar-attributes .attribute-price{font-weight:400;margin-bottom:9px}.avatar-attributes .side-stats{display:flex;flex-direction:column;gap:8px;margin:0 0 12px;width:100%;font-weight:400}.game-shell .avatar-attributes .side-stats>div{display:grid;grid-template-columns:minmax(0,1fr) auto var(--button-compact);align-items:center;gap:5px}.avatar-attributes .side-stats dt,.avatar-attributes .side-stats dd{min-width:0}.character-panel .player-level{margin:12px 6px 0}.character-panel .player-level-row{margin:0 0 7px}.character-panel .player-level>progress{display:block;width:100%} @media(min-width:701px){.player-panel{grid-template-rows:auto minmax(0,1fr)}} @media(max-width:700px){.player-panel{grid-template-columns:minmax(0,1fr);gap:10px}.player-panel .character-panel{grid-column:1;grid-row:1;padding:6px 8px 9px}.character-panel .avatar-panel{display:block;align-self:auto}.character-panel .home-avatar-stage{width:156px;max-width:100%}.character-panel .avatar-panel figcaption{display:block;font-size:.85rem;padding:6px 0 0}.avatar-attributes{margin:8px 0 0;padding-top:9px}.avatar-attributes .attribute-price{margin-bottom:7px}.avatar-attributes .side-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:8px}.game-shell .avatar-attributes .side-stats>div{grid-template-columns:minmax(0,1fr) var(--button-compact);gap:3px}.avatar-attributes .side-stats dt{grid-column:1 / -1}.avatar-attributes .side-stats dd,.avatar-attributes .side-stats .bought,.avatar-attributes .stat-label{font-size:14px}.character-panel .player-level{margin:9px 0 0}.character-panel .player-level-row{margin-bottom:5px}.player-panel .player-resources{grid-column:1;grid-row:2;min-width:0}} /* Legal document and mandatory acceptance before character creation. */ .legal-link,.legal-page a,.legal-document a{color:var(--gold);text-underline-offset:3px;overflow-wrap:anywhere} .title-copy>.legal-link{display:block;margin:12px 0}.selection-version{display:flex;gap:18px;align-items:center;flex-wrap:wrap} .legal-page{max-width:880px;margin:auto;padding:30px 24px 60px}.legal-page nav,.legal-page footer{padding:12px 0 26px} .legal-document{font-size:1rem;line-height:1.65;overflow-wrap:anywhere}.legal-document header{border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:24px}.legal-document h1{font-size:1.65rem}.legal-document h2{font-size:1.1rem;margin:24px 0 12px}.legal-document p,.legal-document li{line-height:1.65}.legal-document li{margin:8px 0}.legal-document ul{padding-left:23px}.legal-eyebrow{font-size:.75rem;letter-spacing:.12em;color:var(--gold);margin-bottom:10px}.legal-document .legal-notice{padding:12px;border-left:3px solid var(--gold);background:#302c20;color:#eee1bd}.legal-end{padding:22px 0 8px;border-top:1px solid var(--line);margin-top:28px;color:var(--teal)} .dialog.legal-dialog{display:flex;flex-direction:column;width:900px;max-height:94dvh;padding:24px;gap:12px;overflow:hidden}.legal-dialog>.dialog-close{display:none}.legal-heading{display:flex;gap:14px;align-items:center;flex-shrink:0}.legal-heading h2{font-size:1.4rem;margin:0}.legal-badge{border:1px solid var(--gold);border-radius:6px;padding:9px;color:var(--gold);font-weight:700;flex-shrink:0} .legal-dialog form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}.legal-scroll{overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;border:1px solid var(--line);border-bottom:0;border-radius:7px 7px 0 0;background:#111a22;padding:20px;min-height:120px;flex:1 1 auto;scroll-behavior:auto}.legal-scroll .legal-document header{margin-bottom:18px} .legal-checks{border:1px solid #6d5a2b;border-radius:8px;background:#1b252e;padding:12px 14px 14px;margin:20px 0 4px;display:grid;gap:4px;min-width:0}.legal-checks legend{padding:0 8px;font-size:1rem;font-weight:700;color:var(--gold)}.legal-checks:disabled{opacity:.5}.legal-dialog .legal-checks label{display:flex;align-items:flex-start;gap:12px;margin:0;padding:9px 8px;border-radius:6px;font-size:.92rem;line-height:1.45;color:var(--text);cursor:pointer}.legal-dialog .legal-checks label:hover{background:#ffffff0d}.legal-checks input{width:22px;height:22px;margin:0;accent-color:var(--gold);flex-shrink:0;cursor:pointer} .legal-dialog .legal-checks label.legal-check-all{align-items:center;padding:12px;margin-bottom:4px;background:#30291a;border:1px solid #a07c32}.legal-dialog .legal-checks label.legal-check-all:hover{background:#3d3420}.legal-check-all span{font-size:1.05rem;font-weight:700}.legal-dialog .legal-check-all input{width:26px;height:26px}.legal-checks.legal-attention{animation:legal-attention .7s ease-out 2}@keyframes legal-attention{0%,100%{box-shadow:0 0 0 0 #ffc54a00}35%{box-shadow:0 0 0 5px #ffc54ad9}} .legal-actions{display:grid;gap:10px;flex-shrink:0}.legal-progress{height:6px;background:#26313b;border:1px solid var(--line);border-top:0;border-radius:0 0 7px 7px;overflow:hidden}.legal-progress span{display:block;height:100%;background:var(--gold);transform-origin:left;transform:scaleX(0);transition:transform .2s linear,background-color .3s}.legal-progress.complete span{background:var(--teal)}.legal-dialog .legal-scroll-status{margin:0;font-size:1rem;font-weight:700;color:var(--gold);text-align:center}.legal-error{color:var(--red);font-size:.9rem;margin:0;text-align:center}.legal-error:empty{display:none}.legal-buttons{display:flex;justify-content:space-between;align-items:center;gap:12px}.legal-buttons button{min-height:48px;font-size:1rem}.legal-buttons .legal-accept{flex:0 1 340px}.legal-buttons .legal-decline{background:#293943;border-color:#8295a3;color:var(--text);box-shadow:0 3px 0 #101820}.legal-buttons .legal-decline:hover:not(:disabled){background:#3b4c59;border-color:#b1c1cd} @media(max-width:600px){.modal-backdrop:has(.legal-dialog){padding:8px}.dialog.legal-dialog{padding:12px;gap:8px;max-height:calc(100dvh - 16px)}.legal-heading{gap:10px}.legal-heading h2{font-size:1.1rem}.legal-badge{padding:6px;font-size:.85rem}.legal-scroll{padding:14px}.legal-document h1{font-size:1.25rem}.legal-document h2{font-size:1rem}.legal-document p,.legal-document li{font-size:.9rem}.legal-checks{padding:10px 6px 10px}.legal-dialog .legal-checks label{font-size:.86rem;line-height:1.4;padding:9px 6px}.legal-dialog .legal-scroll-status{font-size:.92rem}.legal-actions{gap:8px}.legal-buttons{gap:8px}.legal-buttons button{font-size:.92rem;padding:8px 12px}.legal-buttons .legal-accept{flex:1 1 auto}.legal-page{padding:20px 16px 40px}} @media(max-height:620px){.dialog.legal-dialog{gap:6px;padding:10px}.legal-heading h2{font-size:1rem}.legal-badge{padding:4px 6px}.legal-actions{gap:6px}.legal-buttons button{min-height:44px}} /* Compact navigation keeps account screens available during confinement. */ .navigation-panel{overflow:hidden;gap:12px}.sidebar-brand,.navigation-footer{flex-shrink:0}.side-nav{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;gap:3px}.side-nav>button{flex-shrink:0}.navigation-footer{padding-top:0}.side-nav button.is-restricted{color:#7d8992}.side-nav button.is-restricted:hover{color:var(--text);background:#202a33}.side-nav .nav-lock{width:12px;height:12px;flex-shrink:0;margin-left:auto;opacity:.8}.side-nav button.status-nav{color:#f0bd78;border-color:#725735;background:#30291f}.side-nav button.status-nav.active{box-shadow:inset 3px 0 #f0bd78}.side-nav button:focus-visible{outline:2px solid var(--gold);outline-offset:-2px} @media(max-width:700px){.side-nav .nav-lock{position:absolute;width:10px;height:10px;right:2px;bottom:3px;margin:0}.navigation-panel{gap:10px}.side-nav button.status-nav.active{box-shadow:inset 0 -2px #f0bd78}} .side-nav:has(.nav-status){scroll-padding-top:64px}.nav-status{display:flex;flex-direction:column;flex-shrink:0;position:sticky;top:0;z-index:2;padding-bottom:6px;background:#141c24;border-bottom:1px solid var(--line)} @media(min-width:701px){.navigation-panel{padding-block:12px;gap:8px}.sidebar-brand{height:52px}} /* Drops, three-slot equipment and the player marketplace. */ .loot-eyebrow{font-size:.72rem;letter-spacing:.14em;color:var(--muted);margin:0 0 6px}.player-equipment{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px;padding:20px}.player-equipment h2{margin:0}.player-equipment p{max-width:370px;color:var(--muted)}.equipment-slots{display:grid;grid-template-columns:repeat(3,minmax(0,96px));gap:10px}.person-content>.equipment-slots{margin:12px 0}.inventory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(94px,1fr));gap:12px;margin:16px 0 24px}.item-cell{--rarity:#637084;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:112px;min-width:0;width:100%;padding:12px 6px 8px;border:2px solid var(--rarity);border-radius:7px;background:linear-gradient(145deg,color-mix(in srgb,var(--rarity) 14%,#151e2a),#101824);box-shadow:inset 0 0 14px color-mix(in srgb,var(--rarity) 9%,transparent);color:var(--rarity);text-align:center;transition:transform .12s,border-color .12s}.item-cell:hover,.item-cell:focus-visible{transform:translateY(-2px);outline:2px solid var(--rarity);outline-offset:3px;z-index:1}.loot-glyph{width:36px;height:36px;flex-shrink:0;filter:drop-shadow(0 3px 0 #0005);shape-rendering:crispEdges}.item-cell-name{font-size:.68rem;font-weight:600;line-height:1.25;color:#e4eaf3;overflow-wrap:anywhere}.item-cell-rarity{font-size:.61rem}.equipped-mark{position:absolute;right:5px;top:3px;font-size:.65rem}.empty-item-slot{border-style:dashed;min-height:106px;font-size:.7rem;color:#94a3b8}.slot-plus{font-size:1.8rem;color:#71839a}.loot-filters{display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin:16px 0}.loot-filters label{display:flex;flex-direction:column;gap:6px;font-size:.78rem;flex:1;min-width:120px}.loot-filters input,.loot-filters select{width:100%;min-height:40px;min-width:0}.loot-filters button{min-height:40px}.rarity-legend{display:flex;gap:9px 15px;flex-wrap:wrap;padding:8px 0;color:var(--muted);font-size:.74rem}.rarity-legend>span{color:var(--rarity);display:flex;gap:5px;align-items:center}.rarity-legend>span:before{content:'';width:7px;height:7px;background:var(--rarity)}.rarity-legend small{opacity:.6}.loot-empty{padding:36px 20px;text-align:center;color:var(--muted);margin:16px 0}.loot-empty h2{color:#e4eaf3}.loot-empty p{max-width:500px;margin:12px auto 20px}.item-summary{display:flex;align-items:center;gap:15px;color:var(--rarity);margin:6px 0 14px}.item-summary>.loot-glyph{width:52px;height:52px;padding:8px;border:2px solid var(--rarity);box-sizing:content-box;border-radius:6px;background:#111b28}.item-summary h3{font-size:1.05rem;line-height:1.3;margin:5px 0 0;color:#eef2f8}.rarity-label{color:var(--rarity);font-size:.72rem;font-weight:600}.item-multiplier{font-size:.75rem;color:var(--muted);margin:14px 0 4px}.loot-stats{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.item-tooltip{position:fixed;z-index:10000;width:min(310px,calc(100vw - 16px));padding:16px;border:1px solid #526279;border-radius:9px;background:#121b2afc;box-shadow:0 12px 36px #0009;pointer-events:none;max-height:calc(100dvh - 16px);overflow:hidden;font-size:.8rem;line-height:1.45}.item-tooltip[hidden]{display:none}.item-tooltip p{margin:8px 0}.item-tooltip .item-summary>.loot-glyph{width:32px;height:32px}.item-tooltip .item-summary h3{font-size:.88rem}.item-tooltip .stats-inline{gap:8px;font-size:.8rem}.items-dialog{width:min(650px,94vw)}.items-dialog>p,.items-dialog form>p{line-height:1.55;color:var(--muted)}.items-dialog label{display:block;font-size:.82rem;margin:16px 0 6px}.items-dialog select,.items-dialog input{width:100%;min-height:42px}.items-dialog form>button{width:100%;margin-top:12px}.items-dialog .picker-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));max-height:380px;overflow:auto;padding:6px}.equipped-current{padding:12px;border:1px solid var(--line);border-radius:5px}.item-equip-actions{grid-template-columns:repeat(3,minmax(0,96px));gap:10px;margin:12px 0 18px}.equipment-slots .item-cell{aspect-ratio:1;min-height:0}.equipment-slots .item-cell-name,.equipment-slots .item-cell-rarity{display:none}.item-equip-actions .item-cell{padding:10px 6px;white-space:normal}.item-slot-caption{font-size:.65rem;color:var(--muted);margin-top:auto;padding-top:4px}.item-cell[aria-disabled="true"]{cursor:default;opacity:.65}.item-cell[aria-current="true"]{outline:2px solid var(--gold);outline-offset:3px}.item-cell[aria-current="true"] .item-slot-caption{color:var(--gold)}.listing-item-picker{margin:16px 0}.listing-item-picker>summary{cursor:pointer;min-height:44px;align-content:center;color:var(--text)}.listing-item-picker .is-selected{outline:2px solid var(--gold);outline-offset:2px}.items-dialog #equip-help{margin:14px 0 0;font-size:.8rem}.items-dialog>.equipment-slots:not(.item-equip-actions){margin:16px 0}.market-balances{display:flex;flex-wrap:wrap;gap:10px 25px;padding:12px 16px;border:1px solid var(--line);border-radius:6px;background:#111b27}.market-balances>span{display:flex;align-items:center;gap:8px;font-size:.85rem}.market-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin:20px 0}.market-card{border-top:3px solid var(--rarity);padding:17px;display:flex;flex-direction:column;gap:14px}.market-card h2{font-size:.95rem;margin:5px 0;line-height:1.35}.market-item-heading{display:flex;align-items:center;gap:13px}.market-item-heading .item-cell{width:70px;min-width:70px;min-height:74px;padding:8px}.market-item-heading .item-cell-name,.market-item-heading .item-cell-rarity{display:none}.market-item-heading small{font-size:.72rem;color:var(--muted)}.market-card>.stats-inline{font-size:.8rem;gap:10px;flex-wrap:wrap}.market-price{display:flex;align-items:center;gap:8px;font-size:.9rem;color:#f3d595;margin-top:auto}.market-card>button{width:100%}.market-buy-price{font-size:1.4rem!important;color:#f3d595!important;font-weight:700}.fraud-drops{font-size:.78rem;border:1px solid var(--line);padding:10px 12px;margin:14px 0;border-radius:5px}.fraud-drops summary{cursor:pointer;color:#d4dce9}.fraud-drops p,.fraud-drops small{color:var(--muted);line-height:1.5}.drop-odds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:12px 0}.drop-odds span{display:flex;justify-content:space-between;gap:8px;color:var(--rarity)} @media(max-width:700px){.player-equipment{align-items:flex-start;flex-direction:column}.player-equipment>.equipment-slots{width:100%;grid-template-columns:repeat(3,minmax(0,1fr))}.inventory-grid{grid-template-columns:repeat(auto-fill,minmax(85px,1fr));gap:9px}.market-grid{grid-template-columns:1fr}.loot-filters label{min-width:130px}.market-balances{gap:10px}.item-cell{min-height:104px}.person-content>.equipment-slots{grid-template-columns:repeat(3,minmax(0,1fr));max-width:310px}} .person-content>.equipment-slots{grid-template-columns:repeat(3,42px);gap:7px;margin:9px 0;max-width:none}.person-content>.equipment-slots .item-cell{width:42px;min-height:42px;height:42px;padding:6px;border-radius:5px}.person-content>.equipment-slots .loot-glyph{width:27px;height:27px}.person-content>.equipment-slots .item-cell-name,.person-content>.equipment-slots .item-cell-rarity,.person-content>.equipment-slots .empty-item-slot>span:not(.slot-plus){display:none}.person-content>.equipment-slots .slot-plus{font-size:1.3rem;line-height:1}.person-content>.equipment-slots .equipped-mark{font-size:.45rem;top:1px;right:2px}.loot-filters input,.loot-filters select{background:#111b27;color:var(--text);border:1px solid var(--line);border-radius:5px;padding:9px 10px} /* Compact mobile shell: one content scroller, details available on demand. */ .fraud-current-badge{display:inline-flex;align-items:center;gap:5px;width:max-content;max-width:100%;padding:3px 7px;border:1px solid #497b6c;border-radius:5px;background:#193b32;color:var(--teal);font-size:.75rem;font-weight:700;line-height:1.4;vertical-align:middle} .fraud-current-badge::before{content:"";width:6px;height:6px;flex-shrink:0;border-radius:50%;background:currentColor} .fraud-option-copy>strong .fraud-current-badge{margin:3px 0 3px 8px} .fraud-list-button.is-current:not(.selected){border-color:#497b6c;background:#1a302c} .fraud-heading>.fraud-current-badge,.fraud-heading>.fraud-current-link{margin:-2px 0 10px} .fraud-current-link{min-height:44px;padding:8px 10px;border-color:#497b6c;background:#193b32;color:var(--teal);font-size:.9rem} .mobile-header,.mobile-nav,.game-shell button.mobile-fraud-picker{display:none} .dialog.navigation-dialog .navigation-panel{display:flex;position:static;height:auto;padding:0;border:0;background:transparent;overflow:visible;gap:16px} .navigation-dialog .sidebar-brand,.navigation-dialog .sidebar-notifications{display:none} .navigation-dialog .side-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;gap:8px} .navigation-dialog .side-nav button{width:100%;min-height:58px;padding:12px;white-space:normal;justify-content:flex-start;text-align:left;background:#141e28;border-color:var(--line);margin:0;font-size:14px} .navigation-dialog .side-nav button>span{position:static;display:inline;width:auto;height:auto;clip-path:none;overflow:visible} .navigation-dialog .side-nav button.active{background:#302d23;border-color:#8a713e} .navigation-dialog .nav-status{grid-column:1 / -1;position:static;padding:0 0 8px;background:transparent} .navigation-dialog .navigation-footer{margin:0;padding:0} .navigation-dialog .navigation-footer button{width:100%;min-height:44px;justify-content:center;font-size:14px} .dialog.player-dialog .player-panel{display:flex;flex-direction:column;position:static;grid-column:auto;grid-row:auto;height:auto;overflow:visible;padding:0;border:0;background:transparent;gap:16px} .player-dialog .player-block{padding:14px;border:1px solid var(--line);border-radius:10px;background:#151f28} .player-dialog .player-resources{overflow:visible;order:-1} .player-dialog .player-resources .fraud-timer-compact{display:none} .player-dialog .player-budget button,.player-dialog .buy-attribute{min-width:44px;min-height:44px} .player-dialog .avatar-attributes .side-stats{display:flex;flex-direction:column;gap:9px} .player-dialog .avatar-attributes .side-stats>div{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;align-items:center} .player-dialog .avatar-attributes .side-stats dt{grid-column:auto} .player-dialog .home-avatar-stage{width:156px;margin:auto} .player-dialog .avatar-panel figcaption{display:block} .player-dialog .player-profile-link{width:100%;margin-top:16px} .catalogue-dialog .fraud-catalogue{height:auto;max-height:none;border:0;background:transparent;overflow:visible} .catalogue-dialog .fraud-catalogue>h2{padding:0 0 16px;font-size:1.25rem} .catalogue-dialog .fraud-list{padding:10px 0 0;overflow:visible;gap:8px} .catalogue-dialog .fraud-list-button{justify-content:flex-start;text-align:left;min-height:72px} .dialog .dialog-close{position:sticky;top:-1px;z-index:3;background:#1d2731;padding:4px 0 8px} @media(max-width:900px){ .game-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;height:100dvh;max-width:100%;overflow:hidden} .game-shell>.navigation-panel,.game-shell>.player-panel{display:none} .game-shell>.game-content,.game-shell>.game-content.fraud-view{grid-column:1;grid-row:2;display:block;height:100%;min-height:0!important;overflow-y:auto;padding:18px max(16px,env(safe-area-inset-right)) 28px max(16px,env(safe-area-inset-left));scroll-padding-block:16px;overscroll-behavior-y:contain} .game-content .section-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:16px} .game-content .section-head>div{min-width:0} .game-content .section-head>button{margin:0;max-width:100%;min-height:44px} .game-content h1{font-size:1.4rem;margin:0;overflow-wrap:anywhere} .game-content .section-head p{margin:6px 0 0} .mobile-header{display:block;grid-column:1;grid-row:1;min-width:0;padding:max(8px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 6px max(12px,env(safe-area-inset-left));background:#141c24;border-bottom:1px solid var(--line)} .mobile-header-row{display:flex;align-items:center;gap:8px;min-width:0} .game-shell .mobile-player-button{flex:1;min-width:0;padding:0;gap:8px;justify-content:flex-start;background:transparent;border-color:transparent;text-align:left} .mobile-player-button .portrait{width:36px;height:36px;flex-shrink:0;border-radius:8px;background:#26333e!important} .mobile-player-button>span{min-width:0} .mobile-player-button strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem} .mobile-player-button small{display:block;font-size:.72rem;color:var(--muted)} .mobile-player-button small span{color:var(--gold);margin-left:6px} .mobile-cash{flex:0 1 auto;max-width:48%;min-width:0;color:var(--teal);font-size:.88rem;line-height:1.3;text-align:right;overflow-wrap:anywhere;font-variant-numeric:tabular-nums} .game-shell .mobile-header .sidebar-notifications{position:relative;flex:none;width:44px;height:44px;padding:10px;border:0;background:transparent} .mobile-header .notification-label{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden} .mobile-header .notification-bell{width:21px;height:21px;color:var(--muted)} .mobile-header .has-unread .notification-bell{color:var(--gold)} .mobile-header .notification-badge{position:absolute;top:0;right:0;min-width:17px;height:17px;padding:0 3px;font-size:10px} .game-shell .mobile-vitals{display:flex;width:100%;gap:8px;justify-content:space-between;min-height:44px;padding:6px 2px;border:0;border-radius:0;background:transparent} .mobile-vitals>span{display:flex;align-items:center;gap:4px;min-width:0;font-size:.69rem;color:var(--muted);font-weight:400} .mobile-vitals b{color:var(--text);font-size:.75rem;font-variant-numeric:tabular-nums} .mobile-vitals .pixel-icon{width:16px;height:16px;margin:0;flex-shrink:0} .game-shell .mobile-header .fraud-timer-compact{display:grid;grid-template-columns:minmax(0,1fr) auto;width:100%;min-width:0;gap:4px 10px;text-align:left;margin:0 0 4px;min-height:44px;padding:6px 10px;font-size:.75rem;background:#1b2c2b;border-color:#35584d} .mobile-header .fraud-timer-compact .fraud-timer-name,.mobile-header .fraud-timer-compact time{font-size:.75rem} .mobile-header .connection-notice{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.75rem;padding:4px} .game-shell .mobile-nav{display:grid;grid-column:1;grid-row:3;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:6px max(8px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:#141c24;border-top:1px solid var(--line)} .game-shell .mobile-nav button{display:flex;flex-direction:column;min-width:0;min-height:54px;padding:6px 2px;gap:4px;font-size:.65rem;line-height:1.2;border-color:transparent;background:transparent;color:var(--muted);border-radius:9px} .game-shell .mobile-nav button.active{color:var(--gold);background:#302d23;border-color:#605131} .game-shell .mobile-nav button>.pixel-icon{width:21px;height:21px} .game-shell button.mobile-fraud-picker{display:inline-flex;min-height:44px;padding:8px 12px;color:var(--gold);border-color:#665735;background:#27271f} .game-content .fraud-workspace{display:block;height:auto;min-height:0;overflow:visible} .game-content .fraud-catalogue{display:none} .game-content .fraud-detail{width:100%;height:auto;max-height:none;overflow:visible;padding:14px;border-radius:12px} .fraud-overview{grid-template-columns:80px minmax(0,1fr);gap:14px;margin-bottom:8px} .fraud-heading h2{font-size:1.05rem;line-height:1.35;margin-bottom:8px} .fraud-chance .chance{font-size:1.5rem} .fraud-metrics{gap:10px 16px;padding-block:12px;margin-bottom:12px} .fraud-metrics dd{overflow-wrap:anywhere} .game-shell .game-content .fraud-repeat button{min-height:44px} .game-shell .game-content .fraud-apply{min-height:48px} .game-content .subtabs{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding:2px 2px 10px;gap:8px;scrollbar-width:thin;scroll-padding-inline:2px} .game-content .subtabs button{flex-shrink:0;white-space:nowrap;min-height:44px;padding:9px 12px} .game-content .card-grid,.game-content .people-grid{grid-template-columns:minmax(0,1fr);gap:12px} .game-content .card{border-radius:12px} .game-content .person-content{display:flex;flex-direction:column;min-width:0} .person-content .card-title{flex-wrap:wrap} .game-content .person-content .actions{max-width:100%;justify-content:flex-start} .game-content .person-content button{min-height:44px;overflow-wrap:anywhere} .game-content input,.game-content select,.dialog input:not([type=checkbox]):not([type=range]),.dialog select{font-size:16px;min-height:44px} .game-content summary{min-height:44px;align-content:center} .modal-backdrop{padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));align-items:flex-end} .dialog{width:100%;max-width:620px;max-height:calc(100dvh - max(24px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)));padding:16px;border-radius:18px;overscroll-behavior:contain;scrollbar-width:thin} .dialog .dialog-close button{min-height:44px} .dialog.mobile-sheet{width:100%;max-width:560px} .dialog.mobile-sheet>h2{font-size:1.25rem;margin:0 0 16px} .dialog.navigation-dialog .side-nav .pixel-icon{width:22px;height:22px} .dialog.player-dialog .player-coins{min-height:44px} .game-content .homes-grid,.game-content .market-grid{grid-template-columns:minmax(0,1fr)} .game-content .current-home{grid-template-columns:minmax(0,1fr)} .game-content .player-equipment{flex-wrap:wrap;gap:12px} .game-content .premium-product{grid-template-columns:minmax(0,1fr)} .game-content .premium-pass-art{max-width:170px} .game-content .premium-wallet{width:100%;margin-top:0} .game-content .highscores-table{font-size:.8rem} .game-content .highscores-table th,.game-content .highscores-table td{padding:10px 5px} .game-content .highscore-player{gap:6px;min-width:0} .game-content .highscore-player .portrait{width:28px;height:28px} .toast-card .toast-dismiss{min-width:44px;min-height:44px;width:44px;height:44px} } @media(max-width:360px){ .mobile-vitals>span{font-size:.63rem;gap:3px} .mobile-vitals .pixel-icon{width:14px;height:14px} .mobile-vitals b{font-size:.7rem} .game-shell>.game-content,.game-shell>.game-content.fraud-view{padding-inline:12px} .game-content .fraud-detail{padding:12px} .navigation-dialog .side-nav button{padding:9px;font-size:13px;gap:6px} } @media(max-width:900px) and (max-height:500px){ .mobile-header{padding-top:4px;padding-bottom:4px} .mobile-header-row{float:left;width:48%;padding-right:10px} .game-shell .mobile-vitals{width:52%} .mobile-header>.fraud-timer-compact{clear:both} .game-shell .mobile-nav button{flex-direction:row;min-height:44px;gap:7px} } /* Shared portrait frames preserve the face crop beneath the transparent artwork. */ .portrait-frame{pointer-events:none;image-rendering:auto} .player-name{display:inline-flex;align-items:center;flex-wrap:wrap;gap:3px 6px;max-width:100%;vertical-align:middle} .player-name>span{min-width:0;overflow-wrap:anywhere} .vip-name{color:#ffe09a} .vip-mark{display:inline-block;width:45px;height:17px;flex:none;vertical-align:middle;image-rendering:auto;overflow:visible} .avatar-panel .vip-mark,.premium-status>.vip-mark{width:56px;height:21px} .coin-shop{max-width:1000px;margin-top:28px}.coin-shop>h2,.coin-purchases h2{color:#ffe2a0;font-size:1.15rem}.coin-shop-note{max-width:70ch;color:var(--muted);font-size:.85rem;line-height:1.6}.coin-shop-unavailable{padding:12px;border:1px solid #80612e;border-radius:6px;color:#f4d37d;font-size:.85rem;line-height:1.5}.coin-pack-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.game-content .coin-pack{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 12px;border-color:#70572f;background:linear-gradient(150deg,#302131,#1b222a);text-align:center;min-width:0}.coin-pack-art{width:100%;height:145px;object-fit:contain;image-rendering:auto}.coin-pack h3{font-size:.9rem;margin:0;color:#ffe09a}.coin-pack-price{font-size:1.15rem}.coin-pack-buy{width:100%;min-height:44px;margin-top:auto}.coin-shop-error{color:#ffa5a5;line-height:1.5}.coin-purchases{margin-top:24px}.coin-purchases ul{padding:0;list-style:none}.coin-purchases li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid #594831}.coin-purchases li>div{display:flex;flex-direction:column;gap:7px;min-width:0}.coin-purchases small{color:var(--muted)}.coin-purchases span{font-size:.85rem}.coin-purchase-actions{align-items:flex-end;flex-shrink:0}.coin-checkout-link{color:#ffe09a;padding:8px 0}.coin-checkout-link:focus-visible{outline:2px solid #ffe09a;outline-offset:3px} @container(max-width:800px){.coin-pack-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.coin-pack-art{height:125px}.coin-purchases li{flex-wrap:wrap}.coin-purchase-actions{align-items:flex-start}} @media(max-width:420px){.coin-pack-grid{gap:8px}.game-content .coin-pack{padding:12px 8px}.coin-pack-art{height:105px}.coin-pack h3{font-size:.8rem}.coin-pack-buy{font-size:.8rem}} .premium-featured{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:20px;margin-top:18px}.premium-featured>.coin-shop{max-width:none;margin-top:0;min-width:0}.premium-featured .coin-pack-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.premium-vip{display:grid;gap:12px;min-width:0}.premium-vip .premium-status{margin:0}.game-content .premium-featured .premium-product{grid-template-columns:minmax(0,1fr);gap:16px;padding:20px;max-width:none}.premium-featured .premium-pass-art{max-width:140px}.premium-featured .premium-benefits{margin:16px 0;gap:12px}.premium-featured .premium-product-copy h2{font-size:1.45rem} @container(max-width:760px){.premium-featured{grid-template-columns:minmax(0,1fr)}} @media(max-width:700px){.premium-featured{grid-template-columns:minmax(0,1fr);gap:24px}.game-content .premium-featured .premium-product{padding:18px}} .game-content .player-card>.framed-portrait{width:80px;height:80px} .highscore-player .sprite.framed-portrait{width:56px;height:56px} .room-message .sprite.framed-portrait{width:44px;height:44px} .game-shell .manager-picker>summary .sprite.framed-portrait{width:40px;height:40px} .game-shell .game-content .manager-option .framed-portrait{width:48px!important;height:48px!important} .attack-member .sprite.framed-portrait,.target-defender .sprite.framed-portrait{width:56px;height:56px} .defense-roster .player-name{gap:3px 5px} @media(max-width:600px){ .game-content .player-card>.framed-portrait{width:64px;height:64px} .highscore-player .sprite.framed-portrait,.room-message .sprite.framed-portrait{width:40px;height:40px} .attack-member .sprite.framed-portrait{width:44px;height:44px} .vip-mark{width:40px;height:15px} } .online-counter{display:flex;align-items:center;gap:8px;color:var(--teal);font-size:.85rem;line-height:1.4;font-variant-numeric:tabular-nums}.online-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none;box-shadow:0 0 8px #76d5bb44}.online-counter.is-unavailable{color:var(--muted)}.title-copy>.online-counter{margin:0 0 18px}.navigation-footer>.online-counter{justify-content:center;padding:5px 3px;font-size:.75rem;text-align:center} .mobile-header>.online-counter{justify-content:flex-end;clear:both;font-size:.65rem;line-height:1.2;padding:2px 0 4px}.mobile-header .online-dot{width:5px;height:5px} .mobile-nav button,.mobile-fraud-picker{position:relative}.mobile-nav .unlock-dot{position:absolute;top:5px;right:12px;margin:0}.navigation-dialog .side-nav .unlock-dot{position:absolute;right:8px;top:8px;transform:none;width:8px;height:8px;margin:0} /* Server-authored business battle replay. */ .dialog.battle-dialog{width:900px;padding:0;overflow:auto;border:2px solid #bb9a55;background:#111b29;box-shadow:0 18px 100px #000c;scrollbar-width:thin} .battle-view{font-family:ui-monospace,Consolas,monospace;color:#f6ecd8;overflow:hidden} .battle-header{display:flex;justify-content:space-between;align-items:center;padding:18px 24px;background:#162331;border-bottom:1px solid #384756;gap:12px} .battle-eyebrow{display:block;letter-spacing:.18em;font-size:10px;color:#dfb96a;font-weight:700} .battle-header h2{font-size:23px;margin:5px 0 0;letter-spacing:-1px;color:#fbf0d6} .battle-countdown{padding:8px 12px;background:#0c1620;border:1px solid #475365;font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap} .battle-scene{position:relative;height:330px;overflow:hidden;isolation:isolate;background:linear-gradient(#263856 0%,#555778 53%,#89725e 53.5%,#a58c68 54%,#695c53 100%)} .battle-skyline{position:absolute;left:0;right:0;bottom:46%;height:130px;background:#152638;opacity:.65;clip-path:polygon(0 65%,4% 65%,4% 30%,10% 30%,10% 55%,14% 55%,14% 0,21% 0,21% 40%,24% 40%,24% 20%,33% 20%,33% 70%,40% 70%,40% 40%,47% 40%,47% 5%,55% 5%,55% 60%,62% 60%,62% 25%,69% 25%,69% 65%,75% 65%,75% 15%,81% 15%,81% 50%,87% 50%,87% 32%,93% 32%,93% 65%,100% 65%,100% 100%,0 100%)} .battle-ground{position:absolute;border-radius:50%;height:42px;width:220px;background:#33463a;box-shadow:0 6px #24362f,0 9px 0 3px #8d8871;border:4px solid #80917a} .battle-ground-defense{right:7%;top:48%;width:190px;height:32px}.battle-ground-attack{left:6%;bottom:17px} .battle-combatant{position:absolute;width:195px;height:195px;z-index:2}.battle-defense{right:7%;top:3%}.battle-attack{left:7%;bottom:7px;width:225px;height:225px} .battle-fighter-art,.battle-fighter-art>.sprite.battle-sprite{width:100%;height:100%;display:block;image-rendering:auto} .battle-hud{position:absolute;width:43%;max-width:340px;padding:12px 14px 10px;border:2px solid #21383e;border-radius:3px 3px 12px 3px;background:#e8e6c9;box-shadow:4px 4px #182b37;color:#193138;z-index:3} .battle-hud-defense{top:20px;left:24px}.battle-hud-attack{right:24px;bottom:25px} .battle-hud>div{display:flex;align-items:center;justify-content:space-between;gap:7px}.battle-hud strong{font-size:14px;line-height:1.3;overflow-wrap:anywhere} .battle-type{font-size:9px;padding:4px 5px;border-radius:2px;background:#693a71;color:#fff;white-space:nowrap}.battle-type[data-type=analise]{background:#216473}.battle-type[data-type=influencia]{background:#806125} .battle-hud label{display:flex;justify-content:space-between;font-size:10px!important;margin:9px 0 5px;letter-spacing:.08em}.battle-hud label b{font-variant-numeric:tabular-nums} .battle-hud progress{display:block;width:100%;height:9px;accent-color:#429569;margin:0;border:0}.battle-hud progress::-webkit-progress-bar{background:#9baf9d;border-radius:2px}.battle-hud progress::-webkit-progress-value{background:#39976c;transition:width .55s ease}.battle-hud progress.battle-low::-webkit-progress-value{background:#c35b48} .battle-field-label{position:absolute;bottom:4px;right:10px;max-width:45%;font-size:9px;letter-spacing:.08em;color:#e9dfcc;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} .battle-damage{position:absolute;top:15%;left:43%;font-size:26px;color:#fff1d0;font-weight:900;text-shadow:2px 2px #542f35;animation:battle-damage .9s ease-out both;z-index:5} .battle-attack.is-attacking .battle-fighter-art{animation:battle-lunge .5s steps(4)}.battle-defense.is-attacking .battle-fighter-art{animation:battle-lunge .5s steps(4) reverse} .battle-combatant.is-hit .battle-fighter-art{animation:battle-hit .6s steps(2) .25s}.battle-combatant.is-knocked-out .battle-fighter-art{opacity:.25;transform:translateY(30px);transition:opacity .8s,transform .8s} .battle-projectile{position:absolute;z-index:4;left:28%;top:61%;font-size:40px;color:#fbdf9f;text-shadow:2px 2px #705366;animation:battle-projectile .7s steps(6) both} .battle-scene[data-striker=defense] .battle-projectile{left:69%;top:29%;animation-name:battle-projectile-back} .battle-scene[data-effect=smoke] .battle-projectile{color:#b9a3d3;letter-spacing:5px}.battle-scene[data-effect=stamp] .battle-projectile{color:#dfb85d} .battle-narrative,.battle-result{padding:17px 24px 12px;min-height:146px;border-top:3px solid #bb9a55;background:#101b29}.battle-narrative h3,.battle-result h3{margin:8px 0;font-size:21px;color:#f8eacf}.battle-narrative p,.battle-result p{font-size:12px;line-height:1.65;margin:0;color:#c5cbd0}.battle-effectiveness{display:block;font-size:11px;color:#e4ba69;min-height:14px;margin-top:7px} .battle-result.is-victory h3{color:#8fe0ac}.battle-rewards{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.battle-rewards>*{font-size:12px;padding:6px 9px;background:#233d3c;color:#cce4c9;border:1px solid #496558}.battle-rewards>span{background:#27303d;color:#bfc8d1;border-color:#46505d}.battle-result p.battle-cooldown-note{font-size:10px} .battle-lineups{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:12px 24px 0;border-top:1px solid #344251}.battle-lineups>div{min-width:0}.battle-lineups small{font-size:9px;letter-spacing:.1em;color:#a9b7c4}.battle-lineups>div>div{display:flex;gap:3px;overflow:auto;max-height:51px;margin-top:4px;scrollbar-width:thin}.battle-reserve{flex:0 0 40px;width:40px;height:40px;background:#1f2d3c;border:1px solid #3e4a59;border-radius:3px}.battle-reserve>.sprite.battle-sprite{width:100%;height:100%;display:block} .battle-type-guide{font-size:9px;color:#8c9dac;margin:10px 24px 12px;line-height:1.5}.battle-controls{padding:12px 24px;background:#172432;border-top:1px solid #344251;display:flex;align-items:center;justify-content:space-between;gap:12px}.battle-controls>span{font-size:9px;color:#91a696}.battle-controls>div{display:flex;gap:7px}.battle-controls button{font:inherit;font-size:11px;padding:9px 11px;border:1px solid #a58c55;background:#293849;color:#f2dfb5;min-height:36px}.battle-controls button[hidden]{display:none}.battle-history{margin-bottom:10px;font-size:.85rem} @keyframes battle-lunge{50%{transform:translate(24px,-9px)}} @keyframes battle-hit{25%,75%{opacity:.25;transform:translateX(5px)}50%{opacity:1;transform:translateX(-5px)}} @keyframes battle-damage{0%{opacity:0;transform:translateY(15px)}30%,70%{opacity:1}100%{opacity:0;transform:translateY(-20px)}} @keyframes battle-projectile{0%{opacity:0;transform:translate(0,0) rotate(-10deg)}20%{opacity:1}90%{opacity:1}100%{opacity:0;transform:translate(290px,-100px) rotate(20deg)}} @keyframes battle-projectile-back{0%{opacity:0;transform:translate(0,0)}20%{opacity:1}90%{opacity:1}100%{opacity:0;transform:translate(-290px,100px)}} @media(max-width:600px){.dialog.battle-dialog{width:calc(100vw - 16px);max-height:96dvh}.battle-header{padding:12px 14px}.battle-header h2{font-size:19px}.battle-eyebrow{font-size:8px}.battle-scene{height:275px}.battle-hud{padding:9px;width:51%}.battle-hud-defense{left:10px;top:12px}.battle-hud-attack{right:10px;bottom:15px}.battle-hud strong{font-size:10px}.battle-hud label{font-size:8px!important}.battle-type{font-size:7px;padding:3px}.battle-defense{width:145px;height:145px;right:2%;top:30px}.battle-attack{width:175px;height:175px;left:0;bottom:5px}.battle-ground-defense{width:120px;right:6%;top:54%;height:24px}.battle-ground-attack{left:2%;width:150px;height:30px;bottom:15px}.battle-narrative,.battle-result{padding:14px;min-height:155px}.battle-narrative h3,.battle-result h3{font-size:18px}.battle-narrative p,.battle-result p{font-size:11px}.battle-lineups{padding:10px 14px 0;gap:12px}.battle-type-guide{margin:9px 14px;font-size:8px}.battle-controls{padding:10px 14px;gap:8px;align-items:flex-start;flex-direction:column}.battle-controls>div{align-self:flex-end}.battle-controls button{font-size:10px}.battle-rewards{gap:5px}.battle-rewards>*{font-size:10px}.battle-projectile{font-size:28px}.battle-field-label{font-size:7px}.battle-lineups>div>div{max-height:40px}.battle-reserve{width:32px;height:32px;flex-basis:32px}} .battle-toolbar{display:flex;align-items:center;gap:8px}.battle-mute{display:grid;place-items:center;min-width:38px;min-height:38px;padding:7px;border:1px solid #8d794f;background:#233647;color:#efcf85;border-radius:3px}.battle-mute svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.battle-speaker-slash{display:none}.battle-mute[data-muted=true] .battle-speaker-slash{display:block}.battle-mute[data-muted=true] .battle-speaker-waves{display:none}.battle-mute[data-muted=true]{color:#a3b0bd;border-color:#506072} /* Idle energy: keep the resource flow readable alongside the existing pixel art. */ .energy-flow{display:flex;justify-content:space-between;gap:8px;font-size:.68rem;line-height:1.5;margin-top:5px;flex-wrap:wrap;color:var(--muted,#b6adcb)} .energy-flow b,.mobile-regen{color:#80e7ba}.mobile-regen{font-size:.65rem;white-space:nowrap} .fraud-energy-note{font-size:.9rem;line-height:1.5;margin:14px 0}.fraud-calculation{border-top:1px solid var(--line);margin-top:12px}.fraud-calculation p{margin:10px 0}.market-item-heading>.loot-glyph{width:64px;height:64px;flex-shrink:0}.night-risk{font-size:.9rem;line-height:1.5}.night-risk .pixel-icon{width:19px;height:19px}.energy-details p{margin:12px 0 0}.fraud-detail>.fraud-calculation{order:5} .fraud-flow{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;padding:14px 16px;margin:16px 0;background:#171b29;border:1px solid #39394f;border-radius:8px} .fraud-flow>div{display:flex;flex-direction:column;gap:5px}.fraud-flow span{font-size:.76rem;color:#b9b1cb}.fraud-flow strong{font-size:1.1rem;color:#80e7ba}.fraud-flow>div:nth-child(2) strong{color:#e9c577} .fraud-flow p{grid-column:1/-1;font-size:.78rem;line-height:1.6;margin:2px 0 0;color:#bfc4d7}.fraud-flow.is-deficit{border-color:#695233} .fraud-metrics dd small{display:block;font-weight:400;font-size:.7rem;color:#b9b1cb;margin-top:5px}.idle-explainer{font-size:.78rem;color:#b9b1cb;line-height:1.7}.idle-controls{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.fraud-next{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;margin:12px 0}.fraud-next p{margin:0;min-width:0}.fraud-next button{max-width:100%;overflow-wrap:anywhere} .fraud-timer small{display:block;font-size:.75rem;line-height:1.7;color:#c1b9d1}.fraud-timer.is-waiting{border-color:#9c7e48}.fraud-timer-compact .fraud-timer-name small{display:block;font-size:.64rem;color:#bfb6cf;margin-top:3px} .regen-dashboard{margin-bottom:20px}.regen-dashboard-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}.regen-dashboard-heading small{font-size:.66rem;letter-spacing:.08em;color:#b9b1cb}.regen-dashboard-heading h2{color:#80e7ba;font-size:1.6rem;margin:8px 0}.regen-dashboard-heading p,.regen-rules{font-size:.8rem;line-height:1.7;color:#b9b1cb}.effect-slots{border:1px solid #666079;border-radius:6px;padding:8px;font-size:.75rem;white-space:nowrap} .active-effects{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px;margin-top:14px}.active-effect{display:flex;gap:12px;align-items:center;background:#171b29;border-radius:6px;padding:10px}.active-effect>.atlas,.active-effect>.portrait{width:48px;height:56px;flex:0 0 48px}.active-effect>div{min-width:0;flex:1}.active-effect strong,.active-effect span{display:block;font-size:.78rem;line-height:1.6}.active-effect span{font-size:.7rem;color:#b9b1cb}.active-effect progress{width:100%;height:7px;margin-top:6px;accent-color:#80e7ba}.regen-empty{font-size:.8rem;color:#b9b1cb;line-height:1.7}.effect-duration{font-size:.7rem;color:#b9b1cb}.service-tradeoff,.medicine-tradeoff{font-size:.75rem;line-height:1.6;color:#edc786}.service-card .service-facts{flex-wrap:wrap}.service-card button{white-space:normal} @media(max-width:600px){.regen-dashboard-heading{align-items:flex-start;flex-direction:column}.regen-dashboard-heading h2{font-size:1.3rem}.active-effects{grid-template-columns:1fr}.fraud-flow{padding:12px}.mobile-vitals>span{flex-wrap:wrap}.mobile-regen{flex-basis:100%}.idle-controls>*{flex:1}.regen-dashboard{padding:16px}} .battle-hud label{color:#324b50}.battle-hud label b{color:#243f45} .active-effect{display:grid;grid-template-columns:48px minmax(0,1fr)}.active-effect>button{grid-column:2;justify-self:start;padding:5px 8px;min-height:30px;font-size:.72rem}.fraud-power-note{font-size:.78rem;line-height:1.7;color:var(--muted)} @media(max-width:760px){.fraud-detail{display:flex;flex-direction:column}.fraud-detail>.fraud-overview{order:0}.fraud-detail>.fraud-lock{order:1}.fraud-detail>.fraud-metrics{order:2}.fraud-detail>.fraud-idle-controls{order:3}.fraud-detail>.fraud-active-controls{order:1}.fraud-detail>.fraud-drops{order:4}.fraud-detail>.fraud-power-note{order:5}.fraud-idle-controls .fraud-flow{margin-top:0}.fraud-idle-controls .idle-explainer{margin-bottom:10px}.fraud-idle-controls .fraud-flow p{font-size:.76rem}} .battle-header h2{margin:0;font-size:21px;letter-spacing:0}.battle-header{padding:14px 24px}.battle-scene{height:400px}.battle-controls{justify-content:flex-end}.battle-narrative,.battle-result{min-height:105px;padding-top:12px;padding-bottom:12px}.battle-lineups{padding-bottom:12px}.battle-lineups small{letter-spacing:0;font-size:11px}.battle-attributes{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:9px 0 7px!important;padding:0!important}.battle-attributes>div{display:block!important;min-width:0}.battle-attributes dt{font-size:10px;color:#3b5152;font-weight:400}.battle-attributes dd{font-size:13px;font-weight:700;margin:3px 0 0;color:#193138}.battle-loadout{position:relative;display:flex!important;gap:5px;align-items:center;justify-content:flex-start!important}.battle-equipped-item,.battle-empty-item{display:block;margin:0;padding:0;width:34px;height:32px;flex-shrink:0;border:1px solid var(--item-color,#92a391);border-radius:3px;background:#20363b;color:#a5b4a7}.battle-empty-item{display:grid;place-items:center;border-style:dashed;background:#d4d8be;color:#687d6f}.battle-equipped-item>summary{list-style:none;display:block;cursor:pointer;margin:0!important;width:100%;height:100%;padding:0!important}.battle-equipped-item>summary::-webkit-details-marker{display:none}.battle-equipped-item .sprite.battle-item-art{display:block;width:100%;height:100%}.battle-item-detail{position:absolute;left:0;bottom:38px;z-index:8;display:grid;gap:4px;width:100%;min-width:140px;padding:9px;background:#18313b;border:1px solid #9eac90;border-radius:4px;box-shadow:0 3px 12px #0008;color:#f4edd7;font-size:11px;line-height:1.4}.battle-item-detail strong{font-size:11px;color:#f4edd7}.battle-item-detail span,.battle-item-detail small{display:block;font-size:10px;color:#d3dcca}.battle-item-detail small{white-space:normal}.battle-hud{overflow:visible}.battle-header>div:first-child{min-width:0} @media(max-width:600px){.battle-header{padding:12px 14px}.battle-header h2{font-size:16px;line-height:1.3}.battle-scene{height:360px}.battle-hud{width:49%;padding:8px}.battle-hud strong{font-size:10px}.battle-hud>div{gap:4px}.battle-type{font-size:7px;padding:3px}.battle-attributes{gap:3px;margin:7px 0 6px!important}.battle-attributes dt{font-size:8px}.battle-attributes dd{font-size:11px;margin-top:2px}.battle-equipped-item,.battle-empty-item{width:29px;height:27px}.battle-loadout{gap:4px}.battle-item-detail{bottom:32px;font-size:10px;min-width:0}.battle-hud-defense{left:9px;top:12px}.battle-hud-attack{right:9px;bottom:14px}.battle-defense{top:24px;right:0}.battle-ground-defense{top:40%;right:5%}.battle-attack{left:0;bottom:4px}.battle-narrative,.battle-result{min-height:94px;padding:10px 14px}.battle-narrative h3,.battle-result h3{font-size:16px;margin:4px 0 7px}.battle-narrative p{font-size:11px}.battle-lineups{padding:9px 14px}.battle-lineups small{font-size:10px}.battle-controls{flex-direction:row;padding:9px 14px}.battle-controls>div{margin-left:auto}.battle-countdown{padding:7px 9px;font-size:11px}.battle-toolbar{gap:6px}.battle-type-guide,.battle-field-label{display:none}} .business-attacker{display:flex;align-items:center;gap:10px;margin:10px 0;padding:10px;border:1px solid #83564f;border-radius:6px;background:#241c20}.business-attacker>.portrait{width:42px;height:42px;flex-shrink:0}.business-attacker>div{min-width:0}.business-attacker small,.business-attacker strong,.business-attacker time{display:block}.business-attacker strong{margin:3px 0;overflow-wrap:anywhere}.business-attacker small,.business-attacker time{font-size:13px;color:var(--muted)} /* Compact guided rehearsal: only the precise control receives input. */ #tutorial-overlay{position:fixed;inset:0;z-index:1600;pointer-events:none} .tutorial-shade{position:fixed;border-radius:8px;box-shadow:0 0 0 200vmax #00000038;pointer-events:none} .tutorial-ring{position:fixed;border:2px solid #ffd36b;border-radius:8px;box-shadow:0 0 0 3px #382842bb,0 0 18px #ffd36b55;pointer-events:none} .in-tutorial{--tutorial-action:#ff63d6} /* Item hover/focus keeps its feedback without shifting the guide's anchor. */ .in-tutorial .item-cell{transform:translateY(0)} .tutorial-ring.is-interactive{border-color:var(--tutorial-action);border-width:3px;animation:tutorial-target-pulse 1.35s ease-in-out infinite} .in-tutorial [data-tutorial-target],#tutorial-overlay button{outline:2px solid var(--tutorial-action);outline-offset:2px;animation:tutorial-target-pulse 1.35s ease-in-out infinite} .in-tutorial button[data-tutorial-target],#tutorial-overlay button{background:var(--tutorial-action);border-color:#ffc0ef;color:#211020} .in-tutorial button[data-tutorial-target]:hover:not(:disabled),#tutorial-overlay button:hover:not(:disabled){background:#ff9be7;border-color:#ffe2f8} .in-tutorial [data-tutorial-target]:focus-visible,#tutorial-overlay button:focus-visible{outline:3px solid #fff;outline-offset:4px} @keyframes tutorial-target-pulse{0%,100%{box-shadow:0 0 0 0 #ff63d680,0 0 10px #ff63d64d}55%{box-shadow:0 0 0 var(--tutorial-pulse-size,7px) #ff63d600,0 0 24px #ff63d6b3}} #tutorial-overlay button{--tutorial-pulse-size:2px;outline-width:1px;outline-offset:1px} #tutorial-overlay button:focus-visible{outline-width:2px;outline-offset:2px} .tutorial-guide{position:fixed;display:flex;width:min(350px,calc(100vw - 24px));pointer-events:auto;color:#f8eedc} .tutorial-bubble{flex:1;min-width:0;padding:10px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;border:1px solid #cba857;border-radius:10px;background:#211a2af5;box-shadow:0 5px 22px #0009;font:14px/1.45 system-ui,sans-serif;max-height:min(440px,calc(100dvh - 24px));overflow:hidden} .tutorial-speaker{display:flex;align-items:center;gap:9px;min-width:0} .tutorial-voro{display:block;position:static;flex:none;width:56px;height:56px;object-fit:contain;image-rendering:auto} .tutorial-speaker>div{min-width:0}.tutorial-speaker strong{font:700 11px/1.2 system-ui,sans-serif;color:#ffe1a0}.tutorial-bubble .tutorial-speaker h2{margin:2px 0 0;font-size:14px} .tutorial-body{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}.tutorial-body p:last-child{margin-bottom:0} .tutorial-footer{display:flex;align-items:center;column-gap:12px;row-gap:8px;flex-wrap:wrap;min-width:0;margin-top:10px;padding-top:2px}.tutorial-footer .tutorial-meta{flex:1;min-width:0;margin:0!important;gap:10px}.tutorial-bubble .tutorial-footer>button{width:auto;min-height:32px;padding:5px 8px;font-size:12px}.tutorial-footer .tutorial-page{font-size:10px}.tutorial-rules{margin-top:7px;font-size:12px}.tutorial-rules summary{cursor:pointer;min-height:36px;align-content:center;color:#cce8ff}.tutorial-rules .tutorial-facts{margin:5px 0}.tutorial-rules p{font-size:12px} #tutorial-overlay .tutorial-footer .tutorial-step{font-size:10px;padding:2px 5px}#tutorial-overlay .tutorial-footer .tutorial-exit{font-size:11px;min-height:32px;padding:3px 6px} .tutorial-complete .tutorial-bubble{max-height:240px} .tutorial-bubble h2{font:700 16px/1.25 system-ui,sans-serif;margin:5px 0 7px;color:#ffe1a0} .tutorial-bubble p{margin:0 0 10px;font-size:14px;line-height:1.45} .tutorial-bubble small{font-size:11px;color:#cab8d1} .tutorial-bubble button{min-height:44px;width:100%;white-space:normal;font-size:13px} .tutorial-click{display:block;font-weight:700;color:#ffe1a0;font-size:12px} .tutorial-error:empty{display:none}.tutorial-error{color:#ffbcb5} .tutorial-meta{display:flex;align-items:center;justify-content:space-between;gap:8px} #tutorial-overlay .tutorial-step{display:inline-block;padding:2px 8px;border:1px solid #cba85799;border-radius:999px;background:#ffd36b1f;color:#ffe1a0;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap} #tutorial-overlay .tutorial-quiet{background:transparent;border:1px solid #8a7695;color:#f3e6f7;outline:none;animation:none} #tutorial-overlay .tutorial-quiet:hover:not(:disabled){background:#ffffff14;border-color:#cab8d1} #tutorial-overlay .tutorial-quiet:focus-visible{outline:3px solid #fff;outline-offset:2px} #tutorial-overlay .tutorial-exit{flex:none;width:auto;min-height:32px;padding:4px 10px;font-size:12px} .tutorial-bubble [data-tutorial-stay]{margin-bottom:8px} .tutorial-bubble .tutorial-meta{margin:10px 0 8px} .tutorial-faction-content .tutorial-meta{margin:16px 0 12px} .tutorial-terms{display:grid;gap:5px;margin:0 0 10px;padding:0;list-style:none} /* Game names, resources and attributes inside tutorial text. */ .tutorial-term{color:#7cc7ff;font-weight:650} .tutorial-facts{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;margin:0 0 10px;padding:8px 10px;border:1px solid #ffffff17;border-radius:8px;background:#ffffff0b;font-size:13px} .tutorial-facts div{display:grid;grid-template-columns:64px minmax(0,1fr);gap:8px} .tutorial-facts dt{color:#cab8d1;font-size:12px;font-weight:700;line-height:1.45} .tutorial-facts dd{margin:0;color:#f8eedc;font-size:13px;line-height:1.4} .tutorial-bubble .tutorial-action{margin:0;font-weight:600;color:#fff} .tutorial-bubble .tutorial-click{margin-top:8px} .in-tutorial #toasts,.in-tutorial #item-tooltip{visibility:hidden} @media(max-width:600px),(max-height:500px){.tutorial-guide{width:min(300px,calc(100vw - 20px))}.tutorial-bubble{padding:8px;gap:6px;max-height:min(232px,38dvh)}.tutorial-voro{width:36px;height:36px}.tutorial-bubble .tutorial-speaker h2{font-size:12px}.tutorial-speaker strong{font-size:10px}.tutorial-bubble p{font-size:12px;line-height:1.4}.tutorial-facts{font-size:11px}.tutorial-facts dd{font-size:11px}.tutorial-facts dt{font-size:10px}.tutorial-bubble .tutorial-click{font-size:10px;margin-top:5px}.tutorial-speaker{gap:7px}.tutorial-footer{column-gap:10px;row-gap:8px}#tutorial-overlay .tutorial-footer .tutorial-exit{font-size:11px;min-height:36px;padding:4px 6px}.tutorial-rules summary{font-size:11px}.tutorial-complete .tutorial-bubble{max-height:min(232px,38dvh)}} @media(max-width:600px),(max-height:500px){#tutorial-overlay .tutorial-bubble{padding:8px}.tutorial-bubble .tutorial-body p{font-size:12px;line-height:1.4}.tutorial-bubble .tutorial-footer>button{min-height:36px;font-size:12px;padding:4px 8px}} /* Later care qualities remain inspectable without crowding the current offers. */ .care-catalog{margin:12px 0 20px;border-top:1px solid var(--line);padding-top:10px}.care-catalog>summary{cursor:pointer;color:var(--muted);padding:8px 0;line-height:1.6}.care-catalog[open]>summary{margin-bottom:10px}.care-level{color:var(--muted);font-size:.75rem;line-height:1.6}.medicine-card .medicine-tradeoff{display:block} .pharmacy-heading{margin:22px 0 12px}.medicine-target{color:var(--teal)}.medicine-card p{overflow-wrap:anywhere}.active-effect{flex-wrap:wrap}.active-effect>button{flex-basis:100%;min-height:44px}.active-effect small{color:var(--muted)} .service-blocked{margin:0 0 12px;padding:12px;border:1px solid var(--line);border-radius:6px}.service-blocked p{margin:0 0 8px}.pharmacy-link{white-space:normal;min-height:44px}.medicine-card:focus-within{outline:2px solid var(--teal);outline-offset:3px} .retaliation-action{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-top:8px}.retaliation-action[hidden]{display:none}.retaliation-action small{font-size:12px}.attack-member input:disabled:not(:checked){opacity:.5} .combat-order{list-style:none;padding:0;margin:10px 0 16px;display:grid;gap:6px}.combat-order li{display:flex;align-items:center;gap:9px;padding:7px;background:#15212b;border:1px solid var(--line);border-radius:6px;min-width:0}.combat-order .portrait{width:36px;height:36px;flex-shrink:0}.combat-order strong{min-width:0;overflow-wrap:anywhere;font-size:14px}.order-position{color:var(--gold);min-width:16px;font-weight:700}.order-buttons{display:flex;gap:5px;margin-left:auto;flex-shrink:0}.order-move{min-height:36px;min-width:36px;padding:5px 9px}.defense-order{margin:10px 0}.defense-order summary{cursor:pointer;font-size:14px}.defense-order .combat-order{margin-bottom:4px}.battle-reserve.is-active{outline:2px solid #efc66e;outline-offset:1px}.battle-reserve.is-defeated{opacity:.3;filter:grayscale(1)}.battle-loading{position:absolute;z-index:10;inset:0;display:grid;place-items:center;background:#122132ee;color:#f4dfb0;margin:0;font-weight:700}.battle-playback{position:relative}.battle-log{margin-top:12px;font-size:13px}.battle-log summary{cursor:pointer;min-height:36px;align-content:center}.battle-log ol{max-height:200px;overflow:auto;line-height:1.6;padding-left:23px}.battle-log li{padding:4px 0}.battle-combatant.is-entering .battle-fighter-art{animation:battle-enter .6s ease-out both}.battle-damage{animation-delay:.25s}.battle-hud progress::-webkit-progress-value{transition:none} @keyframes battle-enter{from{opacity:0;transform:translateY(25px) scale(.65)}to{opacity:1;transform:translateY(0) scale(1)}} @media(max-width:600px){.combat-order li{gap:6px;padding:6px}.combat-order strong{font-size:12px}.combat-order .portrait{width:30px;height:30px}.order-move{min-height:40px;min-width:36px}.battle-log{font-size:11px}} /* Loot boxes, session earnings and wanted flow. */ .box-glyph{width:56px;height:56px;flex:none;image-rendering:auto;filter:drop-shadow(0 3px 0 #080d16)} .fraud-metrics .metric-box dt{display:flex;align-items:center;gap:7px}.metric-box .box-glyph{width:26px;height:26px}.metric-wanted dd{color:#ffb178} .fraud-run-loot{display:grid;grid-template-columns:1.2fr 1fr;gap:10px;margin:12px 0}.fraud-run-loot>span,.fraud-run-loot>button{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid #57857966;border-radius:6px;background:#101f25;text-align:left;min-width:0;color:var(--teal)}.fraud-run-loot small,.fraud-run-loot strong{display:block}.fraud-run-loot small{font-size:.75rem;color:var(--muted);margin-bottom:3px}.fraud-run-loot .box-glyph{width:36px;height:36px}.fraud-run-loot strong{font-size:1.1rem;overflow-wrap:anywhere}.wanted-flow{line-height:1.55}.wanted-details{font-size:.75rem;color:var(--muted);margin-top:6px}.wanted-details summary{cursor:pointer;min-height:30px;align-content:center}.wanted-details p{margin:8px 0}.wanted-details button{font-size:.75rem;min-height:36px}.mobile-wanted-flow{display:block;font-size:.6rem;color:#ffb178;grid-column:1/-1} .inventory-boxes{margin:22px 0}.inventory-boxes h2{margin-bottom:8px}.box-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.box-card{display:flex;gap:12px;align-items:flex-start;padding:16px}.box-card>div{min-width:0;flex:1}.box-card>.box-glyph{width:68px;height:68px}.box-card h3{font-size:1rem;margin-bottom:5px}.box-card small{display:block;color:var(--muted);margin-bottom:10px}.box-card button{min-height:44px;width:100%}.box-count{color:var(--gold);white-space:nowrap}.box-card details{font-size:.8rem;margin-top:8px}.box-card summary{min-height:36px;align-content:center;cursor:pointer}.box-card .drop-odds{display:grid;grid-template-columns:1fr;gap:6px}.box-card .drop-odds>span{display:flex;justify-content:space-between} .box-dialog{width:min(580px,calc(100vw - 24px));padding:0;overflow:hidden;border:1px solid #ba9359;background:#0d1423;box-shadow:0 0 70px #b787352a}.box-celebration{padding:22px;background:radial-gradient(ellipse at 50% 35%,#353050 0,transparent 65%);text-align:center;position:relative}.box-opening-top{display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--muted);font-size:.8rem}.box-opening-top button{min-height:44px;padding:7px 10px;font-size:.75rem}.box-celebration h2{color:var(--gold);font-size:1.8rem;margin:22px 0 0}.box-stage{height:230px;position:relative;display:grid;place-items:center;isolation:isolate;overflow:hidden}.box-prize[hidden],.box-skip[hidden]{display:none}.box-prize{position:relative;z-index:2}.box-prize .item-summary{justify-content:center;flex-direction:column;gap:10px;text-align:center}.box-prize .loot-glyph{width:100px;height:100px}.box-prize h3{font-size:1.4rem;color:var(--rarity)}.box-prize .stats-inline,.box-prize .actions{justify-content:center;flex-wrap:wrap}.box-prize .item-multiplier{display:none}.box-prize .positive{margin:16px 0}.box-prize .actions button{min-height:46px}.box-opening-status{color:var(--muted);font-size:.85rem;min-height:2.5em;margin:0}.box-skip{margin-top:12px;min-height:44px} .is-revealed .box-stage{height:85px}.box-animation{width:230px;height:230px;max-width:100%;image-rendering:auto}.is-revealed .box-animation{width:85px;height:85px} .inventory-upgrade{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:18px 0;border-color:#7355a2;background:linear-gradient(115deg,#211d37,#141c2c)}.inventory-upgrade h2{margin:0 0 8px;color:#dec2ff}.inventory-upgrade p{margin:0 0 7px;line-height:1.5}.inventory-upgrade small{color:var(--muted)}.inventory-upgrade>button{flex-shrink:0;min-height:44px}.item-upgrade-button{width:100%;margin-top:12px;border-color:#a880da}.upgrade-rarities{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.upgrade-rarities>span{display:flex;gap:10px;align-items:center;border:1px solid var(--rarity);color:var(--rarity);padding:7px 10px;border-radius:5px;font-size:.8rem}.upgrade-preview{display:flex;gap:16px;align-items:center;border:1px solid var(--rarity);background:#161b30;padding:16px;border-radius:7px;margin:15px 0}.upgrade-preview>.loot-glyph{width:80px;height:80px;flex-shrink:0}.upgrade-preview>div{min-width:0}.upgrade-preview h3{margin:0 0 8px;overflow-wrap:anywhere}.upgrade-preview p{margin:0 0 12px}.upgrade-preview strong{color:var(--rarity)}.upgrade-stat-comparison{display:flex;flex-wrap:wrap;gap:9px 15px;font-size:.8rem}.upgrade-stat-comparison>span{display:flex;align-items:center;gap:5px}.upgrade-stat-comparison b{white-space:nowrap;color:#d7efda}.upgrade-material-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:20px}.upgrade-material-heading h3{margin:0}.upgrade-material-heading button{min-height:44px;font-size:.8rem}.upgrade-selection-status{color:var(--gold);font-size:.85rem}.upgrade-material-grid .item-cell{position:relative}.upgrade-material-grid .item-cell.is-selected{outline:2px solid #e6c381;outline-offset:-4px;background:#383022}.upgrade-material-grid .is-selected::after{content:'';position:absolute;right:5px;top:3px;width:16px;height:16px;background:var(--gold);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}.upgrade-confirm{margin-top:18px;border-top:1px solid var(--line);padding-top:10px}.upgrade-confirm p{color:var(--muted);font-size:.8rem}.upgrade-confirm button{width:100%;min-height:46px;white-space:normal}.is-upgrade h2{font-size:1.6rem} @media(max-width:600px){.inventory-upgrade{align-items:stretch;flex-direction:column;gap:14px}.inventory-upgrade>button{width:100%}.upgrade-preview{padding:12px;gap:10px;align-items:flex-start}.upgrade-preview>.loot-glyph{width:54px;height:54px}.upgrade-stat-comparison{flex-direction:column;gap:8px}.upgrade-preview p{line-height:1.6}.upgrade-material-heading{align-items:stretch}.upgrade-material-heading button{width:100%}.is-upgrade h2{font-size:1.35rem}} @media(max-width:600px){.box-grid{grid-template-columns:1fr}.box-dialog{max-height:calc(100dvh - 24px);overflow-y:auto}.box-celebration{padding:16px}.box-stage{height:200px}.box-animation{width:200px;height:200px}.box-opening-top{font-size:.75rem}.fraud-run-loot{gap:7px}.fraud-run-loot>span,.fraud-run-loot>button{padding:8px}.fraud-run-loot small{font-size:.65rem}.fraud-run-loot strong{font-size:1rem}.box-prize .loot-stats{gap:8px}.box-prize .actions{display:grid;grid-template-columns:1fr 1fr}} @media(max-width:900px){.mobile-vitals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;text-align:left}.mobile-vitals>span{display:grid;grid-template-columns:16px 1fr;gap:4px;align-items:center}.mobile-vitals>span>b{grid-column:1/-1}.mobile-vitals .mobile-regen,.mobile-vitals .mobile-wanted-flow{grid-column:1/-1;margin-left:0;font-size:.6rem;line-height:1.3}} .box-prize .rarity-label{display:none}.is-revealed h2{color:var(--rarity)}.is-revealed .box-opening-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap} .box-inventory-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:8px}.box-inventory-heading h2{margin:0}.box-inventory-heading button{min-height:44px}.box-dialog{max-height:calc(100dvh - 24px);overflow-y:auto}.is-batch.is-revealed h2{color:var(--gold)}.is-batch.is-revealed .box-opening-status{position:static;width:auto;height:auto;margin:12px 0;overflow:visible;clip-path:none;white-space:normal}.box-rewards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-height:38dvh;overflow-y:auto;padding:5px;scrollbar-width:thin}.box-reward{min-width:0;border:1px solid var(--rarity);border-radius:7px;padding:12px;background:#111b28;animation:box-item-reveal .4s ease-out both}.box-reward .item-summary{margin:0}.box-reward .loot-glyph{width:56px;height:56px}.box-reward h3{font-size:1rem;overflow-wrap:anywhere}.box-reward .rarity-label{display:inline;font-size:.75rem}.box-reward>p{font-size:.8rem;line-height:1.5;color:var(--muted)}.box-reward .loot-stats{font-size:.8rem;margin-bottom:0}.box-opening-complete[hidden]{display:none} @keyframes box-item-reveal{from{opacity:0;transform:translateY(14px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}} @media(max-width:600px){.box-inventory-heading button{width:100%}.box-rewards{grid-template-columns:1fr;max-height:34dvh}.is-batch.is-revealed .box-stage{height:60px}.is-batch.is-revealed .box-animation{width:60px;height:60px}} .fraud-outcome-effect{position:fixed;z-index:75;opacity:.8;pointer-events:none;image-rendering:auto} .fraud-timer{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;min-height:280px;background:#151b22} .fraud-scene-background{position:absolute;inset:0;width:100%;height:calc(100% - 94px);z-index:-2;pointer-events:none;image-rendering:auto} .fraud-timer::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#0b111ce8 0%,#0b111c80 22%,#0b111c1a 43%,#0b111c66 59%,#0b111cf0 85%)} .fraud-timer .fraud-run-loot{margin:88px 0 12px;margin-top:auto;padding-top:72px} .fraud-timer .fraud-run-loot>span,.fraud-timer .fraud-run-loot>button{background:#0d1b25e8;border-color:#80b7aa66} .fraud-timer>progress{flex:none;width:100%} .fraud-timer-heading,.fraud-timer>p,.fraud-timer>small{text-shadow:0 1px 3px #000} .fraud-timer.is-waiting .fraud-scene-background{filter:saturate(.65);opacity:.75} @media(max-width:600px){.fraud-timer{min-height:290px}.fraud-timer .fraud-run-loot{padding-top:84px}} .danger-button{color:var(--red);border-color:#965b5b;background:#37252b}.danger-button:hover:not(:disabled){background:#513038;border-color:var(--red)} .selection-delete{margin-top:12px}.character-delete-option{border-top:1px solid var(--line);margin-top:24px;padding-top:20px} .dialog[data-modal="deleteCharacter"] h2{overflow-wrap:anywhere} .highscores-filter{display:flex;align-items:center;gap:12px;margin-bottom:18px}.highscores-filter label{font-weight:600}.highscores-filter select{min-width:0;max-width:100%;min-height:44px}.season-prizes{margin-bottom:20px}.season-prizes h2{margin-top:0}.season-prizes p{color:var(--muted);font-size:.9rem}.season-prizes summary{cursor:pointer}.season-prizes ol{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px;font-variant-numeric:tabular-nums}.season-prizes li{display:flex;justify-content:space-between;gap:12px}.season-prizes strong,.highscore-prize{color:var(--gold)}.highscores-table thead small{display:block;font-size:.7rem;font-weight:400}.highscore-closed{color:var(--muted);line-height:1.6;margin-bottom:20px} @media(max-width:700px){.highscores-filter{align-items:stretch;flex-direction:column;gap:6px}.highscores-table{table-layout:fixed}.highscores-table th:first-child{width:16%}.highscores-table th:nth-child(2){width:34%}.highscores-table th:nth-child(3){width:15%}.highscores-table th:nth-child(4){width:12%}.highscores-table th:last-child{width:23%;white-space:normal}.highscores-table thead small{font-size:.6rem}.highscores-table td{overflow-wrap:anywhere}.highscore-player{align-items:flex-start}.highscore-player .sprite.portrait{width:24px;height:24px}.season-prizes ol{gap:8px 16px}} .highscores-pagination{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:14px 0}.highscores-count{margin:0;color:var(--muted);font-size:.85rem;font-variant-numeric:tabular-nums}.highscores-page-controls{display:flex;align-items:center;gap:10px}.highscores-page-controls label{display:flex;align-items:center;gap:8px;font-size:.85rem}.highscores-page-controls button,.highscores-page-controls select{min-height:44px}.highscores-page-controls select{width:auto;min-width:0;max-width:130px}.highscores-page-controls button:focus-visible,.highscores-page-controls select:focus-visible{outline:2px solid var(--gold);outline-offset:3px} @media(max-width:700px){.highscores-pagination{gap:8px}.highscores-count{width:100%;text-align:center}.highscores-page-controls{width:100%;justify-content:space-between;gap:6px}.highscores-page-controls label{flex-direction:column;gap:3px}.highscores-page-controls button{padding:10px 8px;font-size:.8rem}.highscores-page-controls select{max-width:100px}} @media(max-width:360px){.highscores-table thead th:first-child{padding-inline:2px;font-size:.7rem}} .highscores-filter{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));align-items:end;gap:12px} .highscores-field{display:flex;flex-direction:column;gap:6px;min-width:0}.highscores-field select{width:100%} .highscore-rule{margin-bottom:8px}.highscore-range,.highscore-note{color:var(--muted);font-size:.85rem;line-height:1.6}.highscore-note{margin-top:12px} .highscore-war-mobile{display:none}.highscore-value{font-weight:600} @media(max-width:700px){.highscores-filter{grid-template-columns:1fr}.highscores-activity th:first-child{width:16%}.highscores-activity th:nth-child(2){width:56%}.highscores-activity th:last-child{width:28%}.highscores-war .highscore-war-extra{display:none}.highscores-war th:first-child{width:14%}.highscores-war th:nth-child(2){width:43%}.highscores-war th:nth-child(3){width:43%}.highscores-activity thead th{white-space:normal}.highscore-war-mobile{display:block;margin-top:5px;color:var(--muted);font-size:.7rem;line-height:1.7}.highscore-war-mobile span{display:block}} #delete-character-form{display:grid;gap:12px;margin-top:20px}#delete-character-form input{width:100%;min-width:0;min-height:44px}#delete-character-form p{margin:0}.delete-character-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px;margin-top:8px}.delete-character-actions button{min-height:44px} /* Profile collection uses the same transparent frame and portrait geometry everywhere. */ .game-content .profile-heading{justify-content:flex-start;flex-wrap:nowrap;gap:14px} .profile-heading>.profile-portrait{width:88px;height:88px;flex:none} .profile-heading>div{flex:1;min-width:0;overflow-wrap:anywhere} .frame-collection{margin:20px 0 28px} .frame-collection>.section-head{align-items:center;gap:12px;flex-wrap:wrap} .frame-collection h2{margin:0 0 6px} .frame-collection .section-head p{margin:0;color:var(--muted);font-size:.85rem} .frame-wallet{display:flex;align-items:center;gap:7px;white-space:nowrap} .frame-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(166px,1fr));gap:12px} .frame-card{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0;padding:16px 10px;gap:8px} .frame-card.is-selected{border-color:var(--teal);box-shadow:inset 0 0 0 1px var(--teal)} .frame-card>.frame-preview{width:112px;height:112px;flex:none} .frame-card h3{font-size:.95rem;margin:0;min-height:2.5em;display:grid;place-items:center} .frame-card button{width:100%;margin-top:auto;min-height:44px;font-size:.8rem} .cosmetic-unlock{display:inline-flex;align-items:center;justify-content:center;gap:7px} .cosmetic-unlock>.pixel-icon{margin:0;flex:none} @media(max-width:600px){ .frame-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .frame-card{padding:12px 8px} .frame-card>.frame-preview{width:100px;height:100px} .profile-heading>.profile-portrait{width:72px;height:72px} .frame-card h3{font-size:.85rem} } .upgrade-dialog .upgrade-material-grid{max-height:28dvh}.upgrade-dialog .upgrade-confirm{padding-top:14px}.upgrade-dialog .upgrade-selection-status{margin:10px 0}.upgrade-dialog .upgrade-preview{margin-bottom:12px} .upgrade-batch-results{grid-template-columns:repeat(4,minmax(0,1fr));max-height:30dvh;overflow-y:auto;padding:5px;scrollbar-width:thin}.inventory-upgrade>.actions{flex-wrap:wrap;justify-content:flex-end}.inventory-upgrade>.actions button{min-height:44px;white-space:normal} @media(max-width:600px){.upgrade-batch-results{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){.upgrade-dialog .upgrade-material-grid{max-height:23dvh}.upgrade-dialog .upgrade-preview{padding:10px}.upgrade-dialog .upgrade-preview h3{font-size:.95rem}.upgrade-dialog .upgrade-preview p{font-size:.8rem;margin-bottom:8px}.upgrade-dialog .upgrade-stat-comparison{gap:5px}.upgrade-dialog .upgrade-material-heading{margin-top:14px}.upgrade-dialog #upgrade-cost{font-size:.8rem;line-height:1.5}.upgrade-dialog .upgrade-confirm{margin-top:12px}} .upgrade-material-stats{font-size:.65rem;line-height:1.4;color:#d7efda;overflow-wrap:anywhere}.upgrade-material-grid .item-cell{gap:4px}.upgrade-material-grid .loot-glyph{width:38px;height:38px} .upgrade-modes{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}.upgrade-modes button{min-height:44px;flex:1;white-space:normal}.upgrade-modes [aria-pressed="true"]{border-color:var(--gold);color:var(--gold)}.inventory-upgrade>.actions{flex-shrink:0;max-width:250px}.inventory-upgrade>.actions button{width:100%;white-space:normal;min-height:44px}.level-upgrade-odds{display:grid;gap:8px;margin:16px 0}.level-upgrade-odds>div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 14px;padding:10px;border:1px solid var(--rarity);border-radius:5px;font-size:.8rem}.level-upgrade-odds strong{color:var(--rarity)}.level-upgrade-odds span{color:var(--muted)} @media(max-width:600px){.inventory-upgrade>.actions{max-width:none;width:100%}.level-upgrade-odds>div{flex-direction:column}} .upgrade-consumed-grid{grid-template-columns:repeat(4,minmax(0,1fr));max-height:25dvh;overflow:auto;scrollbar-width:thin;padding:4px;gap:7px} .upgrade-consumed-item{cursor:default;gap:4px;padding:8px;min-width:0} .upgrade-consumed-item .loot-glyph{width:32px;height:32px} .upgrade-consumed-item .item-cell-name{white-space:normal;overflow:visible;overflow-wrap:anywhere} .upgrade-consumed-base{border-color:var(--gold)} .upgrade-material-picker{margin-top:12px;border-top:1px solid var(--line);padding-top:10px} .upgrade-material-picker>summary{cursor:pointer;color:var(--text);font-size:.9rem;min-height:32px} .upgrade-material-picker .upgrade-material-heading{margin:0 0 10px;justify-content:flex-end} .upgrade-consumed-grid:focus-visible{outline:2px solid var(--gold);outline-offset:2px} @media(max-width:600px){ .upgrade-consumed-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:23dvh} .upgrade-consumed-item .item-cell-name{font-size:.75rem} .upgrade-material-picker>summary{min-height:44px;padding:10px 0} .upgrade-dialog .upgrade-material-picker .upgrade-material-heading{margin:0 0 10px} } .profile-tabs{margin:22px 0;display:flex;gap:10px} .purchase-quantity{display:flex;align-items:center;flex-wrap:wrap;gap:4px;max-width:100%;margin:0 0 12px} .purchase-quantity>span{color:var(--muted);font-size:14px;margin-right:5px} .purchase-quantity button{min-width:36px;min-height:36px;padding:5px 9px;font-size:14px;line-height:20px} .purchase-quantity button.selected{border-color:var(--teal);color:var(--teal);background:#1a3438} .purchase-dialog{width:min(100%,480px)} .purchase-dialog h2{padding-right:20px;overflow-wrap:anywhere} .purchase-dialog .purchase-quantity{margin:20px 0} .purchase-dialog .purchase-quantity button{min-width:44px;min-height:44px} .purchase-totals{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin:20px 0} .purchase-totals>div{display:flex;justify-content:space-between;align-items:baseline;gap:20px} .purchase-totals dt{color:var(--muted)} .purchase-totals dd{margin:0;text-align:right;font-weight:600;overflow-wrap:anywhere;min-width:0} .purchase-dialog .purchase-balance{margin:16px 0 24px} .purchase-actions{display:grid;grid-template-columns:auto auto;justify-content:end} .purchase-actions>[data-purchase-confirm]{grid-column:1;grid-row:1} .purchase-actions>button:last-child{grid-column:2;grid-row:1} .purchase-actions>.unlock-link{grid-column:1/-1;grid-row:2;justify-self:end} .purchase-actions button{min-height:44px} .business-heading{flex-wrap:wrap;align-items:center} .business-heading .purchase-quantity{margin:0} .purchase-balance{margin:7px 0 0;font-size:14px;line-height:1.5;color:var(--muted);overflow-wrap:anywhere;font-variant-numeric:tabular-nums} .purchase-balance.negative{color:var(--red)} .investment-preview{flex-basis:100%;text-align:right;font-variant-numeric:tabular-nums} .investment-preview .purchase-balance,.investment-preview .purchase-upkeep{font-size:14px;line-height:1.5;margin:0} .purchase-upkeep{color:var(--muted)} .purchase-upkeep strong{color:var(--text);font-weight:600} .avatar-attributes .purchase-quantity{margin-bottom:9px;gap:3px} .avatar-attributes .purchase-quantity>span{flex:1;margin-right:2px} .avatar-attributes .purchase-quantity button{min-width:30px;min-height:32px;padding:4px 6px} .avatar-attributes .purchase-balance{margin:0 0 10px;font-size:12px} .avatar-attributes .attribute-price{flex-wrap:wrap;font-size:13px;margin-bottom:2px} .attributes .purchase-balance{margin-bottom:0} @media(max-width:700px){ .purchase-quantity button,.player-dialog .avatar-attributes .purchase-quantity button{min-width:44px;min-height:44px;padding:8px 10px} .business-heading{gap:10px} .business-heading .purchase-quantity{width:100%} .investment-preview{text-align:left} .player-dialog .avatar-attributes .purchase-quantity>span{flex:1} .player-dialog .avatar-attributes .purchase-balance{font-size:14px} } .profile-tabs button{min-height:44px;flex:0 1 170px} .profile-shop-heading{gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:18px} .profile-shop-heading p{margin:0;font-size:.85rem;color:var(--muted)} .avatar-collection{margin:20px 0 30px} .avatar-collection>h2{margin-bottom:16px} .profile-shop .frame-card{scroll-margin-top:16px} .coin-utilities{margin:30px 0}.coin-utilities>h2{margin:28px 0 12px}.utility-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px;margin:18px 0 28px}.utility-card{display:flex;flex-direction:column;align-items:stretch;gap:12px;min-width:0}.utility-card h3{margin:0;color:var(--gold);font-size:1.05rem}.utility-card p{margin:0;line-height:1.6;font-size:.9rem}.utility-card form{display:grid;gap:12px;min-width:0}.utility-card label{display:grid;gap:7px;font-size:.85rem}.utility-card input,.utility-card select{width:100%;min-width:0;max-width:100%;min-height:44px}.utility-card button{white-space:normal;min-height:44px;overflow-wrap:anywhere}.utility-card>button:last-child{margin-top:auto}.utility-price{display:flex;flex-direction:column;gap:2px;color:var(--gold)}.utility-price small{color:var(--muted);font-size:.78rem}.utility-limit{color:var(--teal);font-size:.82rem}.utility-locked{color:var(--muted)}.respec-fields{border:0;padding:0;display:grid;gap:8px;min-width:0}.respec-fields legend{margin-bottom:12px;font-size:.85rem}.respec-fields label{grid-template-columns:minmax(0,1fr) minmax(70px,100px);align-items:center}.utility-context{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0;max-width:100%}.utility-context small{display:block;flex-basis:100%;color:var(--muted);font-size:.78rem}.agency-profile{margin:20px 0}.agency-profile h2{margin-bottom:14px}.agency-profile>button{margin-top:14px}.agency-scene{position:relative;isolation:isolate;width:100%;max-width:520px;aspect-ratio:2;overflow:hidden;border:3px solid #72614b;border-radius:6px;background:#343044;margin:16px 0}.agency-background{display:block;width:100%;height:100%;object-fit:cover}.agency-decoration{position:absolute;display:block;object-fit:contain;image-rendering:auto}.agency-decoration-desk{left:14%;bottom:4%;width:44%;z-index:2}.agency-decoration-safe{left:64%;top:44%;width:14%}.agency-decoration-painting{left:46%;top:3%;width:19%}.utility-art{display:block;width:104px;height:88px;object-fit:contain;align-self:center;image-rendering:auto}.agency-owner{position:absolute;right:1%;bottom:5%;width:24%;height:62%;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}.agency-owner .sprite.agency-avatar{width:100%;height:auto;max-height:100%;object-fit:contain}.decoration-art{width:96px;height:72px;align-self:center;image-rendering:auto}.decoration-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}.sticker-previews{display:flex;justify-content:center;gap:4px}.mastro-sticker{display:block;width:128px;max-width:100%;height:auto}.sticker-previews .mastro-sticker{width:32%;max-width:100px}.chat-stickers{margin-top:14px}.chat-stickers summary{cursor:pointer;min-height:44px;display:list-item;padding:10px 0;color:var(--gold)}.chat-stickers>div{display:flex;flex-wrap:wrap;gap:10px}.sticker-send{display:flex;flex-direction:column;gap:5px;align-items:center;flex:1 1 100px;max-width:170px;font-size:.8rem}.sticker-send .mastro-sticker{width:96px}.room-message-body{overflow-wrap:anywhere}.room-message-body .mastro-sticker{width:148px;margin-top:8px} @media(max-width:600px){.utility-grid{grid-template-columns:minmax(0,1fr)}.utility-card{padding:16px}.utility-context{width:100%}.utility-context button{max-width:100%;white-space:normal}.agency-scene{margin:14px 0}.respec-fields label{grid-template-columns:minmax(0,1fr) 100px}.sticker-send{padding:8px;flex-basis:80px}} /* Actions keep their alignment when adjacent cards have different amounts of copy. */ button{display:inline-flex;align-items:center;justify-content:center} button>.pixel-icon{flex-shrink:0} .actions{align-items:stretch} .lawyer-card>div,.medicine-card>div,.service-card>div{display:flex;flex-direction:column;align-self:stretch;flex:1;min-width:0} .game-content .lawyer-card>div>button,.game-content .medicine-card>div>button,.game-content .service-card>div>button{margin-top:auto;align-self:stretch;min-height:44px} .game-content .attributes>.card{display:flex;flex-direction:column} .attributes [data-action="attribute"]{margin-top:auto;min-height:44px} .utility-card>form{display:flex;flex-direction:column;flex:1} .utility-card>form>button{margin-top:auto} .utility-card>button{margin-top:auto} .club-card{display:flex;flex-direction:column} .club-card>button{margin-top:auto} .faction-badge{display:inline-block;width:20px;height:22px;object-fit:contain;flex:none;vertical-align:middle}.player-name>.faction-badge{width:18px;height:21px}.faction-attack-block{display:block;flex-basis:100%;font-size:.75rem;color:var(--muted)} button[hidden]{display:none} .analytics-choice{position:fixed;top:auto;right:auto;margin:0;z-index:1800;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(640px,calc(100% - 24px));padding:18px;background:#15212b;color:#f3eee0;border:1px solid #73816d;border-radius:10px;box-shadow:0 6px 30px #0009;font-size:15px;line-height:1.5}.analytics-choice::backdrop{background:#0007}.analytics-choice p{margin:0 0 12px}.analytics-choice>div{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.analytics-choice button{min-height:44px}.analytics-choice a{color:#f3d797;text-decoration:underline}@media(max-width:600px){.analytics-choice{padding:14px;font-size:14px}.analytics-choice>div{display:grid;grid-template-columns:1fr 1fr}.analytics-choice button{font-size:13px;padding:8px}.analytics-choice a{grid-column:1/-1}} /* Fraud detail keeps Retorno | Energia | Custo in three columns at every width. */ .game-content .fraud-detail{container:fraud-detail/inline-size} /* Title and scheme description first, then the success chance under them. */ .fraud-overview{grid-template-areas:"art heading" "art chance";align-items:start;row-gap:10px} .fraud-overview>.fraud-scene{grid-area:art;align-self:center} .fraud-overview>.fraud-heading{grid-area:heading} .fraud-overview>.fraud-chance{grid-area:chance} .fraud-overview .fraud-heading h2{margin-bottom:4px} .fraud-heading>.fraud-current-badge,.fraud-heading>.fraud-current-link{margin:8px 0 0} .fraud-metrics .metric-box{grid-column:1 / -1} @container fraud-detail (max-width:380px){.fraud-overview{grid-template-areas:"heading heading" "art chance";grid-template-columns:80px minmax(0,1fr)}.fraud-overview>.fraud-chance{align-self:center}.fraud-metrics{gap:10px}.fraud-metrics dt{font-size:.8rem}.fraud-metrics dt .pixel-icon{width:16px;height:16px}.fraud-metrics dd{font-size:.88rem;overflow-wrap:break-word}.fraud-metrics .metric-return dd{font-size:.95rem}.fraud-metrics dd small{font-size:.68rem}} /* Level milestone offer: the same deadline follows the account on every screen. */ .side-nav button.coin-offer-nav,.mobile-header .coin-offer-nav{position:relative;display:flex;align-items:center;gap:9px;min-height:62px;width:100%;padding:10px;text-align:left;color:#ffe7b1;border:1px solid #ae783e;border-radius:8px;background:linear-gradient(115deg,#4a2a26,#33291e);box-shadow:inset 3px 0 #f4b65d;isolation:isolate;overflow:hidden} .coin-offer-nav:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,#ffd6811a 48%,transparent 65%);background-size:240% 100%;animation:coin-offer-shine 5s ease-in-out infinite} @keyframes coin-offer-shine{0%,20%{background-position:180% 0}80%,100%{background-position:-80% 0}} .coin-offer-nav:hover{border-color:#ffcd7c;background-color:#593d2a}.coin-offer-nav:focus-visible{outline:2px solid #ffe2a0;outline-offset:-3px} .coin-offer-icon{width:40px;height:40px;image-rendering:auto;object-fit:contain;flex-shrink:0}.coin-offer-nav>span{display:grid;gap:5px;min-width:0}.coin-offer-nav strong{font-size:.78rem;line-height:1.25}.coin-offer-nav small{font-size:.65rem;color:#e4c49d;white-space:nowrap}.coin-offer-nav time{font-variant-numeric:tabular-nums;color:#fff0cf} .coin-offer-nav[hidden],.coin-offer-active[hidden],.coin-offer-ended[hidden]{display:none!important} .dialog.coin-offer-dialog{width:min(480px,100%);padding:24px;border:1px solid #bc8647;background:radial-gradient(ellipse at 50% 22%,#5b382a66,transparent 60%),#192029;box-shadow:0 24px 90px #000b,0 0 45px #ce8c3220} .coin-offer-content{text-align:center}.coin-offer-content .premium-eyebrow{margin:0;color:#eac17f}.coin-offer-hero{position:relative;display:flex;justify-content:center;align-items:center;min-height:180px;margin:6px 0}.coin-offer-art{width:210px;height:180px;object-fit:contain;filter:drop-shadow(0 8px 18px #d38b2533);animation:coin-offer-float 3.6s ease-in-out infinite} @keyframes coin-offer-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}} .coin-offer-seal{position:absolute;top:12px;right:10px;z-index:1;display:grid;gap:2px;padding:12px 10px;border:1px solid #efa56a;border-radius:8px;transform:rotate(7deg);background:#8f412c;color:#fff2d4;font-size:1.6rem;font-weight:800;box-shadow:0 5px 12px #0005}.coin-offer-seal small{font-size:.65rem;font-weight:600} .coin-offer-content h2{margin:6px 0 8px;color:#ffe3a3;font-size:1.45rem}.coin-offer-pricing{display:grid;gap:5px;margin-bottom:18px}.coin-offer-pricing>span{font-size:.85rem;color:#b6ada2}.coin-offer-pricing>strong{font-size:2.4rem;line-height:1.2;color:#ffe5ac}.coin-offer-pricing>small{color:#b4d6b3;font-size:.8rem} .coin-offer-clock{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 14px;padding:12px 16px;border:1px solid #8c573c;border-radius:8px;background:#39251f;text-align:left}.coin-offer-clock>span{color:#f3c19d;font-size:.82rem}.coin-offer-clock time{font-size:1.4rem;color:#ffe0b4;font-variant-numeric:tabular-nums;letter-spacing:.05em}.coin-offer-clock small{grid-column:1 / -1;font-size:.7rem;color:#cbb59e}.coin-offer-terms,.coin-offer-payment{color:#b7b0a7;font-size:.75rem;line-height:1.6}.coin-offer-terms{margin:12px 0 16px}.coin-offer-payment{margin:10px 0 0}.coin-offer-buy{width:100%;min-height:48px;font-size:.95rem}.coin-offer-ended p{color:#f3c19d;line-height:1.6} @media(min-width:901px){.side-nav button.coin-offer-nav{display:grid;grid-template-columns:32px minmax(0,1fr);gap:3px 6px;min-height:60px;padding:6px 8px}.side-nav .coin-offer-nav .coin-offer-icon{display:block;grid-column:1;grid-row:1 / 3;width:32px;height:36px;image-rendering:auto}.side-nav button.coin-offer-nav>span{display:contents}.side-nav .coin-offer-nav strong{grid-column:2;grid-row:1;white-space:normal;font-size:.7rem}.side-nav .coin-offer-nav small{display:grid;gap:1px;grid-column:2;grid-row:2;font-size:.61rem}.side-nav .coin-offer-nav time{font-size:.68rem}.dialog.coin-offer-dialog{width:min(420px,100%);padding:20px}.coin-offer-hero{min-height:140px}.coin-offer-art{width:180px;height:140px}.coin-offer-seal{font-size:1.25rem;padding:9px}.coin-offer-content h2{font-size:1.3rem}.coin-offer-pricing{margin-bottom:14px}.coin-offer-pricing>strong{font-size:2.1rem}.coin-offer-clock{padding:10px 12px}.coin-offer-clock time{font-size:1.2rem}} @media(max-width:900px){.mobile-header .coin-offer-nav{min-height:44px;padding:6px 10px;margin:2px 0 4px;gap:10px}.mobile-header .coin-offer-icon{width:36px;height:36px}.mobile-header .coin-offer-nav>span{display:flex;flex:1;justify-content:space-between;align-items:center;gap:6px;flex-wrap:wrap}.mobile-header .coin-offer-nav strong{font-size:.72rem}.mobile-header .coin-offer-nav small{font-size:.68rem}.navigation-dialog .coin-offer-nav>span{display:grid}.dialog.coin-offer-dialog{padding:18px}.coin-offer-hero{min-height:140px}.coin-offer-art{width:170px;height:140px}.coin-offer-seal{top:8px;right:12px;font-size:1.3rem;padding:9px}.coin-offer-content h2{font-size:1.2rem}.coin-offer-pricing{margin-bottom:12px}.coin-offer-pricing>strong{font-size:2rem}} /* Progression cards share the game's normal scroll and focus behavior. */ .next-steps ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none;padding:0;margin:8px 0 0} .next-steps li{min-width:0;border-left:2px solid var(--gold,#d6b25e);padding-left:10px} .next-steps p,.daily-goals p{font-size:.85rem;line-height:1.5} .next-steps h2{font-size:1rem;margin:0}.next-steps{margin-bottom:12px} .vault-items{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}.vault-items article{display:grid;gap:6px;flex:1 1 160px;padding:12px;border:1px solid #665737} .vault-items .sprite{width:64px;height:64px}.title-choices{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 20px} .player-title{font-size:.7em;color:#e2c68b;margin-left:.5em}.coin-pack-bonus{font-size:.78rem;color:#e2c68b} .player-title-badge{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:22px;height:22px;color:var(--gold);cursor:help;vertical-align:middle} .player-title-badge::before{content:'';position:absolute;inset:-4px} .player-title-badge>.ui-icon{width:16px;height:16px} .player-title-badge>img{width:22px;height:22px;object-fit:contain} @media(max-width:900px){.next-steps ul{display:flex;overflow-x:auto;scroll-snap-type:x proximity}.next-steps li{flex:0 0 240px;scroll-snap-align:start}} @media(max-width:520px){.next-steps li{flex-basis:220px}.vault-items article{flex-basis:120px}} /* Reward tracks use the same original art as inventory and the shop. */ .reward-art{display:grid;place-items:center;flex:none;width:60px;height:60px;margin:auto;isolation:isolate} .reward-art>img,.reward-art>.sprite,.reward-art>.box-glyph{display:block;width:100%;height:100%;max-height:100%;object-fit:contain;image-rendering:auto} .reward-art>.pixel-icon{width:52px;height:52px}.reward-art-cash{width:72px} .reward-received{display:flex;align-items:center;justify-content:center;gap:5px;min-height:44px;color:var(--teal);font-size:.78rem;font-weight:750} .reward-upgrade-note{padding:10px 12px;border-left:2px solid var(--teal);background:#18302b;font-size:.8rem;color:#b5e6d6;margin:0 0 12px;border-radius:0 5px 5px 0} .season-pass{border:1px solid var(--line);background:#151e27;border-radius:12px;overflow:hidden;margin-bottom:14px} .pass-hero{display:flex;align-items:center;gap:16px;padding:22px;background:radial-gradient(ellipse at 0 0,#3c294f 0,transparent 65%),linear-gradient(115deg,#252439,#1b202a)} .season-pass-art{width:92px;height:112px;object-fit:contain;image-rendering:auto;flex:none;filter:drop-shadow(0 5px 0 #0c11154d)} .pass-hero-copy{flex:1;min-width:0}.pass-season{font-size:.65rem;font-weight:800;letter-spacing:.12em;color:#dcc38d}.pass-hero h2{font-size:1.5rem;line-height:1.2;margin:5px 0 6px;letter-spacing:-.025em}.pass-hero p{margin:0 0 15px;font-size:.75rem;color:#b2b2c1} .pass-level{display:flex;gap:8px;justify-content:space-between;font-size:.72rem;margin-bottom:7px}.pass-level strong{color:var(--gold)}.pass-level span{color:#c3c2ce;text-align:right}.pass-hero progress{height:5px;accent-color:var(--gold)}.pass-hero progress::-webkit-progress-value{background:var(--gold)} .pass-purchase{display:flex;flex-direction:column;align-items:center;gap:8px;flex:none;max-width:220px}.pass-purchase>span:not(.pass-active){font-size:.75rem;color:#e2cfac}.pass-purchase small{font-size:.65rem;text-align:center}.pass-purchase button{font-size:.8rem}.pass-active{display:flex;align-items:center;gap:7px;padding:10px 14px;background:#294238;border:1px solid #4f8e72;border-radius:7px;color:#a1e2bb;font-size:.8rem;font-weight:750}.pass-active .pixel-icon{width:21px;height:21px} .pass-rewards-heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:18px 18px 10px}.pass-rewards-heading h3{font-size:.85rem;margin:0}.pass-rewards-heading>span{font-size:.72rem;color:var(--muted)}.season-pass>.reward-upgrade-note{margin:0 18px 10px} .season-tiers{display:flex;gap:12px;overflow-x:auto;padding:2px 18px 14px;scroll-snap-type:x proximity;overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:#76613d #121920;scroll-padding:18px} .season-tier{flex:0 0 166px;display:grid;grid-template-rows:32px 228px 228px;gap:10px;min-width:0;scroll-snap-align:start;position:relative} .pass-milestone{display:flex;align-items:center;justify-content:center;gap:5px;color:#8a939e;position:relative;font-size:.9rem}.pass-milestone:before{content:'';position:absolute;left:-12px;right:-12px;height:1px;background:#35424e;z-index:0}.pass-milestone>span,.pass-milestone>strong{position:relative;z-index:1;background:#151e27}.pass-milestone>span{padding-left:7px}.pass-milestone>strong{padding-right:7px}.pass-milestone .pixel-icon{width:20px;height:20px;margin:0}.is-unlocked>.pass-milestone{color:var(--gold)}.is-unlocked>.pass-milestone:before{background:#806437} .pass-reward{border:1px solid #3b4b57;background:linear-gradient(155deg,#24333d,#1a242c);border-radius:9px;display:flex;flex-direction:column;align-items:center;padding:10px;min-width:0;box-shadow:0 3px 0 #0b1117} .pass-reward.is-paid{border-color:#806239;background:linear-gradient(155deg,#3b3022,#25221e)}.pass-reward.is-ready{border-color:#65ab94}.pass-reward.is-paid.is-ready{border-color:#d5a74c}.pass-reward.is-claimed{background:#192b28;border-color:#365a50;box-shadow:none}.pass-reward.is-locked{background:#19232b}.pass-reward.is-paid.is-locked{background:#28241f} .reward-track{align-self:flex-start;display:flex;align-items:center;gap:4px;font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#95c2c0;min-height:14px}.is-paid>.reward-track{color:#edc775}.reward-track .pixel-icon{width:13px;height:13px;margin:0}.pass-reward .reward-art{margin:7px 0 4px} .pass-reward h3{font-size:1.03rem;line-height:1.2;margin:3px 0;min-height:36px;display:grid;align-content:center;text-align:center;overflow-wrap:anywhere;color:#f6eee0;font-variant-numeric:tabular-nums}.pass-reward.is-paid h3{color:#ffe1a0}.pass-reward p{font-size:.65rem;line-height:1.35;margin:0 0 8px;min-height:29px;text-align:center;color:#aebac2}.pass-reward button,.pass-reward .reward-received{margin-top:auto;width:100%;font-size:.7rem;padding:8px 5px;min-height:40px}.pass-reward button:disabled{opacity:1;color:#94a1ac;border-color:#43505a;background:#26313a;box-shadow:none}.pass-reward.is-paid button:disabled{background:#3a3124;border-color:#665336;color:#b1a084} .pass-scroll-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 18px 12px}.pass-scroll-controls>span{font-size:.7rem;color:var(--muted)}.pass-scroll-controls button{min-width:44px;min-height:40px;padding:6px 12px;font-size:1.1rem} .pass-rules{padding:0 18px 12px;font-size:.75rem;border-top:1px solid #303c46}.pass-rules summary{padding:12px 0 0}.pass-rules p{font-size:.75rem;margin:8px 0 0} .season-vault{margin-bottom:16px}.season-vault-art{float:right;width:120px;height:130px;object-fit:contain;image-rendering:auto;margin:0 0 10px 14px}.season-vault:after{content:"";display:block;clear:both} .daily-goals{border:1px solid var(--line);border-radius:8px;background:#19232c;margin-bottom:12px;overflow:hidden} .daily-goal-copy>small{font-size:.6rem;color:#9cafb4} .fraud-focus{margin:4px 0 8px;color:var(--gold);font-size:.85rem;font-weight:650}.fraud-pace{margin:10px 0;line-height:1.6}.fraud-preparation{margin:10px 0;border-top:1px solid var(--line)}.fraud-preparation p{margin:10px 0}.fraud-gains{list-style:none;padding:0;margin:10px 0}.fraud-gains li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;padding:7px 0;border-bottom:1px solid var(--line);line-height:1.5}.health-recovery{font-size:.78rem;line-height:1.5;margin:8px 0}.player-resources .health-recovery{display:block;font-size:.68rem;margin:4px 0} @media(max-width:760px){.fraud-detail>.fraud-pace{order:2}.fraud-detail>.fraud-preparation{order:4}} .daily-goals>summary{list-style:none;display:flex;align-items:center;gap:10px;min-height:48px;padding:0 12px;margin:0!important;cursor:pointer;font-size:.8rem;color:#e7eceb}.daily-goals>summary::-webkit-details-marker{display:none}.daily-heading{display:flex;align-items:center;gap:8px;flex:1;font-weight:700}.daily-heading .pixel-icon{width:19px;height:19px;margin:0}.daily-summary-count{display:flex;gap:2px;padding:3px 8px;border:1px solid #445b60;border-radius:5px;color:var(--teal);font-size:.72rem;font-weight:750;font-variant-numeric:tabular-nums}.daily-summary-count>span{color:#97a9b2}.daily-caret{font-size:1rem;color:#8faaa9;transition:transform .18s}.daily-goals[open] .daily-caret{transform:rotate(180deg)}.daily-goals.is-complete>summary{background:#1c302a} .daily-content{border-top:1px solid #31404a;padding:12px}.daily-goal-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.daily-goal{display:grid;grid-template-columns:38px 1fr;column-gap:8px;align-items:center;padding:10px;border:1px solid #34454e;border-radius:6px;background:#152029;min-width:0}.daily-goal .reward-art{width:38px;height:38px}.daily-goal .reward-art>.pixel-icon{width:32px;height:32px}.daily-goal h3{font-size:.7rem;line-height:1.35;margin:0 0 4px;color:#cad4d9}.daily-goal-copy{position:relative;min-width:0}.daily-goal-copy>strong{display:block;font-size:.83rem;color:#f1dfb8;font-variant-numeric:tabular-nums}.daily-goal-progress{display:block;text-align:right;font-size:.6rem;color:#91a9ad;line-height:1.2;margin:3px 0}.daily-goal progress{height:3px}.daily-goal button,.daily-goal>.reward-received{grid-column:1/-1;font-size:.72rem;min-height:36px;padding:6px;margin-top:8px;width:100%}.daily-goal.is-claimed{border-color:#36594d}.daily-goal button:disabled{opacity:1;color:#86939e;background:#202b34;border-color:#34454e;box-shadow:none} .daily-footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 12px;margin-top:10px;font-size:.66rem;color:#9cafb4;line-height:1.5}.daily-footer strong{color:#dfd4ad;white-space:nowrap}.daily-footer strong .pixel-icon{width:13px;height:13px;margin:0 3px 0 0;vertical-align:middle}.daily-footer small{flex-basis:100%;font-size:.6rem;color:#8599a5}.daily-content>.reward-upgrade-note{font-size:.7rem}.next-steps{margin-top:18px} @media(max-width:1100px){.pass-hero{gap:12px;padding:18px}.season-pass-art{width:68px;height:90px}.pass-purchase{max-width:180px}.pass-hero h2{font-size:1.25rem}.pass-level{display:block}.pass-level span{display:block;text-align:left;margin-top:3px}.daily-goal-list{grid-template-columns:1fr}.daily-goal{grid-template-columns:38px 1fr auto}.daily-goal button,.daily-goal>.reward-received{grid-column:auto;min-width:90px;margin:0 0 0 8px}.daily-goal-progress{position:absolute;top:0;right:0}.daily-goal h3{padding-right:43px}.daily-goal progress{margin-top:6px}} @media(max-width:520px){.pass-hero{display:grid;grid-template-columns:56px 1fr;padding:16px 12px;gap:10px}.season-pass-art{width:56px;height:80px}.pass-hero h2{font-size:1.2rem}.pass-hero p{margin-bottom:10px;font-size:.65rem}.pass-season{font-size:.55rem}.pass-level{font-size:.65rem}.pass-purchase{grid-column:1/-1;max-width:none;flex-direction:row;justify-content:space-between;align-items:center;margin-top:3px}.pass-purchase>span:not(.pass-active){font-size:.66rem;max-width:82px}.pass-purchase small{display:none}.pass-purchase button{font-size:.7rem;padding:9px 11px;min-height:44px}.pass-active{padding:7px 10px}.pass-rewards-heading{padding:14px 12px 8px}.pass-rewards-heading h3{font-size:.78rem}.pass-rewards-heading>span{font-size:.65rem}.season-tiers{padding:2px 12px 12px;scroll-padding:12px;gap:10px}.season-tier{flex-basis:148px;grid-template-rows:30px 228px 228px}.pass-reward h3{font-size:.96rem}.pass-reward button,.pass-reward .reward-received{min-height:44px}.pass-scroll-controls{padding:8px 12px}.pass-scroll-controls button{min-height:44px}.pass-scroll-controls>span{font-size:.63rem;text-align:center}.pass-rules{padding:0 12px 12px}.season-vault-art{width:90px;height:100px}.daily-goals>summary{min-height:46px;padding:0 10px}.daily-content{padding:8px}.daily-goal{column-gap:7px;padding:9px 8px}.daily-goal-copy>strong{font-size:.76rem}.daily-goal button,.daily-goal>.reward-received{min-width:75px;min-height:44px;font-size:.64rem;margin-left:3px}.daily-footer{padding:0 2px;font-size:.63rem}.daily-footer small{font-size:.58rem}} .legal-page>nav{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:20px;background:var(--bg);padding:12px 0}.legal-page>nav a{display:inline-flex;align-items:center;min-height:44px}.legal-page>nav a:last-child{padding:8px 14px;border:1px solid var(--gold);border-radius:5px} /* Street brawl: generated animation frames share a single floor and camera. */ .attack-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0} .attack-mode{display:flex;align-items:center;justify-content:center;gap:8px;min-height:60px;white-space:normal;line-height:1.4}.attack-mode-icon{flex-shrink:0}.attack-mode.is-selected{outline:2px solid var(--gold,#efc66e);outline-offset:2px} .brawl-opponents{display:flex;align-items:center;justify-content:center;gap:20px;margin:20px 0}.brawl-opponents>div{display:grid;justify-items:center;gap:8px;max-width:42%;text-align:center;overflow-wrap:anywhere}.brawl-opponents .portrait{width:88px;height:88px}.brawl-opponents>span{font-size:28px;color:var(--gold,#efc66e)} .brawl-rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:18px 0}.brawl-rules dt{font-size:12px;color:var(--muted)}.brawl-rules dd{margin:4px 0 0;font-weight:700} .brawl-scene{height:410px;background:linear-gradient(#152432 0%,#263641 53%,#465059 53.4%,#303438 54%,#35353a 92%,#232529 92.4%)} .brawl-scene::before{content:"";position:absolute;inset:53% 0 auto;height:13%;background:repeating-linear-gradient(90deg,transparent 0 41px,#10171d 42px 45px),repeating-linear-gradient(0deg,transparent 0 18px,#10171d 19px 21px);opacity:.5} .brawl-scene .battle-ground{display:none}.brawl-scene .battle-hud-attack{top:12px;left:12px;bottom:auto;right:auto}.brawl-scene .battle-hud-defense{top:12px;right:12px;left:auto} .brawl-scene .battle-hud{width:44%;background:#101820ed;border:1px solid #6d7579;border-radius:2px;box-shadow:none;color:#f8eddd}.brawl-scene .battle-hud strong,.brawl-scene .battle-attributes dd{color:#f8eddd}.brawl-scene .battle-hud label,.brawl-scene .battle-attributes dt{color:#b8c1c5}.brawl-scene .battle-hud progress::-webkit-progress-value{background:#e99d42}.brawl-scene .battle-hud progress::-moz-progress-bar{background:#e99d42} .brawl-scene .battle-combatant{top:auto;bottom:2px;width:340px;height:272px}.brawl-scene .battle-attack{left:calc(50% - 250px)}.brawl-scene .battle-defense{right:calc(50% - 250px)}.brawl-scene .battle-defense .brawl-sprite{transform:scaleX(-1)} .brawl-scene .battle-fighter-art{position:relative;width:100%;height:100%}.brawl-scene .brawl-sprite{display:block;width:100%;height:100%}.brawl-scene .battle-attack.is-attacking .battle-fighter-art{animation:brawl-step .7s steps(3)}.brawl-scene .battle-defense.is-attacking .battle-fighter-art{animation:brawl-step-back .7s steps(3)}.brawl-scene .battle-combatant.is-hit .battle-fighter-art{animation:brawl-impact-body .5s steps(2)} .brawl-scene .battle-combatant.is-knocked-out .battle-fighter-art{opacity:1;transform:translateY(0);transition:opacity .2s} .brawl-scene .is-hit::after{content:"";position:absolute;z-index:3;top:35%;left:44%;width:30px;height:30px;background:#ffd174;clip-path:polygon(50% 0,60% 32%,90% 9%,70% 42%,100% 50%,70% 60%,90% 90%,59% 70%,50% 100%,40% 70%,10% 90%,30% 60%,0 50%,30% 40%,10% 10%,40% 30%);animation:brawl-impact .45s steps(3) both}.brawl-scene .battle-damage{left:45%;top:4%;z-index:4} @keyframes brawl-step{0%,100%{transform:translateX(0)}35%,65%{transform:translateX(12px)}} @keyframes brawl-step-back{0%,100%{transform:translateX(0)}35%,65%{transform:translateX(-12px)}} @keyframes brawl-impact-body{0%,100%{filter:brightness(1)}35%{filter:brightness(1.55)}} @keyframes brawl-impact{0%,100%{opacity:0;transform:scale(.3)}25%,65%{opacity:1;transform:scale(1.2)}} @media(max-width:600px){.attack-modes{gap:8px}.attack-mode{padding:10px 8px;font-size:12px}.brawl-opponents{gap:12px}.brawl-opponents .portrait{width:70px;height:70px}.brawl-scene{height:360px}.brawl-scene .battle-combatant{width:220px;height:176px;bottom:8px}.brawl-scene .battle-attack{left:calc(50% - 158px)}.brawl-scene .battle-defense{right:calc(50% - 158px)}.brawl-scene .battle-hud{width:46%;padding:7px}.brawl-scene .battle-hud-attack{left:8px}.brawl-scene .battle-hud-defense{right:8px}} .brawl-scene .battle-hud label b{color:#f8eddd} /* Shared raster equipment frames and numbered level seals, including compact cells. */ .item-visual,.box-visual{position:relative;display:inline-block;vertical-align:middle;flex:none;isolation:isolate;filter:none} .item-visual.loot-glyph{width:60px;height:60px} .item-visual.bonus-art{width:58px;height:58px} .item-visual.loot-glyph.event-art{width:42px;height:42px} .toast-art>.item-visual.loot-glyph{width:38px;height:38px} .notification-art>.item-visual.loot-glyph{width:40px;height:40px} .item-visual>.sprite,.box-visual>.sprite{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none} .item-rarity-frame{z-index:1} .item-level{position:absolute;right:-2px;bottom:-2px;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:3px;min-height:21px;padding:2px 4px;border:1px solid var(--rarity,var(--mastro-gold));border-radius:3px;background:var(--mastro-deep);color:var(--mastro-white);box-shadow:0 2px 3px var(--mastro-shadow-soft);white-space:nowrap;font:700 12px/1 var(--mastro-font-body);font-variant-numeric:tabular-nums} .item-level small{font:700 8px/1 var(--mastro-font-body);color:var(--mastro-paper)} .item-level-number{display:flex;align-items:center} .item-level-digit{display:block;width:7px;height:10.5px;flex:none} .inventory-grid>.item-cell:not(.upgrade-consumed-item){min-height:134px} .item-cell-rarity{font-size:.7rem} .item-summary>.item-visual.loot-glyph{width:76px;height:76px;padding:0;border:0;box-sizing:border-box;background:transparent} .item-tooltip .item-summary>.item-visual.loot-glyph{width:58px;height:58px;background:transparent} .equipment-slots .item-cell{padding:8px 4px} .person-content>.equipment-slots .item-cell{padding:2px} .person-content>.equipment-slots .item-visual.loot-glyph{width:100%;height:100%} .person-content>.equipment-slots .item-level,.battle-item-art .item-level{padding:1px 2px;min-height:16px;gap:0;bottom:-2px;right:-2px} .person-content>.equipment-slots .item-level small,.battle-item-art .item-level small{display:none} .event-art .item-level{padding:1px 2px;min-height:16px;gap:0} .event-art .item-level small{display:none} .event-art .item-level-digit{width:5.6px;height:8.4px} .person-content>.equipment-slots .item-level-digit,.battle-item-art .item-level-digit{width:5.6px;height:8.4px} .market-item-heading .item-cell{width:76px;min-width:76px;min-height:80px;padding:6px} .upgrade-preview>.item-visual.loot-glyph{width:80px;height:80px} .upgrade-material-grid .item-visual.loot-glyph,.upgrade-consumed-item .item-visual.loot-glyph{width:52px;height:52px} .box-prize .item-summary>.item-visual.loot-glyph{width:112px;height:112px} .box-reward .item-summary>.item-visual.loot-glyph{width:64px;height:64px} .box-visual.box-glyph{width:60px;height:60px} .box-card>.box-visual.box-glyph{width:84px;height:84px} .metric-box .box-visual.box-glyph,.fraud-run-loot .box-visual.box-glyph{width:44px;height:44px} .metric-box .item-level,.fraud-run-loot .item-level{padding:1px 2px;min-height:16px} .metric-box .item-level small,.fraud-run-loot .item-level small{display:none} .metric-box .item-level-digit,.fraud-run-loot .item-level-digit{width:5.6px;height:8.4px} .battle-equipped-item,.battle-empty-item{width:44px;height:44px} .battle-equipped-item .item-visual.battle-item-art{display:block;width:100%;height:100%} .battle-item-detail{bottom:50px} @media(max-width:600px){ .upgrade-preview>.item-visual.loot-glyph{width:60px;height:60px} .battle-equipped-item,.battle-empty-item{width:36px;height:36px} .battle-item-detail{bottom:42px} .box-card>.box-visual.box-glyph{width:72px;height:72px} } @media(max-width:700px){ .activity-row>.item-visual.loot-glyph{width:34px;height:34px} .toast-art>.item-visual.loot-glyph{width:30px;height:30px} .notification-art>.item-visual.loot-glyph{width:32px;height:32px} } .room-message{border-radius:6px;padding-inline:6px;margin-inline:-6px;transition:background .12s;-webkit-touch-callout:none}.room-message:hover{background:#1a2733}.chat-menu{position:fixed;z-index:200;min-width:168px;padding:6px;background:#1d2731;border:1px solid #566571;border-radius:9px;box-shadow:0 14px 40px #000a;display:grid;gap:2px}.chat-menu button{display:flex;align-items:center;justify-content:flex-start;width:100%;height:32px;min-height:0;padding:0 12px;background:transparent;border:0;box-shadow:none;text-align:left;border-radius:6px;font-weight:600;color:var(--text)}.room-message-admin .room-message-heading strong,.room-message-admin .player-name,.room-message-admin .room-message-body p{color:#c9a3ff}.chat-menu button:hover,.chat-menu button:focus-visible{background:#2b3742;outline:0}.chat-menu hr{border:0;border-top:1px solid var(--line);margin:4px 0}.report-quote{margin:0 0 16px;padding:12px 14px;border-left:3px solid var(--gold);background:#111c23;border-radius:0 8px 8px 0}.report-quote p{margin:4px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--text)}.report-quote .mastro-sticker{width:120px;margin-top:6px}.report-reasons{border:1px solid var(--line);border-radius:8px;padding:8px 14px 10px;margin:0 0 14px;display:grid;gap:2px;min-width:0}.report-reasons legend{color:var(--muted);font-size:.9rem;padding:0 4px}.report-reasons label{display:flex;align-items:center;gap:10px;min-height:40px;color:var(--text);cursor:pointer;margin:0;font-size:.95rem}.report-reasons input{width:18px;height:18px;flex-shrink:0;accent-color:var(--gold);margin:0}#report-form>label{margin:0 0 6px}#report-details{display:block;width:100%;min-height:80px;background:#111c23;border:1px solid #53616d;border-radius:7px;color:var(--text);padding:10px 12px;font:inherit;resize:vertical}#report-count{display:block;text-align:right;margin-top:4px}.report-rule{font-size:.9rem;margin:12px 0}#report-error:empty{display:none}#report-form .actions{justify-content:flex-end} .faction-nav-icon{display:inline-block;width:23px;height:23px;flex-shrink:0;background:url('/assets/v05/faction-icons-v1.png') 0 0/400% 200% no-repeat}.factions-page{--f-left:#e47b75;--f-right:#e3d679;--f-gold:#e9c375;max-width:1180px;margin:0 auto}.factions-page .faction-icon{display:inline-block;width:29px;height:29px;background-image:url('/assets/v05/faction-icons-v1.png');background-size:400% 200%;background-repeat:no-repeat;flex-shrink:0;vertical-align:middle}.faction-icon[data-icon="war"]{background-position:0 0}.faction-icon[data-icon="fame"]{background-position:33.333% 0}.faction-icon[data-icon="cash"]{background-position:66.666% 0}.faction-icon[data-icon="coins"]{background-position:100% 0}.faction-icon[data-icon="level"]{background-position:0 100%}.faction-icon[data-icon="hospital"]{background-position:33.333% 100%}.faction-icon[data-icon="wins"]{background-position:66.666% 100%}.faction-icon[data-icon="neutral"]{background-position:100% 100%} .factions-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.factions-heading h1{margin:0}.factions-heading>div{display:flex;gap:12px;align-items:center}.factions-heading .faction-icon{width:42px;height:42px}.factions-membership{color:var(--muted);font-size:.85rem;text-align:right}.factions-membership strong{display:block;color:var(--text);font-weight:600}.factions-intro{position:relative;isolation:isolate;overflow:hidden;min-height:150px;display:flex;align-items:end;padding:22px;border:1px solid #46525a;border-radius:10px;background:linear-gradient(90deg,#10171ef7,#111920c9 60%,#10171e78),url('/assets/v05/faction-paulista-v1.png') center 43%/cover}.factions-intro>div{max-width:600px}.factions-intro h2{font-size:1.3rem;margin:3px 0 8px}.factions-intro p{font-size:.85rem;margin:0;max-width:580px}.factions-eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.65rem;color:var(--f-gold)}.factions-war-time{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;color:#f1ddac;font-size:.85rem;font-variant-numeric:tabular-nums}.factions-clans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px}.faction-card{position:relative;overflow:hidden;border:1px solid #67484b;border-radius:10px;padding:18px;background:radial-gradient(ellipse at 10% 0,#63313955,transparent 70%),#1a222b;min-width:0}.faction-card[data-faction="right"]{border-color:#496347;background:radial-gradient(ellipse at 10% 0,#27674755,transparent 70%),#1a222b}.faction-identity{display:flex;align-items:center;gap:12px}.faction-crest{width:88px;height:96px;object-fit:contain;filter:drop-shadow(0 4px 7px #0007)}.faction-identity h2{font-size:1.25rem;margin:0 0 4px}.faction-identity p{font-size:.8rem;margin:0}.faction-card[data-faction="left"] h2{color:var(--f-left)}.faction-card[data-faction="right"] h2{color:var(--f-right)}.faction-level{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.8rem;margin-top:12px}.faction-level strong{color:var(--f-gold)}.faction-xp{height:5px;display:block;margin:8px 0;background:#34404a;border-radius:3px;overflow:hidden}.faction-xp>span{display:block;height:100%;background:var(--f-gold)}.faction-progress-caption{display:block;color:var(--muted);font-size:.7rem;margin-bottom:14px;font-variant-numeric:tabular-nums}.faction-card button{width:100%;font-size:.85rem}.faction-neutral{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:13px 1px 16px}.faction-neutral p{font-size:.8rem;margin:0;flex:1;min-width:180px}.faction-neutral button{font-size:.8rem}.factions-rules{font-size:.8rem;padding:0 0 16px}.factions-rules summary{padding-top:3px}.factions-rules p{font-size:.8rem;margin:9px 0 0}.factions-tabs{display:flex;gap:5px;margin:4px 0 18px;border-bottom:1px solid var(--line);padding-bottom:8px;flex-wrap:wrap}.factions-tabs button{background:transparent;border-color:transparent;color:var(--muted);font-size:.85rem;display:flex;align-items:center;gap:7px}.factions-tabs button[aria-selected="true"]{background:#2a343d;color:var(--gold);border-color:#5e5c4a}.factions-tabs .faction-icon{width:25px;height:25px} .faction-battle{background:#151e26;border:1px solid #3d4c56;border-radius:10px;overflow:hidden}.faction-battle-heading{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;padding:13px 16px}.faction-battle-team{display:flex;align-items:center;gap:8px;min-width:0;font-size:.85rem}.faction-battle-team:last-child{justify-content:end;text-align:right}.faction-battle-team img{width:35px;height:40px;object-fit:contain}.faction-battle-team strong,.faction-battle-team small{display:block}.faction-battle-team small{font-size:.7rem;color:var(--muted)}.faction-battle-clock{text-align:center;font-size:.85rem;color:var(--f-gold);font-variant-numeric:tabular-nums}.faction-battle-clock small{display:block;font-size:.65rem;color:var(--muted)}.faction-war-scene{position:relative;height:clamp(520px,78dvh,820px);background:#26353a;overflow:hidden;touch-action:pan-y}.faction-war-scene canvas{width:100%;height:100%;display:block;touch-action:none}.faction-war-camera{position:absolute;right:10px;bottom:10px;display:flex;gap:5px;max-width:calc(100% - 20px);flex-wrap:wrap;justify-content:end}.faction-war-camera button{font-size:.75rem;background:#15212aef;padding:8px 10px;min-width:36px}.faction-war-label{position:absolute;top:10px;left:10px;padding:5px 8px;background:#111c25de;border-radius:4px;color:#d2d8d3;font-size:.65rem;pointer-events:none}.faction-war-tools{display:flex;flex-wrap:wrap;gap:7px;padding:11px 13px;align-items:center}.faction-war-tools p{margin:0;flex:1;font-size:.75rem;min-width:150px}.faction-war-tools button{font-size:.75rem;padding:8px 10px}.faction-waiting{min-height:230px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;padding:25px;background:linear-gradient(#101820a8,#101820ed),url('/assets/v05/faction-paulista-v1.png') center/cover}.faction-waiting .faction-icon{width:60px;height:60px}.faction-waiting h3{margin:0;color:#ead3a1}.faction-waiting p{max-width:450px;margin:0;font-size:.85rem}.faction-war-result{padding:12px 16px;background:#2e3029;color:#f3d997;font-size:.85rem}.faction-war-roster{padding:0 14px 12px}.faction-roster-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;list-style:none;padding:0;margin:0;font-size:.75rem}.faction-roster-list li{display:flex;justify-content:space-between;gap:5px;min-width:0;overflow-wrap:anywhere}.faction-roster-list span{color:var(--muted);white-space:nowrap}.faction-war-history{margin-top:18px}.faction-war-history h2{font-size:1rem}.faction-war-history>div{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);padding:10px 0;font-size:.8rem}.faction-war-history button{font-size:.75rem;padding:6px 9px}.faction-war-history strong{font-weight:600} .faction-donation{padding:20px;border:1px solid var(--line);border-radius:10px;background:#1b252e}.faction-donation h2{margin-bottom:8px}.faction-donation p{font-size:.85rem}.faction-donation form{display:grid;grid-template-columns:1fr 1fr;gap:13px 16px}.faction-donation label{font-size:.8rem}.faction-donation select,.faction-donation input{margin-top:5px;background:#111b24;border:1px solid #4b5b68;color:var(--text);padding:10px;width:100%;border-radius:5px;min-width:0}.faction-donation-preview{grid-column:1/-1;display:flex;align-items:center;gap:13px;padding:12px;background:#25332e;border-radius:6px;color:#cfdfcd;font-size:.85rem}.faction-donation-preview .faction-icon{width:37px;height:37px}.faction-donation form>button{grid-column:1/-1}.faction-donation small{font-size:.75rem}.faction-donation-log{padding:0;list-style:none}.faction-donation-log li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.8rem}.faction-donation-log strong{font-weight:600;overflow-wrap:anywhere}.faction-donation-log span{color:var(--muted);text-align:right}.factions-message{font-size:.85rem;padding:12px 14px;margin:0 0 16px;background:#20382f;border:1px solid #436658;border-radius:6px;color:#c2e2cc}.factions-message.is-error{background:#38292b;border-color:#855252;color:#ffbbb3}.faction-empty{padding:32px 16px;text-align:center;color:var(--muted);font-size:.85rem}.faction-chat{position:absolute;z-index:4;left:12px;right:12px;bottom:12px;max-width:680px;margin:0 auto;padding:0;background:transparent;pointer-events:none}.faction-chat-messages{height:112px;overflow-y:auto;list-style:none;padding:5px 6px;margin:0 0 6px;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#c8c5b080 transparent;pointer-events:auto;outline-offset:-2px}.faction-chat-messages li{padding:3px 0;border:0;background:transparent;font-size:.8rem;line-height:1.5;overflow-wrap:anywhere;color:#fff;text-shadow:-1px -1px 0 #081019,1px -1px 0 #081019,-1px 1px 0 #081019,1px 1px 0 #081019,0 2px 3px #000;font-weight:600}.faction-chat-messages strong{color:#ffe0a0;font-weight:700;margin-right:7px}.faction-chat-messages .faction-badge{width:16px;height:18px;vertical-align:middle}.faction-chat-messages time{color:#d3dae0;font-size:.6rem;margin-left:8px;white-space:nowrap}.faction-chat form{display:flex;gap:0;align-items:center;min-height:44px;background:#0c1724a8;border:1px solid #c0c8d04d;border-radius:8px;pointer-events:auto;touch-action:pan-y}.faction-chat form:focus-within{border-color:#edce8e;box-shadow:0 0 0 1px #edce8e55}.faction-chat input{display:block;flex:1;min-width:0;width:100%;height:44px;padding:10px 12px;margin:0;background:transparent;border:0;border-radius:8px;color:#fff;font-size:.85rem;outline:0}.faction-chat input::placeholder{color:#c0cbd4}.faction-chat button{align-self:stretch;flex-shrink:0;display:grid;place-items:center;width:44px;min-height:44px;padding:8px;background:transparent;border:0;border-radius:7px;color:#ffe0a0}.faction-chat button:hover{background:#e0c18a22}.faction-chat-error{margin:0 6px 6px!important;padding:3px 6px;font-size:.75rem;color:#ffd3cb!important;background:#401d27e6;border-radius:4px;pointer-events:auto}.faction-chat-error[hidden]{display:none}.faction-chat:has(.faction-chat-error:not([hidden])) .faction-chat-messages{height:72px}.faction-war-scene.has-chat{--war-chat-space:184px}.faction-war-scene.has-chat .faction-war-panel{bottom:calc(var(--war-chat-space) + 54px)}.faction-war-scene.has-chat .faction-war-panel[data-collapsed=true]{bottom:auto}.faction-war-scene.has-chat .faction-war-camera{bottom:var(--war-chat-space)}.faction-war-scene.has-chat[data-war-generation$=":preview"] .faction-war-label{bottom:calc(var(--war-chat-space) + 54px)}.faction-confirm{max-width:440px;background:#1b252e;color:var(--text);border:1px solid #718079;border-radius:10px;padding:24px}.faction-confirm::backdrop{background:#060b13bd}.faction-confirm h2{font-size:1.2rem}.faction-confirm p{font-size:.9rem}.faction-confirm>div{display:flex;gap:10px;justify-content:end}.faction-nav-art{width:23px;height:23px;object-fit:contain} @media(max-width:1100px){.faction-crest{width:66px;height:76px}.faction-card{padding:13px}.faction-identity{gap:8px}.faction-identity h2{font-size:1.1rem}.faction-level{flex-wrap:wrap;gap:3px}} @media(max-width:600px){.factions-heading{align-items:start;gap:10px}.factions-heading h1{font-size:1.4rem}.factions-heading .faction-icon{width:33px;height:33px}.factions-membership{font-size:.75rem}.factions-intro{padding:17px;min-height:158px}.factions-intro h2{font-size:1.15rem}.factions-clans{gap:9px}.faction-card{padding:12px 10px}.faction-identity{display:block;text-align:center}.faction-crest{width:78px;height:86px}.faction-identity p{font-size:.7rem}.faction-level{font-size:.7rem;justify-content:center;text-align:center}.faction-level strong{width:100%}.faction-progress-caption{font-size:.65rem;text-align:center;min-height:30px}.faction-card button{padding:9px 5px;font-size:.75rem}.faction-neutral p{font-size:.75rem;min-width:160px}.factions-tabs{gap:2px}.factions-tabs button{padding:8px;font-size:.8rem;gap:4px;flex:1}.factions-tabs .faction-icon{width:22px;height:22px}.faction-battle-heading{padding:11px 10px;gap:4px}.faction-battle-team{gap:4px;font-size:.75rem}.faction-battle-team img{width:27px;height:34px}.faction-battle-team small{font-size:.65rem}.faction-war-scene{height:clamp(440px,calc(100dvh - 150px),760px)}.faction-war-tools{padding:9px}.faction-war-camera button{min-height:44px}.faction-donation{padding:16px}.faction-donation form{grid-template-columns:1fr}.faction-donation input,.faction-donation select,.faction-chat input{font-size:16px}.faction-chat{left:8px;right:8px;bottom:8px}.faction-chat-messages{height:104px}.faction-chat-messages li{font-size:.75rem}.faction-war-scene.has-chat{--war-chat-space:172px}.faction-roster-list{grid-template-columns:1fr}.faction-war-history>div{flex-wrap:wrap}} .faction-war-panel{position:absolute;top:38px;bottom:65px;width:clamp(128px,19%,188px);z-index:2;display:flex;flex-direction:column;border:1px solid #79644977;border-radius:7px;background:#101a23ed;box-shadow:0 4px 20px #0004;contain:layout paint;touch-action:pan-y}.faction-war-panel[data-side=left]{left:8px;border-color:#ad625e88}.faction-war-panel[data-side=right]{right:8px;border-color:#a5a54f88}.faction-war-panel>button{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0;width:100%;min-height:38px;padding:8px 10px;font-size:.75rem;background:#283037;border:0;border-radius:5px 5px 0 0;color:#f4b2a9}.faction-war-panel[data-side=right]>button{color:#f1df87}.faction-war-panel[data-collapsed=true]{bottom:auto;width:auto;min-width:102px;background:transparent}.faction-war-panel[data-collapsed=true]>button{border-radius:5px}.faction-war-panel-body{min-height:0;display:flex;flex:1;flex-direction:column}.faction-war-panel-body[hidden]{display:none}.faction-war-panel-key{display:flex;justify-content:space-between;padding:5px 8px 5px 25px;color:#b4c0c8;font-size:.6rem}.faction-war-panel ol{min-height:0;overflow-y:auto;overscroll-behavior:contain;margin:0;padding:0 5px 5px;list-style:none;scrollbar-width:thin;scrollbar-color:#606a73 transparent}.faction-war-panel li{display:flex;align-items:center;gap:5px;min-height:39px;padding:5px 2px;border-bottom:1px solid #47525c55;font-size:11px;contain:layout}.faction-war-panel li.is-self{background:#73644255;border-radius:4px}.faction-war-panel li.is-fallen{opacity:.55}.faction-war-rank{width:17px;flex-shrink:0;text-align:center;font-size:10px;color:#b1bec7;font-variant-numeric:tabular-nums}.faction-war-player-info{flex:1;min-width:0}.faction-war-player-info>strong{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px;color:#f3eee5;font-weight:600}.faction-war-vital{display:flex;align-items:center;gap:4px;min-width:0;margin-top:3px;font-size:9px;color:#c0cdd2;font-variant-numeric:tabular-nums}.faction-war-vital meter{flex:1;min-width:12px;width:38px;height:5px;background:#35413d;border:0;border-radius:2px;appearance:none}.faction-war-vital meter::-webkit-meter-bar{background:#35413d;border:0;border-radius:2px}.faction-war-vital meter::-webkit-meter-optimum-value{background:#79d69a;border-radius:2px}.faction-war-vital meter::-moz-meter-bar{background:#79d69a;border-radius:2px}.faction-war-points{min-width:24px;text-align:right;flex-shrink:0;font-size:11px;color:#f2d48d;font-variant-numeric:tabular-nums}.faction-war-score-rules{padding:0 14px 10px;font-size:.75rem}.faction-war-score-rules p{font-size:.75rem;margin:6px 0}.faction-war-scene{isolation:isolate}.faction-war-camera{z-index:3} @media(max-width:600px){.faction-war-panel{width:43%;top:35px;bottom:65px}.faction-war-panel[data-side=left]{left:5px}.faction-war-panel[data-side=right]{right:5px}.faction-war-panel>button{min-height:44px;padding:8px;font-size:.7rem}.faction-war-panel[data-collapsed=true]{min-width:88px}.faction-war-panel li{min-height:40px;gap:3px}.faction-war-panel ol{padding:0 3px 4px}.faction-war-points{min-width:21px;font-size:10px}.faction-war-rank{width:13px}.faction-war-player-info>strong{font-size:10px}.faction-war-vital{font-size:8px;gap:2px}.faction-war-vital meter{width:20px}} .faction-war-countdown{position:absolute;z-index:1;left:50%;top:8px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;text-align:center;padding:7px 13px;border:1px solid #e0c58066;background:#0d1722ed;border-radius:7px;box-shadow:0 3px 12px #0005;pointer-events:none}.faction-war-countdown[hidden]{display:none}.faction-war-countdown small{color:#e8d29c;font-size:.65rem;white-space:nowrap}.faction-war-countdown strong{font-size:clamp(1.25rem,2.7vw,1.8rem);line-height:1.1;color:#ffe1a0;font-variant-numeric:tabular-nums;letter-spacing:.03em}.faction-war-scene[data-war-generation$=":preview"] .faction-war-label{top:auto;bottom:14px}@media(max-width:600px){.faction-war-countdown{top:6px;padding:6px 10px;gap:7px}.faction-war-countdown small{font-size:.6rem}.faction-war-scene[data-war-generation$=":preview"] .faction-war-label{bottom:65px;left:8px}} .faction-war-banter{position:absolute;inset:0;pointer-events:none;overflow:hidden}.faction-war-banter[hidden],.faction-war-bubble[hidden]{display:none}.faction-war-bubble{position:absolute;top:0;left:0;box-sizing:border-box;min-height:35px;display:flex;align-items:center;justify-content:center;padding:7px 9px;border:1px solid #c78e85;border-radius:9px;background:#fff1e8;color:#482825;box-shadow:0 3px 9px #0005;text-align:center;font:600 11px/1.25 system-ui;will-change:transform,opacity}.faction-war-bubble[data-banter-side=right]{border-color:#cfba63;background:#fff7cf;color:#45401e}.faction-war-bubble:after{content:'';position:absolute;left:calc(var(--speech-tail) - 5px);bottom:-6px;width:9px;height:9px;transform:rotate(45deg);background:inherit;border-right:1px solid #c78e85;border-bottom:1px solid #c78e85}.faction-war-bubble[data-banter-side=right]:after{border-color:#cfba63} #tutorial-overlay:has(.tutorial-faction-guide){background:#081018c9}.tutorial-guide.tutorial-faction-guide{left:50%;top:50%;transform:translate(-50%,-50%);width:min(900px,calc(100vw - 24px));max-height:calc(100dvh - 24px);display:flex;flex-direction:column;align-items:stretch;gap:0;background:#19232e;border:1px solid #907853;border-radius:12px;box-shadow:0 15px 60px #0009;overflow:hidden}.tutorial-faction-heading{display:flex;align-items:center;gap:12px;padding:15px 20px;background:#242836;border-bottom:1px solid #4a4650;flex-shrink:0}.tutorial-faction-heading h2{margin:4px 0 0;color:#ffe1a0;font-size:1.3rem}.tutorial-faction-heading small{color:#c6b6cd;font-size:.75rem}.tutorial-faction-content{padding:18px 20px;overflow-y:auto;min-height:0;font-size:.9rem;line-height:1.5;overscroll-behavior:contain}.tutorial-faction-content p{font-size:.9rem}.tutorial-faction-crests{display:flex;align-items:center;justify-content:center;gap:35px;margin:8px 0 14px;color:#d8c292;font-size:1.4rem}.tutorial-faction-crests img{width:70px;height:82px;object-fit:contain}.tutorial-faction-rules{padding-left:20px;margin:12px 0 16px}.tutorial-faction-rules li{padding:3px 0}.tutorial-faction-actions{display:flex;align-items:center;justify-content:end;flex-wrap:wrap;gap:12px;margin-top:18px}.tutorial-faction-actions button,.tutorial-faction-choice button{min-height:44px;padding:10px 14px;font-size:.85rem}.tutorial-faction-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}.tutorial-faction-choice{display:flex;flex-direction:column;align-items:center;padding:17px 13px;min-width:0;border:1px solid #6d5860;border-radius:9px;background:#2e252d;text-align:center}.tutorial-faction-choice[data-choice=right]{background:#2d3027;border-color:#7b734a}.tutorial-faction-choice[data-choice=neutral]{background:#252e36;border-color:#59656e}.tutorial-faction-choice>img{width:60px;height:70px;object-fit:contain}.tutorial-faction-choice>.faction-icon{display:block;width:60px;height:70px;background:url('/assets/v05/faction-icons-v1.png') 100% 100%/400% 200% no-repeat}.tutorial-faction-choice h3{font-size:1rem;margin:10px 0 6px}.tutorial-faction-choice p{font-size:.8rem;flex:1;margin-bottom:16px}.tutorial-faction-choice button{width:100%;margin-top:auto}.tutorial-replay-date{font-size:.8rem!important;color:#c9c0aa}.tutorial-faction-content .faction-battle-heading{padding:10px;background:#101b24;border-radius:7px 7px 0 0;font-size:.8rem}.tutorial-faction-content .faction-battle-heading>strong:last-child{text-align:right}.tutorial-faction-content .faction-battle-heading small{display:block;color:#bdc6ca;font-weight:400}.tutorial-faction-content [data-intro-clock]{color:#edce8e;font-variant-numeric:tabular-nums}.tutorial-faction-content .faction-war-scene{height:clamp(260px,38vw,420px);border-radius:0 0 7px 7px} @media(max-width:600px){.tutorial-faction-heading{padding:12px;gap:9px}.tutorial-faction-heading h2{font-size:1.1rem}.tutorial-faction-content{padding:14px 12px}.tutorial-faction-content p,.tutorial-faction-rules{font-size:.8rem}.tutorial-faction-actions{gap:10px}.tutorial-faction-actions button{flex:1 1 100%}.tutorial-faction-choices{grid-template-columns:1fr;gap:10px}.tutorial-faction-choice{display:grid;grid-template-columns:52px minmax(0,1fr);gap:6px 12px;text-align:left;padding:13px}.tutorial-faction-choice>img,.tutorial-faction-choice>.faction-icon{grid-row:1;width:50px;height:58px}.tutorial-faction-choice h3{margin:0}.tutorial-faction-choice p{margin:0}.tutorial-faction-choice button{grid-column:1/-1;margin-top:7px}.tutorial-faction-content .faction-war-scene{height:280px}} #tutorial-overlay:has(.tutorial-faction-guide){background:#00000038} .tutorial-faction-heading .tutorial-speaker h2{font-size:16px}.tutorial-faction-guide .tutorial-rules summary{min-height:44px} .tutorial-faction-guide .tutorial-faction-actions{gap:12px;margin-top:16px}.tutorial-faction-guide .tutorial-faction-actions button,.tutorial-faction-guide .tutorial-faction-choice button{min-height:32px;padding:5px 9px;font-size:12px}.tutorial-faction-guide .tutorial-meta{gap:12px}.tutorial-faction-guide .tutorial-exit{min-height:32px} @media(max-width:600px),(max-height:500px){ .tutorial-guide.tutorial-faction-guide{width:min(320px,calc(100vw - 20px));max-height:55dvh;border-radius:9px} .tutorial-faction-guide .tutorial-faction-heading{padding:8px}.tutorial-faction-heading .tutorial-speaker h2{font-size:13px} .tutorial-faction-guide .tutorial-faction-content{padding:8px 10px}.tutorial-faction-guide .tutorial-faction-content p,.tutorial-faction-rules{font-size:12px;line-height:1.4}.tutorial-faction-content p{margin:0 0 8px} .tutorial-faction-crests{gap:18px;margin:4px 0 8px}.tutorial-faction-crests img{width:36px;height:42px} .tutorial-faction-content .tutorial-meta{margin:12px 0}.tutorial-faction-guide .tutorial-faction-actions{gap:10px;margin-top:14px}.tutorial-faction-actions button{flex:1 1 auto} .tutorial-faction-guide .tutorial-faction-choices{grid-template-columns:1fr;gap:10px;margin-top:14px}.tutorial-guide.tutorial-faction-guide .tutorial-faction-choice{grid-template-columns:30px minmax(0,1fr) auto;gap:10px;padding:6px;text-align:left} .tutorial-faction-choice>img,.tutorial-faction-choice>.faction-icon{grid-row:1;width:28px;height:34px}.tutorial-faction-guide .tutorial-faction-choice h3{margin:0;font-size:12px}.tutorial-faction-choice button{grid-column:3;margin:0;max-width:140px}.tutorial-faction-guide .tutorial-faction-actions button,.tutorial-faction-guide .tutorial-faction-choice button,.tutorial-faction-guide .tutorial-exit{min-height:36px;font-size:11px;padding:4px 7px} .tutorial-faction-content .faction-war-scene{height:170px} } .faction-war-camera [data-faction-action="overview"]{display:grid;place-items:center;min-width:44px}.faction-war-camera [data-faction-action="overview"][aria-pressed="true"]{border-color:#edce8e;color:#ffe0a0} .faction-nav-alert{display:inline-block;width:9px;height:9px;flex:0 0 9px;margin-left:auto;border-radius:50%;background:#f6cc61;box-shadow:0 0 0 3px #f6cc6126}.faction-nav-alert[data-phase="battle"]{background:#ff785f;box-shadow:0 0 0 3px #ff785f30}.faction-nav-alert[hidden]{display:none}.mobile-nav button:has(.faction-nav-alert){position:relative}.mobile-nav .faction-nav-alert{position:absolute;top:7px;right:calc(50% - 21px);margin:0} .faction-battle-toolbar{display:flex;align-items:center;gap:20px;padding:10px 14px;background:#1b252e;border-bottom:1px solid #3d4c56} .war-band-picker{display:flex;align-items:center;gap:10px;flex:0 0 auto;margin:0;font-size:.8rem} .war-band-picker>span{white-space:nowrap} .war-band-picker select{width:168px;min-height:44px;margin:0;padding:9px 28px 9px 11px;font-size:.85rem;font-weight:650;background-color:#111b24;border-color:#617180} .war-band-picker select:hover{border-color:#a3b0b9} .faction-battle-toolbar .faction-battle-heading{flex:1;min-width:250px;padding:0 0 0 18px;border-left:1px solid #3d4c56} .faction-battle-toolbar .faction-battle-team img{width:32px;height:36px} .faction-battle-toolbar .faction-battle-clock>span{font-size:1.1rem;font-weight:700;line-height:1.2} .war-band-capacity{margin-left:auto;font-size:.8rem;color:var(--muted)} .war-reward-rule{margin:0 14px;border-bottom:1px solid #35414c;font-size:.8rem;color:#d2c7b0} .war-reward-rule>summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:64px;padding:10px 0;list-style:none} .war-reward-rule>summary::-webkit-details-marker{display:none} .war-reward-rule[open]>summary{margin-bottom:0} .war-reward-summary{display:flex;align-items:center;gap:10px;min-width:0} .war-reward-summary>span:last-child{display:grid;gap:2px;line-height:1.4} .war-reward-summary strong{font-size:.75rem;color:var(--muted);font-weight:500} .war-reward-summary>span>span{color:#edd49e;font-weight:600} .war-reward-more{display:flex;align-items:center;gap:8px;flex-shrink:0;color:var(--muted);font-size:.75rem} .war-reward-more>span{font-size:1.1rem;transition:transform .18s} .war-reward-rule[open] .war-reward-more>span{transform:rotate(180deg)} .war-reward-rule>summary:hover .war-reward-more{color:var(--text)} .war-reward-details{padding:0 0 12px 39px;max-width:760px} .war-reward-details p{font-size:.8rem;margin:0 0 8px} .war-reward-details p:last-child{margin-bottom:0} @media(max-width:1100px){ .faction-battle-toolbar{flex-wrap:wrap;gap:10px 16px} .faction-battle-toolbar .faction-battle-heading{padding-left:14px} .war-band-picker{gap:8px} .war-band-picker select{width:156px} } @media(max-width:600px){ .faction-battle-toolbar{display:grid;gap:8px;padding:10px} .war-band-picker{justify-content:space-between} .war-band-picker select{width:174px;font-size:1rem} .faction-battle-toolbar .faction-battle-heading{min-width:0;border-left:0;padding:8px 0 0;border-top:1px solid #35414c} .faction-battle-toolbar .faction-battle-team img{width:27px;height:32px} .war-band-capacity{margin:0} .war-reward-rule{margin:0 10px} .war-reward-rule>summary{gap:8px;min-height:76px} .war-reward-summary{gap:8px} .war-reward-summary>span>span{font-size:.8rem} .war-reward-more{gap:5px;font-size:.7rem} .war-reward-details{padding-left:0} } .faction-card-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px} .faction-card-actions button{min-height:44px} .faction-card-actions .faction-donate-shortcut{display:flex;align-items:center;justify-content:center;gap:6px;color:var(--f-gold);border-color:#857047;background:#332e23} .faction-donate-shortcut .faction-icon{width:23px;height:23px} .faction-change-wait{margin:0 0 18px;padding:0 1px;font-size:.75rem} .faction-change-wait strong{display:block;margin-top:4px;color:var(--f-gold);font-variant-numeric:tabular-nums} .faction-change-wait strong[hidden]{display:none} .factions-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px} .factions-tabs button{min-width:0;min-height:46px;padding:10px 8px;justify-content:center} .faction-donation-layout{display:grid;gap:18px;min-width:0} .faction-donation-heading{display:flex;align-items:flex-start;gap:12px;margin-bottom:18px} .faction-donation-heading>.faction-icon{width:38px;height:38px} .faction-donation-heading h2{margin:0 0 5px} .faction-donation-heading p{margin:0} .faction-donation form{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start} .faction-donation form>label{min-width:0} .faction-donation input,.faction-donation select{min-height:46px;font-size:1rem} .faction-donation-preview{min-height:66px;border:1px solid #617359;background:#25332b} .faction-donation-preview span{min-width:0;overflow-wrap:anywhere} .faction-donation-consequence{grid-column:1/-1;line-height:1.5} .faction-donation form>button{min-height:46px} .faction-donation details,.faction-donors details{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:.8rem} .faction-donation details p,.faction-donors details p{font-size:.8rem;margin:10px 0 0} .faction-recent-donations{margin:0;padding:18px 20px;border:1px solid var(--line);border-radius:10px;background:#18222b} .faction-donation-log{margin-bottom:0} .faction-donation-log li:last-child{border-bottom:0}.faction-donors{min-width:0} @container(max-width:620px){.faction-card-actions{grid-template-columns:1fr}} @container(min-width:1020px){.faction-donation-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}.faction-donation-layout>.faction-donors{grid-column:2;grid-row:1/span 2}} @media(max-width:600px){ .faction-card-actions{grid-template-columns:1fr;gap:7px} .factions-tabs button{flex-direction:column;gap:5px;min-height:66px;padding:8px 3px;font-size:.72rem} .factions-tabs .faction-icon{width:23px;height:23px} .faction-donation,.faction-recent-donations{padding:16px 12px} .faction-donation form{grid-template-columns:1fr} } .faction-chat-messages li{border-radius:4px;padding-inline:4px;-webkit-touch-callout:none}.faction-chat-messages li:hover{background:#ffffff1f}.faction-chat-messages .faction-chat-admin strong,.faction-chat-messages .faction-chat-admin .faction-chat-text{color:#d9b8ff} .faction-points{font-variant-numeric:tabular-nums;font-weight:700;font-size:.8rem;white-space:normal} .faction-points.is-positive{color:#8feaab}.faction-points.is-neutral{color:#fff}.faction-points.is-negative{color:#ff9393} .combat-faction-preview{margin:12px 0}.competitor-row .faction-points{display:block;margin-top:5px}.player-card .actions>.faction-points{align-self:center} .faction-confirm .faction-reset-warning{padding:12px 14px;border:1px solid #b97c4c;border-left:3px solid #eab577;background:#38291e;color:#ffd5aa;line-height:1.6} /* Banco Mastro: the website's charcoal, paper and yellow, adapted for play. */ :root{ --bg:var(--mastro-bg);--panel:var(--mastro-surface);--line:var(--mastro-line); --text:var(--mastro-paper);--muted:var(--mastro-muted);--gold:var(--mastro-gold); --teal:var(--mastro-success);--red:var(--mastro-danger); --paper:var(--mastro-paper);--ink:var(--mastro-ink); --surface-deep:var(--mastro-deep);--surface-raised:var(--mastro-raised); } body{background:var(--bg);color:var(--text);font-family:var(--mastro-font-body)} .session-overlay{position:fixed;inset:0;margin:0;width:100%;height:100%;max-width:none;max-height:none;padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));border:0;background:transparent;color:var(--text);box-sizing:border-box;overflow:auto;font-family:var(--mastro-font-body)} .session-overlay[open]{display:grid;place-items:center} .session-overlay::backdrop{background:var(--mastro-backdrop);backdrop-filter:blur(5px)} .session-overlay-card{width:min(100%,460px);padding:clamp(24px,5vw,36px);border:1px solid var(--mastro-line-strong);border-top:3px solid var(--gold);border-radius:var(--mastro-radius-card);background:var(--mastro-surface);box-shadow:0 24px 80px var(--mastro-shadow-soft);animation:session-overlay-enter .18s ease-out both} .session-overlay-card h2{margin:0 0 16px;font-family:var(--mastro-font-display);font-size:clamp(1.8rem,6vw,2.3rem);font-weight:500;line-height:1.1} .session-overlay-card p{margin:0 0 24px;color:var(--muted);line-height:1.6;font-size:.95rem} .session-overlay-card .session-overlay-error{color:var(--red);font-size:.85rem} .session-overlay-error:empty{display:none} .session-overlay-card button{width:100%;min-height:48px;white-space:normal} @keyframes session-overlay-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}} button,input,select{font-family:inherit} button{background:var(--mastro-raised);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control);font-weight:500;box-shadow:0 2px 0 var(--mastro-deep);transition:background .18s,border-color .18s,box-shadow .18s} button:hover:not(:disabled){background:var(--mastro-line);border-color:var(--mastro-muted)} button:disabled{opacity:.65;box-shadow:none} button.primary,.primary{background:var(--gold);color:var(--mastro-subtle);border-color:var(--mastro-gold-border);box-shadow:3px 3px 0 var(--mastro-deep)} button.primary:hover:not(:disabled),.primary:hover:not(:disabled){background:var(--mastro-gold-border);border-color:var(--mastro-gold-border);box-shadow:4px 4px 0 var(--mastro-deep)} .quiet,.level-link{background:var(--mastro-surface);border-color:var(--mastro-line-strong);color:var(--text);box-shadow:none} input:not([type=checkbox]):not([type=range]),select,textarea{background:var(--mastro-bg);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control);color:var(--text)} input::placeholder,textarea::placeholder{color:var(--mastro-muted)} :focus-visible{outline-color:var(--gold);outline-offset:3px} progress,progress::-webkit-progress-bar{background:var(--mastro-line);border-radius:2px} progress::-webkit-progress-value{border-radius:2px} ::selection{background:var(--mastro-gold-hover);color:var(--mastro-subtle)} /* Navigation and a persistent account column frame the active screen. */ .navigation-panel{min-width:0;overflow-x:hidden;background:var(--mastro-deep);border-color:var(--mastro-line);padding:12px;gap:8px} .sidebar-brand{height:48px;width:150px;margin-bottom:0} .side-nav{min-width:0;gap:2px} .side-nav button{border-radius:var(--mastro-radius-control);min-height:45px;font-size:.83rem;font-weight:500;letter-spacing:.005em;color:var(--mastro-muted);box-shadow:none} .side-nav button:hover:not(:disabled){background:var(--mastro-raised);border-color:var(--mastro-line);color:var(--mastro-muted)} .side-nav button.active,.side-nav button.active:hover:not(:disabled){background:var(--gold);color:var(--mastro-bg);border-color:var(--mastro-gold-border);box-shadow:3px 3px 0 var(--mastro-deep);font-weight:500} .side-nav button.active .point{background:var(--mastro-subtle);color:var(--mastro-gold-border)} .navigation-dialog .side-nav button.active{background:var(--gold);color:var(--mastro-bg);border-color:var(--mastro-gold-border)} .navigation-panel .side-nav button>.faction-nav-icon{display:block;width:24px;height:24px;flex:0 0 24px} .navigation-panel .side-nav button>.faction-nav-alert{display:block;width:9px;height:9px;flex:0 0 9px} .navigation-panel .side-nav button>.faction-nav-alert[hidden]{display:none} /* A compact, shared season shortcut for the city menu and mobile activity row. */ .side-nav button.pass-shortcut,.mobile-activity button.pass-shortcut{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:5px 8px;width:100%;min-width:0;padding:8px;text-align:left;background:var(--mastro-surface);border:1px solid var(--mastro-line);color:var(--paper);box-shadow:none} .game-shell>.navigation-panel .side-nav button.pass-shortcut{min-height:58px;padding-block:8px;margin-top:5px} .pass-shortcut-icon{display:block;width:24px;height:28px;object-fit:contain;image-rendering:auto} .side-nav button.pass-shortcut>.pass-shortcut-copy,.mobile-activity .pass-shortcut-copy{position:static;display:grid;gap:4px;min-width:0;width:auto;height:auto;clip-path:none;overflow:visible} .pass-shortcut-heading{display:flex;align-items:baseline;justify-content:space-between;gap:5px;min-width:0;white-space:nowrap;line-height:1.2} .pass-shortcut-heading strong{font-size:.76rem;font-weight:500;color:var(--paper)} .pass-shortcut-heading>span{font-size:.65rem;font-variant-numeric:tabular-nums;color:var(--muted)} .pass-shortcut-status{display:flex;align-items:center;gap:4px;font-size:.65rem;line-height:1.2;color:var(--muted)} .pass-shortcut-status .ui-icon{width:12px;height:12px;flex-shrink:0} .pass-shortcut progress{grid-column:1/-1;width:100%;height:3px} .side-nav button.pass-shortcut.is-ready,.mobile-activity button.pass-shortcut.is-ready{border-color:var(--teal)} .pass-shortcut.is-ready .pass-shortcut-status{color:var(--teal)} .side-nav button.pass-shortcut:hover,.mobile-activity button.pass-shortcut:hover,.side-nav button.pass-shortcut.is-active,.mobile-activity button.pass-shortcut.is-active{background:var(--mastro-raised);border-color:var(--gold)} .pass-shortcut:focus-visible{outline:2px solid var(--gold);outline-offset:2px} @media(max-width:900px){ .mobile-activity{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:2px 0 4px;min-width:0} .mobile-activity>.pass-shortcut{height:100%;min-height:60px;border-radius:var(--mastro-radius-control)} .game-shell .mobile-activity>.fraud-timer-compact{height:100%;min-height:60px;margin:0;padding:6px 8px;gap:4px 6px} .mobile-activity .fraud-timer-name{display:block} .mobile-activity .fraud-timer-name small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.63rem} .game-shell .mobile-activity>.mobile-fraud-shortcut{display:flex;align-items:center;justify-content:flex-start;gap:8px;width:100%;min-width:0;min-height:60px;padding:8px;text-align:left;border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control);background:var(--mastro-subtle);box-shadow:none} .mobile-fraud-shortcut>.pixel-icon{width:24px;height:24px;flex-shrink:0;margin:0} .mobile-fraud-shortcut>span{display:grid;gap:4px;min-width:0} .mobile-fraud-shortcut strong{font-size:.76rem;font-weight:500;color:var(--paper)} .mobile-fraud-shortcut small{font-size:.65rem;color:var(--muted)} .navigation-dialog .side-nav button.pass-shortcut{margin:0;min-height:60px;padding:8px} .navigation-dialog .side-nav button.pass-shortcut>.pass-shortcut-copy{display:grid} } .navigation-footer{border-top:1px solid var(--mastro-raised);padding-top:8px;gap:4px} .navigation-footer>button{border-color:var(--mastro-line);background:var(--mastro-surface);font-size:.8rem;min-height:42px} @media(min-width:901px){ body.is-playing{background:linear-gradient(90deg,var(--mastro-deep) 50%,var(--bg) 50%)} .game-shell>.navigation-panel{--navigation-row-height:36px;--navigation-row-padding:6px} .game-shell>.navigation-panel :is(.side-nav,.navigation-footer) button:not(.coin-offer-nav):not(.coin-offer-hide):not(.push-offer-nav):not(.push-offer-dismiss):not(.pass-shortcut){min-height:var(--navigation-row-height);padding-block:var(--navigation-row-padding)} .game-shell>.navigation-panel .navigation-footer>.online-counter{margin:0;padding-block:2px} .game-shell>.navigation-panel .nav-status{background:var(--mastro-deep);padding-bottom:2px} } @media(min-width:901px) and (max-height:800px){ .game-shell>.navigation-panel{--navigation-row-height:32px;--navigation-row-padding:4px;padding-block:10px;gap:6px} .game-shell>.navigation-panel .sidebar-brand{height:40px} } @media(min-width:901px) and (max-height:650px){ .game-shell>.navigation-panel{--navigation-row-height:28px;--navigation-row-padding:2px;padding-block:8px;gap:4px} .game-shell>.navigation-panel .sidebar-brand{height:32px} .game-shell>.navigation-panel .side-nav{gap:1px} .game-shell>.navigation-panel .navigation-footer{gap:2px;padding-top:4px} } @media(min-width:901px) and (pointer:coarse){ .game-shell>.navigation-panel{--navigation-row-height:44px;--navigation-row-padding:10px} } .game-shell>.game-content{padding:28px 26px 34px;background:radial-gradient(ellipse at 25% 0,var(--mastro-glow),transparent 55%),var(--bg)} .game-content .section-head{padding-bottom:18px;margin-bottom:22px;border-bottom:1px solid var(--mastro-line);gap:16px;align-items:center} .game-content h1{font-family:var(--mastro-font-display);font-size:2.8rem;font-weight:500;letter-spacing:-.015em;line-height:1.03;margin:0;color:var(--paper)} .game-content .section-head h1{position:relative;padding-left:17px} .game-content .section-head h1::before{content:'';position:absolute;left:0;top:10%;bottom:7%;width:5px;background:var(--gold);transform:skewY(-12deg)} .game-content .section-head p{font-size:.78rem;margin-top:7px;color:var(--muted)} .game-content h2,.game-content h3{letter-spacing:-.015em} .game-content .card{background:var(--panel);border-color:var(--mastro-line);border-radius:var(--mastro-radius-card);box-shadow:0 4px 0 var(--mastro-shadow-soft);padding:20px} .game-content .card-grid,.game-content .people-grid{gap:16px} .game-content .card-title h2{font-family:var(--mastro-font-display);font-weight:500;font-size:1.6rem;line-height:1.1;color:var(--mastro-muted)} .subtabs{gap:6px;border-bottom:1px solid var(--mastro-line);padding-bottom:12px;margin-bottom:20px} .subtabs button{border-color:transparent;border-radius:3px;background:transparent;color:var(--mastro-muted);padding:10px 15px;box-shadow:none;min-height:42px} .subtabs button.selected{background:var(--paper);border-color:var(--paper);color:var(--mastro-surface);box-shadow:3px 3px 0 var(--mastro-deep);font-weight:500} .player-panel{background:var(--mastro-bg);border-left:1px solid var(--mastro-line);padding:18px 14px;gap:13px} .player-block{background:var(--mastro-surface);border-color:var(--mastro-line);border-radius:var(--mastro-radius-card);padding:14px} .avatar-panel{background:var(--mastro-subtle);border-color:var(--mastro-line-strong);padding:6px 8px 10px} .avatar-panel figcaption{font-size:.84rem;padding-block:8px 4px;color:var(--paper)} .player-level-row{font-size:.78rem;padding-top:5px} .player-cash{font-family:var(--mastro-font-display);font-size:2.15rem;font-weight:500;letter-spacing:.01em;color:var(--gold)} .player-budget,.player-budget button,.resource-meter>span{font-size:.77rem} .player-resources .premium-balance{background:var(--mastro-surface);border-color:var(--mastro-gold-subtle);color:var(--mastro-gold-border)} .side-stats>div{padding-block:4px} .side-stats dd{color:var(--mastro-muted)} .player-panel button.level-link{background:var(--mastro-raised);border-color:var(--mastro-line-strong)} .player-panel .upgrade-quantity button{border-radius:3px} .player-panel .upgrade-quantity button.selected{background:var(--gold);color:var(--mastro-subtle);border-color:var(--gold)} /* Frauds: separate the decision, costs and running result from the catalogue. */ .fraud-view .section-head{margin-bottom:16px} .fraud-workspace{gap:20px;grid-template-columns:minmax(0,1.2fr) minmax(220px,.9fr)} .game-content .fraud-detail{border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-card);padding:22px;background:var(--mastro-surface)} .fraud-overview{gap:18px;padding-bottom:18px;border-bottom:0;margin-bottom:0} .fraud-heading h2{font-family:var(--mastro-font-display);font-size:2.2rem;font-weight:500;line-height:1.05;color:var(--paper);margin-bottom:12px} .fraud-heading>p{font-size:.82rem;line-height:1.6;color:var(--mastro-muted)} .fraud-chance .chance{font-family:var(--mastro-font-display);font-size:2.1rem;font-weight:500;color:var(--teal);line-height:1} .fraud-metrics{padding:17px 0;gap:17px 16px;border-color:var(--mastro-line);margin-bottom:12px} .fraud-metrics dt{color:var(--mastro-muted);font-size:.74rem} .fraud-metrics dd{font-variant-numeric:tabular-nums;font-size:1.05rem;font-weight:500} .fraud-metrics .metric-return dd{color:var(--mastro-success);font-size:1.2rem} .fraud-catalogue{background:var(--mastro-subtle);border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-card);overflow:hidden} .fraud-catalogue>h2{font-family:var(--mastro-font-display);font-size:1.4rem;font-weight:500;background:var(--paper);color:var(--mastro-surface);border:0;padding:13px 16px} .fraud-catalogue>h2 small{color:var(--mastro-line)} .fraud-list{padding:9px;gap:7px} .fraud-list-button{background:var(--mastro-raised);border:1px solid transparent;border-radius:var(--mastro-radius-control);box-shadow:none;padding:11px 10px;gap:10px;min-height:76px} .fraud-list-button:hover:not(:disabled){background:var(--mastro-raised);border-color:var(--mastro-line-strong)} .fraud-list-button.selected,.fraud-list-button.selected:hover,.fraud-list-button.selected.is-locked{background:var(--mastro-paper);border-color:var(--mastro-white);color:var(--mastro-surface);box-shadow:3px 3px 0 var(--mastro-deep)} .fraud-list-button.selected .fraud-option-copy>strong,.fraud-list-button.selected .fraud-option-copy>small{color:var(--mastro-raised)} .fraud-option-copy>strong{font-size:.87rem;line-height:1.35} .fraud-option-copy>small{font-size:.74rem;line-height:1.55;color:var(--mastro-muted);margin-top:4px} .fraud-list-button.selected .current-fraud-tag{background:var(--mastro-raised);color:var(--mastro-muted);border-color:var(--mastro-line-strong)} .fraud-timer{background:var(--mastro-surface);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control)} .game-shell .player-resources .fraud-timer-compact{background:var(--mastro-surface);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control)} .fraud-apply{font-weight:500;letter-spacing:.01em;min-height:48px} .next-steps{background:var(--mastro-subtle);border-color:var(--mastro-line);border-radius:var(--mastro-radius-card);padding:18px} .next-steps h2,.daily-goals>summary{font-size:.81rem;font-weight:500} .next-steps-grid>div{border-color:var(--mastro-gold-subtle)} .daily-goals{border-color:var(--mastro-line);background:var(--mastro-surface);border-radius:var(--mastro-radius-card);margin-bottom:15px} .daily-goals>summary{padding:13px 15px;min-height:44px} /* The same surfaces carry businesses, contacts, items and the marketplace. */ .game-content .business-card{padding:18px;gap:18px;border-top:3px solid var(--mastro-gold-subtle);background:linear-gradient(120deg,var(--mastro-raised),var(--mastro-surface))} .game-content .business-card{--business-art-size:84px;grid-template-columns:var(--business-art-size) minmax(0,1fr)} .game-content .business-card>.building{width:var(--business-art-size);height:var(--business-art-size);padding:0;background:transparent;border:0;border-radius:0;box-shadow:none} .business-content h2{font-family:var(--mastro-font-display);font-size:1.65rem;font-weight:500;line-height:1.1;margin-bottom:12px} .manager-picker>summary{background:var(--mastro-bg);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control);padding:9px 11px} .manager-options{background:var(--mastro-subtle);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-card)} .manager-option{background:var(--mastro-raised);border-color:var(--mastro-line);border-radius:3px} .managed-business,.bonus-source,.service-card{background:var(--mastro-subtle);border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-control)} .game-content .person-card{align-items:flex-start;border-top:3px solid var(--mastro-line-strong);gap:15px;padding:18px} .game-content .person-card>.portrait{width:80px;height:80px;background:var(--mastro-bg)!important;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-card)} .game-content .person-card.locked-person{border-top:1px solid var(--mastro-line);background:var(--mastro-surface);box-shadow:none} .person-content p{line-height:1.55} .person-content .actions{gap:7px} .person-content button{padding:9px 12px} .player-card .person-content .player-social-actions{display:grid;grid-template-columns:minmax(0,1fr);width:168px;max-width:100%;gap:7px} .player-social-actions>button{width:100%;min-height:44px;gap:7px;white-space:normal} .player-social-actions>.faction-points{text-align:center} .player-social-actions>button.social-action-locked{opacity:.65;cursor:help;box-shadow:none} .player-social-actions>button.social-action-locked:hover{box-shadow:none} .player-social-actions .ui-icon{flex-shrink:0} .game-content .shop-card,.game-content .lawyer-card,.game-content .club-card{border-top:3px solid var(--mastro-line-strong)} .game-content .shop-card h3,.game-content .lawyer-card h2,.game-content .club-card h2{font-family:var(--mastro-font-display);font-size:1.55rem;font-weight:500;line-height:1.12} .item-slot,.equipment-slot{border-color:var(--mastro-line-strong);background:var(--mastro-bg)} .item-tooltip,.item-info,.market-filters,.listing-card,.inventory-summary{background:var(--mastro-surface);border-color:var(--mastro-line)} .room-chat{background:var(--mastro-subtle);border-color:var(--mastro-line);border-radius:var(--mastro-radius-card)} .room-chat-heading,.room-chat-form{background:var(--mastro-surface);border-color:var(--mastro-line)} .room-message{border-color:var(--mastro-raised)} .highscores-table,.highscores-scroll{border-color:var(--mastro-line);background:var(--mastro-surface)} .highscores-table thead{background:var(--paper);color:var(--mastro-surface)} .highscores-table thead th{color:var(--mastro-raised);border-color:var(--mastro-muted)} .highscores-table thead small{color:var(--mastro-line)} .highscores-table td,.highscores-table th{border-color:var(--mastro-line)} .highscores-table tbody tr:nth-child(even){background:var(--mastro-surface)} .highscores-table tbody tr.is-self{background:var(--mastro-raised)} /* Dialogs retain their actions, consequences and animation controls. */ .modal-backdrop{background:var(--mastro-backdrop)} .dialog{background:var(--mastro-surface);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-card);box-shadow:10px 10px 0 var(--mastro-shadow-soft),0 20px 80px var(--mastro-shadow-soft)} .dialog h2{font-family:var(--mastro-font-display);font-weight:500;font-size:2rem;line-height:1.1;color:var(--paper)} .dialog-close button{border-color:var(--mastro-line-strong);background:var(--mastro-raised);border-radius:3px;min-height:36px} .budget-summary>div,.change-chip,.toast-art{background:var(--mastro-bg);border-color:var(--mastro-line);border-radius:var(--mastro-radius-control)} .budget-group{border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control)} .toast-card{background:var(--mastro-raised);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-card);box-shadow:5px 5px 0 var(--mastro-shadow-soft)} .toast-copy>p{color:var(--mastro-muted)} .toast-failure{background:var(--mastro-raised);border-color:var(--mastro-danger)} .legal-scroll,.legal-checks,.legal-heading{background:var(--mastro-subtle);border-color:var(--mastro-line-strong)} .legal-heading h2{color:var(--paper)} .tutorial-bubble{background:var(--mastro-backdrop);border-color:var(--mastro-gold-hover);border-radius:var(--mastro-radius-card);box-shadow:6px 6px 0 var(--mastro-shadow-soft)} .tutorial-bubble h2{font-family:var(--mastro-font-display);font-size:1.4rem;color:var(--paper)} .tutorial-bubble small,.tutorial-facts dt{color:var(--mastro-muted)} .tutorial-facts{background:var(--mastro-raised);border-color:var(--mastro-line-strong);border-radius:3px} .tutorial-faction-heading{background:var(--mastro-raised);border-color:var(--mastro-line-strong)} .factions-hero,.faction-panel,.faction-battle-toolbar,.faction-battle-heading{background-color:var(--mastro-surface);border-color:var(--mastro-line)} .faction-panel>h2,.factions-heading h1{font-family:var(--mastro-font-display)} .war-band-picker select{background-color:var(--mastro-bg);border-color:var(--mastro-line-strong)} .faction-leaderboard,.faction-donations{background-color:var(--mastro-surface);border-color:var(--mastro-line)} /* The offer has its own breathing room before the ordinary navigation. */ .side-nav button.coin-offer-nav,.coin-shop-offer .coin-offer-nav,.mobile-offers .coin-offer-nav{display:flex;gap:8px;padding:9px 8px;margin-bottom:12px;min-height:64px;border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-card);background:linear-gradient(120deg,var(--mastro-gold-subtle),var(--mastro-surface) 75%);box-shadow:inset 0 2px var(--gold);color:var(--paper)} .side-nav .push-offer{display:grid;min-width:0;margin-bottom:8px;border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-card);background:linear-gradient(120deg,var(--mastro-gold-subtle),var(--mastro-surface) 75%);box-shadow:inset 2px 0 var(--gold)} .side-nav .push-offer[hidden]{display:none} .side-nav button.push-offer-nav{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:8px;width:100%;min-width:0;min-height:60px;margin:0;padding:10px 8px;text-align:left;white-space:normal;border:0;background:transparent;box-shadow:none;color:var(--paper)} .side-nav button.push-offer-dismiss{width:100%;min-width:0;min-height:44px;margin:0;padding:6px 8px;border:0;border-top:1px solid var(--mastro-line);background:transparent;box-shadow:none;color:var(--muted);font-size:.75rem;font-weight:500;line-height:1.35;white-space:normal} .side-nav .push-offer-icon{display:block;width:24px;height:24px;object-fit:contain;image-rendering:auto} .side-nav button.push-offer-nav>span{display:grid;gap:3px;min-width:0;white-space:normal;overflow-wrap:anywhere} .side-nav .push-offer-nav strong,.side-nav .push-offer-nav small{display:block;line-height:1.35} .side-nav .push-offer-nav strong{font-size:.8125rem;color:var(--gold)} .side-nav .push-offer-nav small{font-size:.75rem;color:var(--muted)} .side-nav button.push-offer-nav:hover:not(:disabled){border-color:var(--gold);background:var(--mastro-raised);color:var(--paper)} .side-nav button.push-offer-dismiss:hover:not(:disabled){background:var(--mastro-raised);color:var(--paper)} .push-offer-nav:focus-visible,.push-offer-dismiss:focus-visible{outline:2px solid var(--gold);outline-offset:2px} .side-nav button.coin-offer-nav:hover,.coin-shop-offer .coin-offer-nav:hover,.mobile-offers .coin-offer-nav:hover{border-color:var(--gold);background:var(--mastro-raised);color:var(--paper)} .coin-offer-nav:focus-visible{outline:2px solid var(--gold);outline-offset:3px} .side-nav .coin-offer-nav .coin-offer-icon,.coin-shop-offer .coin-offer-icon,.mobile-offers .coin-offer-icon{width:36px;height:40px;filter:drop-shadow(0 3px 4px var(--mastro-shadow-soft))} .side-nav button.coin-offer-nav>.coin-offer-copy,.coin-shop-offer .coin-offer-copy,.mobile-offers .coin-offer-copy{display:grid;grid-template-columns:minmax(0,1fr);gap:5px;min-width:0;flex:1} .coin-offer-heading{display:flex;align-items:center;gap:5px;flex-wrap:wrap} .side-nav .coin-offer-nav strong,.coin-shop-offer .coin-offer-nav strong,.mobile-offers .coin-offer-nav strong{grid-area:auto;font-size:.8rem;line-height:1.2;color:var(--paper);white-space:nowrap} .coin-offer-discount{display:inline-flex;align-items:center;padding:2px 4px;border-radius:2px;background:var(--gold);color:var(--mastro-ink);font-size:.65rem;line-height:1.2;white-space:nowrap} .side-nav .coin-offer-nav small,.coin-shop-offer .coin-offer-nav small,.mobile-offers .coin-offer-nav small{grid-area:auto;display:flex;align-items:center;gap:4px;font-size:.63rem;line-height:1.2;color:var(--muted)} .coin-offer-nav small .ui-icon{width:12px;height:12px} .side-nav .coin-offer-nav time,.coin-shop-offer .coin-offer-nav time,.mobile-offers .coin-offer-nav time{font-size:.73rem;letter-spacing:.02em;color:var(--mastro-gold-border)} /* Hiding a highlight never removes the live offer from the shop. */ .coin-offer-feature{position:relative;min-width:0;margin-bottom:12px} .side-nav>.coin-offer-feature,.side-nav>.push-offer{flex-shrink:0} .coin-offer-feature[hidden]{display:none} .side-nav .coin-offer-feature>.coin-offer-nav,.mobile-offers .coin-offer-feature>.coin-offer-nav{width:100%;margin:0;padding-right:48px} .coin-offer-feature .coin-offer-nav strong{white-space:normal} .side-nav button.coin-offer-hide,.mobile-offers button.coin-offer-hide{position:absolute;right:0;top:0;display:grid;place-items:center;width:44px;height:44px;min-height:44px;margin:0;padding:0;border:0;background:transparent;box-shadow:none;color:var(--muted)} .coin-offer-hide .ui-icon{width:18px;height:18px} .coin-offer-hide:focus-visible{outline:2px solid var(--gold);outline-offset:-4px} .coin-offer-hide-copy p{color:var(--muted);line-height:1.5} .coin-offer-hide-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-top:20px} .coin-offer-hide-actions button{min-height:44px;white-space:normal} .coin-shop-offer{min-width:0;margin:16px 0} .coin-shop-offer .coin-offer-nav{width:100%;min-width:0;margin:0;align-items:center;text-align:left} .mobile-offers{display:none} :is(.mobile-push-offer,.mobile-social-offer){display:grid;gap:8px;min-width:0;padding:10px;border:1px solid var(--mastro-gold-border);border-radius:var(--mastro-radius-card);background:linear-gradient(120deg,var(--mastro-gold-subtle),var(--mastro-surface) 75%);box-shadow:inset 2px 0 var(--gold)} :is(.mobile-push-offer,.mobile-social-offer)[hidden]{display:none} .mobile-push-copy{display:flex;align-items:center;gap:8px;min-width:0} .mobile-push-copy>div{min-width:0} .mobile-push-icon{width:28px;height:28px;flex:none;object-fit:contain;image-rendering:auto} .mobile-push-copy strong{display:block;color:var(--gold);font-size:.9rem;line-height:1.3} :is(.mobile-push-offer,.mobile-social-offer) p{margin:3px 0 0;font-size:.75rem;line-height:1.4;color:var(--muted)} :is(.mobile-push-offer,.mobile-social-offer)>small{font-size:.75rem;line-height:1.4;color:var(--muted)} .mobile-push-actions{display:flex;flex-wrap:wrap;gap:8px} .mobile-push-actions button{min-width:0;min-height:44px;white-space:normal;padding:8px 12px;font-size:.8rem;line-height:1.3} .mobile-push-actions .primary{flex:1} .social-offer-dialog{display:grid;gap:16px;min-width:0} .social-offer-heading{display:flex;align-items:center;gap:10px} .social-offer-heading h2{margin:0} .social-offer-dialog>p{margin:0;color:var(--muted);line-height:1.6} .social-profile-link{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 14px;border:1px solid var(--mastro-gold-border);border-radius:var(--mastro-radius-control);background:var(--gold);color:var(--mastro-ink);text-decoration:none} .social-profile-link[aria-disabled=true]{opacity:.6;cursor:wait} .social-profile-link:focus-visible{outline:2px solid var(--gold);outline-offset:3px} #social-offer-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;min-width:0} #social-offer-form label,#social-offer-result{grid-column:1/-1} #social-offer-form input{width:100%;min-width:0;min-height:44px;margin:0;box-sizing:border-box} #social-offer-form button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin:0} #social-offer-result{min-height:1.5em;margin:0;color:var(--muted);font-size:.85rem;line-height:1.5;overflow-wrap:anywhere} #social-offer-result[role=alert]{color:var(--red)} .social-offer-dialog>.push-offer-dismiss{min-height:44px} .social-check-spinner{width:14px;height:14px;flex:none;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:social-check-spin .7s linear infinite} @keyframes social-check-spin{to{transform:rotate(360deg)}} @media(max-width:900px){.mobile-offers .coin-offer-feature{margin:0}.mobile-offers{display:grid;gap:8px;min-width:0;margin:0 0 16px}.mobile-offers .coin-offer-nav{width:100%;min-width:0;min-height:64px;margin:0;text-align:left;padding:10px}.mobile-offers .coin-offer-heading{gap:8px}.mobile-offers .coin-offer-nav strong{font-size:.95rem}.mobile-offers .coin-offer-nav small{font-size:.75rem}.mobile-offers .coin-offer-nav time{font-size:.85rem}} .premium-card,.coin-pack,.frame-card{border-color:var(--mastro-line-strong);background-color:var(--mastro-surface)} .character-selection .card,.character-summary,.character-create{border-color:var(--mastro-line-strong);background-color:var(--mastro-surface)} .character-selection h1,.access-screen h1{font-family:var(--mastro-font-display);font-weight:500;font-size:3.4rem;color:var(--paper)} .access-screen{background:radial-gradient(ellipse at 90% 50%,var(--mastro-glow),transparent 65%)} .access-screen .title-actions button{min-height:52px;border-radius:var(--mastro-radius-control)} .access-screen .oauth-discord{background:var(--mastro-discord);border-color:var(--mastro-discord-line);color:var(--mastro-white)} .access-screen .oauth-discord:hover:not(:disabled){background:var(--mastro-discord-hover)} @media(min-width:951px){ .game-shell>.game-content.fraud-view{padding-bottom:24px} .fraud-detail{scrollbar-color:var(--mastro-line-strong) var(--mastro-subtle)} .fraud-list{scrollbar-color:var(--mastro-line-strong) var(--mastro-subtle)} } @media(min-width:701px) and (max-width:1100px){ .game-shell>.game-content{padding:22px 16px 28px} .game-content .fraud-detail{padding:16px} .fraud-workspace{gap:12px} .fraud-heading h2{font-size:1.85rem} .player-panel{padding:14px 10px} } @media(max-width:700px){ .game-shell>.game-content{padding:22px 16px calc(24px + env(safe-area-inset-bottom))} .game-content h1{font-size:2.3rem} .game-content .section-head{padding-bottom:14px;margin-bottom:16px;gap:10px} .game-content .section-head h1{padding-left:13px} .game-content .section-head h1::before{width:4px} .mobile-header{background:var(--mastro-bg);border-bottom:1px solid var(--mastro-line-strong);box-shadow:0 4px 16px var(--mastro-shadow-soft)} .mobile-player-button{background:var(--mastro-surface);border-color:var(--mastro-line);border-radius:var(--mastro-radius-card)} .mobile-player-button strong{color:var(--paper);font-weight:500} .mobile-player-button small{color:var(--mastro-muted)} .mobile-cash{font-family:var(--mastro-font-display);font-weight:500;font-size:1.65rem;color:var(--gold)} .mobile-vitals{background:var(--mastro-surface);border-color:var(--mastro-line);border-radius:var(--mastro-radius-control);box-shadow:none} .mobile-vitals>span{border-color:var(--mastro-line)} .mobile-nav{background:var(--mastro-backdrop);border-top:1px solid var(--mastro-line-strong);box-shadow:0 -5px 20px var(--mastro-shadow-soft)} .game-shell .mobile-nav button{border-radius:var(--mastro-radius-control);color:var(--mastro-muted);font-size:.65rem;font-weight:500;background:transparent;box-shadow:none} .game-shell .mobile-nav button.active{background:var(--gold);color:var(--mastro-subtle);border-color:var(--gold)} .game-content .card{padding:16px;border-radius:var(--mastro-radius-card)} .game-content .fraud-detail{padding:17px} .fraud-workspace{gap:15px;grid-template-columns:1fr} .fraud-overview{grid-template-columns:88px minmax(0,1fr);gap:12px;padding-bottom:15px} .fraud-heading h2{font-size:1.8rem;margin-bottom:9px} .fraud-heading>p{font-size:.78rem;line-height:1.5} .fraud-chance .chance{font-size:1.85rem} .fraud-metrics{padding-block:14px;gap:14px 10px} .fraud-metrics dt{font-size:.69rem} .fraud-metrics dd{font-size:.92rem} .fraud-metrics .metric-return dd{font-size:1.05rem} .fraud-catalogue>h2{font-size:1.35rem;padding:12px} .fraud-list-button{min-height:72px;padding:10px} .fraud-apply{min-height:48px;font-size:.86rem} .game-content .card-grid,.game-content .people-grid{gap:13px} .game-content .business-card{grid-template-columns:70px minmax(0,1fr);gap:12px;padding:15px} .game-content .business-card>.building{width:70px;height:70px} .business-content h2{font-size:1.5rem} .game-content .person-card{gap:11px;padding:15px} .game-content .person-card>.portrait{width:60px;height:60px} .game-content .person-content h2{font-family:var(--mastro-font-display);font-size:1.45rem} .game-content .subtabs button{padding:9px 11px;min-height:42px;font-size:.78rem} .next-steps{padding:15px} .dialog{padding:18px;border-radius:var(--mastro-radius-card)} .dialog h2{font-size:1.8rem} .access-screen h1,.character-selection h1{font-size:2.8rem} } @media(max-width:360px){ .game-shell>.game-content{padding-inline:12px} .game-content .fraud-detail{padding:14px} .game-content .business-card{grid-template-columns:58px minmax(0,1fr);padding:13px;gap:9px} .game-content .business-card>.building{width:58px;height:58px} .game-content .person-card{padding:13px;gap:9px} .game-content .person-card>.portrait{width:50px;height:50px} .fraud-overview{grid-template-columns:72px minmax(0,1fr);gap:10px} } @container fraud-detail (min-width:340px){ .fraud-overview{grid-template-areas:"art heading chance";grid-template-columns:80px minmax(0,1fr) 72px;gap:12px} .fraud-chance{align-self:start;padding-top:0;gap:5px;text-align:center} .fraud-chance>span{font-size:.7rem;line-height:1.4} .fraud-heading h2{font-size:1.85rem} .fraud-heading>p{font-size:.77rem;line-height:1.5} .fraud-overview>.fraud-scene{align-self:start} } .fraud-metrics .metric-box{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;border-top:1px solid var(--line)} .fraud-metrics .metric-box dd{font-size:.83rem;text-align:right}.fraud-metrics .metric-box dd small{font-size:.68rem} .game-content .next-steps{padding:12px 16px;flex:none} .next-steps>summary{min-height:32px;padding:5px 0;margin:0!important;color:var(--paper);font-size:.83rem;font-weight:500} .next-steps[open]>summary{padding-bottom:12px;border-bottom:1px solid var(--line)} .fraud-metrics dd{line-height:1.4}.fraud-metrics dd small{font-size:.66rem;line-height:1.4;margin-top:4px} @media(max-width:700px){.game-content .next-steps{padding:11px 14px}.next-steps>summary{min-height:36px}.next-steps ul{grid-template-columns:1fr;gap:15px}} .fraud-metrics{gap:12px 14px;padding:13px 0}.fraud-metrics dt{font-size:.7rem;line-height:1.25;margin-bottom:3px}.fraud-metrics dd{line-height:1.3}.fraud-metrics dd small{line-height:1.35;margin-top:3px} /* Common component rules are shared across every tab. */ .game-content>.section-head h1{font:500 var(--mastro-font-screen)/1.03 var(--mastro-font-display);color:var(--paper)} .game-content .card :is(h2,h3),.game-content .business-content h2,.game-content .person-content h2{font-family:var(--mastro-font-display);font-size:var(--mastro-font-card);font-weight:500;line-height:1.12;letter-spacing:-.015em} .game-content .card p{font-size:var(--mastro-font-body-size);line-height:1.55} .game-content .card:not(.fraud-detail):not(.next-steps){border-radius:var(--mastro-radius-card)} .game-content :is(.card-grid,.people-grid,.business-grid,.market-grid){gap:var(--mastro-space-md)} .game-content :is(.loot-filters,.shop-filters,.subtabs){gap:var(--mastro-space-sm)} .game-content :is(.card,.loot-filters,.room-chat) :is(input,select,textarea){border-radius:var(--mastro-radius-control);border-color:var(--mastro-line-strong);background:var(--mastro-deep);color:var(--text)} .game-content button.primary,.dialog button.primary{min-height:var(--mastro-control-height);background:var(--gold);border-color:var(--mastro-gold-border);color:var(--ink)} .game-content :is(.quantity-control,.upgrade-quantity) button{background:var(--mastro-raised);border-color:var(--line);border-radius:var(--mastro-radius-control);min-height:32px} .game-content :is(.quantity-control,.upgrade-quantity) button.selected{background:var(--paper);color:var(--ink);border-color:var(--paper)} .game-content :is(.business-card,.person-card,.shop-card,.lawyer-card,.club-card,.market-card){border-top-color:var(--mastro-line-strong)} .game-content :is(.bonus-source,.service-card,.managed-business,.loot-empty,.room-chat){border-color:var(--line);background-color:var(--mastro-subtle)} .game-content :is(.market-card,.coin-pack,.premium-card,.frame-card,.avatar-shop-card){background-color:var(--panel);border-color:var(--line);border-radius:var(--mastro-radius-card)} .game-content :is(.market-price,.player-cash){font-family:var(--mastro-font-display);font-weight:500;color:var(--gold)} @media(max-width:700px){ .game-content>.section-head h1{font-size:2.3rem} .game-content .card :is(h2,h3),.game-content .business-content h2,.game-content .person-content h2{font-size:1.45rem} .game-content :is(.quantity-control,.upgrade-quantity) button{min-height:40px} .game-content :is(.card-grid,.people-grid,.business-grid,.market-grid){gap:13px} } /* Progressive disclosure keeps decisions visible and explanations available. */ .fraud-about>summary{color:var(--muted);font:600 var(--mastro-font-small)/1.4 var(--mastro-font-body);padding:5px 0;min-height:30px} .fraud-about[open]>summary{margin-bottom:8px}.fraud-about .fraud-description{margin:0 0 8px;font-size:var(--mastro-font-body-size);line-height:1.55} .maintenance-rule{border:0;padding:0;margin:0 0 var(--mastro-space-md);font-size:var(--mastro-font-small)} .maintenance-rule>summary{padding:7px 0;min-height:32px;color:var(--muted)} .maintenance-rule p{max-width:700px;line-height:1.55} .locked-catalogue{margin-top:var(--mastro-space-lg);padding-top:var(--mastro-space-sm);border-top:1px solid var(--line)} .locked-catalogue>summary{padding:12px 0;min-height:44px;color:var(--muted);font-size:.85rem;font-weight:500} .locked-catalogue[open]>summary{margin-bottom:var(--mastro-space-sm)} .game-content .investment-preview:empty{display:none} @media(max-width:700px){.fraud-about>summary{min-height:36px}.maintenance-rule>summary{min-height:40px}.mobile-regen,.mobile-wanted-flow{display:none}.game-shell .mobile-nav button{min-height:44px}} /* Keep the probability beside the title, including narrow game columns. */ @container fraud-detail (max-width:339px){ .fraud-overview{grid-template-areas:"art heading chance";grid-template-columns:58px minmax(0,1fr) 60px;gap:9px;align-items:start;padding-bottom:13px} .fraud-overview>.fraud-chance{align-self:start;text-align:right;gap:4px} .fraud-chance>span{font-size:.65rem;line-height:1.3} .fraud-chance .chance{font-size:1.7rem} .fraud-heading h2,.game-content .fraud-heading h2{font-size:1.35rem;line-height:1.05;margin-bottom:5px} .fraud-about>summary{font-size:.66rem;line-height:1.3;min-height:30px} } /* Attribute values stay visible; purchasing is a deliberate, reversible toggle. */ .game-shell .avatar-attributes:not(.is-editing) .side-stats>div,.player-dialog .avatar-attributes:not(.is-editing) .side-stats>div{grid-template-columns:minmax(0,1fr) auto} .avatar-attributes .attribute-toggle{width:100%;min-height:36px;padding:7px 9px;font-size:.75rem;background:var(--paper);border:1px solid var(--paper);color:var(--ink);text-decoration:none;box-shadow:none} .avatar-attributes .attribute-toggle:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)} .attribute-purchase-controls{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)} .player-budget{justify-content:space-between;gap:8px} .game-shell .player-budget button,.player-dialog .player-budget button{min-height:32px;padding:5px 9px;background:var(--paper);border:1px solid var(--paper);color:var(--ink);border-radius:var(--mastro-radius-control);text-decoration:none;box-shadow:none;font-size:.73rem} .game-shell .player-budget button:hover,.player-dialog .player-budget button:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)} @media(max-width:700px){.avatar-attributes .attribute-toggle,.player-dialog .player-budget button{min-height:44px}} /* Keep each business's decision and its defense in one compact group. */ .game-content .business-card{align-items:start;padding:16px;gap:14px} .business-content{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px} .business-content>h2{margin:0;grid-column:1} .business-content>:not(.card-bottom){grid-column:1} .business-content>.card-bottom{grid-column:2;grid-row:1 / span 4;display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start;margin:0;gap:12px} .business-content .manager-picker{margin:0;width:100%;max-width:420px} .business-content .defense-roster{margin:0} .business-content .defense-order{margin:0} .business-content .defense-order>summary{min-height:32px;padding:6px 0} .business-content>.purchase-balance{margin:0} @media(max-width:950px){ .business-content{grid-template-columns:minmax(0,1fr);gap:8px} .business-content>.card-bottom{grid-column:1;grid-row:auto;flex-direction:row;align-items:center;justify-content:space-between;margin-top:4px} .business-content .card-bottom>button{width:auto} } /* Neutral panels and a shorter stage preserve the animation and the actions. */ .fraud-timer{min-height:190px;background:var(--mastro-deep);border-color:var(--mastro-line-strong)} .fraud-scene-background{height:100%} .fraud-timer::before{background:linear-gradient(180deg,var(--mastro-backdrop),transparent 55%,var(--mastro-backdrop))} .fraud-timer .fraud-run-loot{padding-top:30px;margin-bottom:10px;gap:7px} .fraud-timer .fraud-run-loot>span,.fraud-timer .fraud-run-loot>button{background:var(--mastro-backdrop);border-color:var(--line);padding:8px} .game-shell .player-resources .fraud-timer-compact,.game-shell .mobile-header .fraud-timer-compact{background:var(--mastro-subtle);border-color:var(--mastro-line-strong)} @media(max-width:700px){.fraud-timer{min-height:210px}.fraud-timer .fraud-run-loot{padding-top:40px}} /* One alignment and weight hierarchy for counters, labels and controls. */ .game-shell button,.dialog button{font-weight:500} /* State, current selection and action direction have separate visual signals. */ .activity-badge{display:inline-flex;align-items:center;gap:4px;max-width:100%;padding:3px 6px;border:1px solid currentColor;border-radius:var(--mastro-radius-control);font-size:.7rem;line-height:1.3;vertical-align:middle;white-space:normal} .activity-badge.is-active{color:var(--mastro-success);background:var(--mastro-deep)} .activity-badge.is-inactive{color:var(--mastro-muted);background:var(--mastro-subtle);border-style:dashed} .activity-badge>.ui-icon{width:13px;height:13px} .scene-choice-copy{display:grid;justify-items:start;gap:6px;min-width:0;overflow-wrap:anywhere} .scene-choice .activity-badge{font-size:.65rem;padding:3px 4px;gap:3px;white-space:nowrap;overflow-wrap:normal} .scene-choice .activity-badge>.ui-icon{width:10px;height:10px} .lawyer-card .activity-badge{margin:5px 0 5px 8px;width:fit-content} .utility-card>.activity-badge{align-self:start;width:fit-content} .button-current-label{display:inline-flex;align-items:center;gap:4px;margin-left:8px;font-size:.7rem} .shop-card>.activity-badge{margin-bottom:12px} .person-content .card-title>.activity-badge{flex-shrink:0} /* Destructive actions stay red; guided actions use the tutorial highlight. */ :is(.game-shell,.dialog) button[data-intent="enable"]:is([data-action="avatarSelect"],[data-action="frameSelect"],[data-action="titleSelect"],[data-action="uniformSelect"],[data-action="relationToggle"],[data-action="shopToggle"],[data-action="decorationToggle"]):not(:disabled):not([aria-disabled="true"]):not([data-tutorial-target]){color:var(--mastro-gold);background:var(--mastro-gold-subtle);border-color:var(--mastro-gold);box-shadow:none} :is(.game-shell,.dialog) button[data-intent="enable"]:is([data-action="avatarSelect"],[data-action="frameSelect"],[data-action="titleSelect"],[data-action="uniformSelect"],[data-action="relationToggle"],[data-action="shopToggle"],[data-action="decorationToggle"]):hover:not(:disabled):not([aria-disabled="true"]):not([data-tutorial-target]){color:var(--mastro-gold-hover);border-color:var(--mastro-gold-hover)} .game-shell button[data-intent="disable"]:not(:disabled):not([aria-disabled="true"]):not([data-tutorial-target]),.dialog button[data-intent="disable"]:not(:disabled):not([aria-disabled="true"]):not([data-tutorial-target]){color:var(--mastro-danger);background:var(--mastro-danger-surface);border-color:var(--mastro-danger-line);box-shadow:none} .game-shell button[data-intent="disable"]:hover:not(:disabled):not([aria-disabled="true"]):not([data-tutorial-target]),.dialog button[data-intent="disable"]:hover:not(:disabled):not([aria-disabled="true"]):not([data-tutorial-target]){color:var(--mastro-paper);background:var(--mastro-danger-surface);border-color:var(--mastro-danger)} .unlock-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;max-width:100%;padding:7px 5px;color:var(--mastro-gold);font-size:.78rem;line-height:1.35;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere;vertical-align:middle;white-space:normal} .unlock-link:hover{color:var(--mastro-gold-hover)} .unlock-link:focus-visible{outline:2px solid var(--mastro-gold);outline-offset:2px;border-radius:var(--mastro-radius-control)} .unlock-link:focus,.activity-badge:focus{scroll-margin:16px} .side-stats>div:has(.unlock-link){flex-wrap:wrap} .side-stats>div>.unlock-link{flex-basis:100%;justify-content:flex-start;font-size:.7rem} .daily-goal>.unlock-link,.locked-person .unlock-link{grid-column:1/-1;justify-self:start} .pass-reward>.unlock-link{font-size:.68rem;min-height:44px;padding-inline:0} .home-purchase>.unlock-link,.service-card .unlock-link,.shop-card>.unlock-link{width:100%} /* Leave the same room below actions in each row, including optional guidance. */ .game-shell .game-content .aligned-card-actions{padding-bottom:calc(var(--card-bottom-padding) + var(--card-action-space))} .game-shell .game-content button.aligned-card-button{min-height:var(--card-action-height)} .game-shell .card-title,.player-level-row,.game-content .fraud-catalogue>h2{align-items:center} .daily-goals>summary{display:flex;align-items:center;gap:10px;min-height:46px;padding:0 14px;font-weight:500;line-height:1.2} .daily-heading{display:inline-flex;align-items:center;gap:8px;line-height:1.2;font-weight:500} .daily-summary-count{display:inline-flex;align-items:center;justify-content:center;gap:2px;height:24px;min-width:38px;padding:0 6px;line-height:1;font-size:.75rem;font-weight:500;border:1px solid var(--line);color:var(--text);border-radius:var(--mastro-radius-control)} .daily-summary-count>span{display:inline-flex;align-items:center;line-height:1;font:inherit;color:var(--muted)} .daily-caret{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;color:var(--muted);line-height:1} .player-level-row,.resource-meter>span{font-weight:500} .side-stats .stat-label{font-weight:500}.side-stats dd,.resource-meter b{font-weight:500} .fraud-metrics dt{display:flex;align-items:center;gap:4px;min-height:22px;font-weight:500;line-height:1.25} .fraud-metrics dt .pixel-icon{margin:0;flex:none} .fraud-metrics dt .tooltip-trigger{margin-left:auto;} .resource-trend{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:3px;min-height:24px;font-size:.75rem;line-height:1.25;color:var(--muted)} .resource-trend>span{display:inline-flex;align-items:center;gap:4px}.resource-trend b{font-weight:500} .resource-trend .ui-icon{width:13px;height:13px}.resource-trend .tooltip-trigger{margin-left:auto} .resource-trend button.quiet{padding:4px 6px;min-height:28px;font-size:.7rem} .player-budget{display:flex;align-items:center;gap:4px;flex-wrap:nowrap;margin-bottom:12px} .player-budget .resource-caption{min-width:0;display:inline-flex;align-items:center;gap:5px;font-weight:500;font-size:.8rem} .player-budget .resource-caption .pixel-icon{margin:0}.player-budget .tooltip-trigger{margin-left:auto} .player-budget [data-live=budget]{white-space:nowrap} .player-resources .resource-meter{margin-bottom:10px} .fraud-detail .idle-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 12px} .fraud-detail .idle-controls>button{min-width:0;min-height:44px;width:100%;padding:7px;font-size:.75rem;line-height:1.3;white-space:normal} .fraud-detail .idle-controls .energy-recovery-link{margin:0} .equipped-mark .ui-icon,.avatar-selected .ui-icon{width:13px;height:13px}.reward-received{display:inline-flex;align-items:center;justify-content:center;gap:5px} .picker-arrow,.mobile-player-button small>.ui-icon{display:inline-flex;vertical-align:middle}.picker-arrow>.ui-icon{width:16px;height:16px} .battle-glyph .ui-icon{width:32px;height:32px} @media(max-width:700px){.daily-goals>summary{min-height:44px;padding:0 12px}.fraud-metrics dt .tooltip-trigger{}.resource-trend{min-height:36px}} .game-shell .energy-recovery-link{background:var(--mastro-raised);border-color:var(--mastro-line-strong);color:var(--text)} .game-shell .energy-recovery-link:hover{background:var(--mastro-line);border-color:var(--mastro-muted)} /* The mobile sheets use the same surfaces as the desktop account column. */ .game-shell .player-block,.dialog .player-block{background:var(--mastro-surface);border-color:var(--line);border-radius:var(--mastro-radius-card)} .dialog .dialog-close{background:var(--mastro-surface);border-color:var(--line)} .dialog .player-panel{background:transparent;border:0} .game-shell .purchase-quantity button,.dialog .purchase-quantity button{background:var(--mastro-raised);border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-control);font-weight:500} .game-shell .purchase-quantity button.selected,.dialog .purchase-quantity button.selected{background:var(--paper);border-color:var(--paper);color:var(--ink)} /* Secondary lists and faction chrome follow the same neutral palette. */ .daily-goal,.combat-order>li,.faction-card,.faction-battle,.room-chat-messages,.agency-scene{background:var(--mastro-subtle);border-color:var(--line)} .daily-goal .quiet,.factions-tabs button{background:var(--mastro-raised);border-color:var(--mastro-line-strong);color:var(--text)} .factions-tabs button.selected{background:var(--paper);border-color:var(--paper);color:var(--ink)} .faction-xp{background:var(--line)} .defense-roster>span{background:var(--mastro-subtle);border-color:var(--line);color:var(--text)} .fraud-list-button.is-locked{background:var(--mastro-subtle);border-color:var(--line)} .fraud-current-badge{background:var(--mastro-gold-subtle);border-color:var(--mastro-gold-subtle);color:var(--gold)} .legal-page :is(h1,h2){font-family:var(--mastro-font-display);font-weight:500}.legal-page nav a,.legal-page footer a{display:inline-flex;align-items:center;gap:8px} @media(max-width:360px){ .fraud-metrics dt{gap:3px;font-size:.68rem} .metric-energy dt>.pixel-icon,.metric-wanted dt>.pixel-icon{display:none} .fraud-metrics dt .tooltip-trigger{margin-left:0;} } .section-head h1 .tooltip-trigger{vertical-align:middle;margin-left:8px} .effect-slots{display:inline-flex;align-items:center;gap:5px;padding:3px 7px;border-color:var(--line)} .effect-slots .tooltip-trigger{} .card h3>.tooltip-trigger{vertical-align:middle;margin-left:5px} .health-value .tooltip-trigger{vertical-align:middle} .medicine-card .health-value{display:block;line-height:1.5}.medicine-card .health-value>.pixel-icon{display:inline-block;vertical-align:middle;margin-right:5px} /* Compact interface rhythm applies to every route and dialog. */ .in-tutorial{--tutorial-action:var(--mastro-tutorial-accent)} .game-shell>.game-content{padding:22px 20px 24px} .game-content .section-head{margin-bottom:14px;padding-bottom:12px;gap:12px} .game-content :is(.card-grid,.people-grid,.business-grid,.market-grid){gap:12px} .game-content .card{padding:14px} .game-content .fraud-detail{padding:18px} .game-content .business-card,.game-content .person-card{padding:14px;gap:12px} .game-content .subtabs{margin-bottom:14px;padding-bottom:8px} .game-shell .player-panel{padding:12px 10px;gap:10px} .game-shell .player-block,.dialog .player-block{padding:12px} .avatar-panel{padding:4px 6px 7px}.avatar-panel figcaption{padding:6px 0 2px} .player-level-row{margin-bottom:6px;line-height:1.2} .avatar-attributes .side-stats{gap:6px;margin-bottom:9px} .game-shell .avatar-attributes .side-stats>div,.dialog .avatar-attributes .side-stats>div{padding:3px 0;align-items:center;line-height:1.25} .stat-label{display:inline-flex;align-items:center;gap:5px;line-height:1.25} .side-stats .stat-label>.pixel-icon{width:17px;height:17px;margin:0;flex:none} .side-stats .stat-help,.side-stats .stat-help:hover,.side-stats .stat-help:active{display:inline-flex;align-items:center;min-height:24px;max-width:100%;padding:0;border:0;border-radius:2px;background:transparent;box-shadow:none;font:inherit;text-align:left;cursor:help} .side-stats .stat-help:focus-visible{outline:2px solid var(--gold);outline-offset:3px} @media(pointer:coarse){.side-stats .stat-help,.side-stats .stat-help:hover,.side-stats .stat-help:active{min-height:44px;width:100%}} .side-stats dd{line-height:1.25} .player-balance{display:flex;align-items:center;gap:7px;margin-bottom:12px;min-height:34px} .player-balance>.pixel-icon{width:25px;height:25px;margin:0;flex:none} .player-cash{font-family:var(--mastro-font-body);font-size:1.8rem;line-height:1.1} .player-coins{min-height:38px;margin-bottom:10px} .player-budget{margin-bottom:9px;min-height:30px;gap:6px} .resource-meter>span{margin-bottom:5px;line-height:1.25;align-items:center} .resource-meter>span>span{display:inline-flex;align-items:center;gap:5px} .resource-meter>span .pixel-icon{margin:0;width:17px;height:17px;flex:none} .player-resources .resource-meter{margin:0 0 9px} .resource-trend{min-height:20px;margin-top:4px;gap:6px} .resource-trend .tooltip-trigger{margin-left:auto} .dialog{padding:18px} .dialog h2{margin-bottom:12px}.dialog-close{margin-bottom:10px} .dialog :is(.actions,.menu-actions,.budget-groups){gap:10px} .dialog .item-summary{gap:12px;margin-bottom:12px} .dialog .budget-summary{gap:8px}.budget-summary>div{padding:10px} .dialog :is(input,select,textarea){min-height:40px} .dialog .dialog-close button{min-height:36px} .dialog .player-panel{padding:0;gap:10px} .dialog :is(.item-info,.target-defense,.utility-context){margin-block:10px} #tutorial-overlay,.tutorial-bubble{font-family:var(--mastro-font-body)} #tutorial-overlay.is-disconnected{background:var(--mastro-shadow-soft);pointer-events:auto} .tutorial-bubble{font:500 .875rem/1.4 var(--mastro-font-body);padding:12px;background:var(--mastro-tutorial-surface);border-color:var(--mastro-tutorial-line);color:var(--mastro-tutorial-text);border-radius:var(--mastro-radius-card)} .tutorial-bubble h2{font:500 1.4rem/1.1 var(--mastro-font-display);margin:4px 0 8px;color:var(--mastro-tutorial-accent)} .tutorial-bubble p{margin:0 0 8px;line-height:1.4} .tutorial-bubble small,.tutorial-facts dt{color:var(--mastro-tutorial-muted)} .tutorial-bubble .tutorial-meta{margin:8px 0;gap:8px} #tutorial-overlay .tutorial-step{background:var(--mastro-tutorial-raised);border-color:var(--mastro-tutorial-line);border-radius:var(--mastro-radius-control);color:var(--mastro-tutorial-accent);padding:3px 6px} .tutorial-facts{padding:8px;gap:4px;margin-bottom:8px;border-radius:var(--mastro-radius-control);background:var(--mastro-tutorial-raised);border-color:var(--mastro-tutorial-line)} .tutorial-facts dd{color:var(--mastro-tutorial-text);line-height:1.35}.tutorial-term,.tutorial-click{color:var(--mastro-tutorial-accent)} .tutorial-bubble .tutorial-action{color:var(--mastro-tutorial-text)} #tutorial-overlay button,.in-tutorial button[data-tutorial-target]{background:var(--mastro-tutorial-raised);border-color:var(--mastro-tutorial-accent);color:var(--mastro-tutorial-text);outline-color:var(--tutorial-action)} .in-tutorial [data-tutorial-target] .slot-plus{color:var(--mastro-tutorial-text)} #tutorial-overlay button:hover:not(:disabled),.in-tutorial button[data-tutorial-target]:hover:not(:disabled){background:var(--mastro-tutorial-hover);border-color:var(--mastro-tutorial-accent)} #tutorial-overlay .tutorial-quiet{background:var(--mastro-tutorial-surface);border-color:var(--mastro-tutorial-line);color:var(--mastro-tutorial-muted)} #tutorial-overlay .tutorial-quiet:hover:not(:disabled){background:var(--mastro-tutorial-raised);border-color:var(--mastro-tutorial-accent)} .tutorial-ring{border-color:var(--tutorial-action);box-shadow:0 0 0 3px var(--mastro-tutorial-surface),0 0 18px color-mix(in srgb,var(--tutorial-action) 35%,transparent)} @keyframes tutorial-target-pulse{0%,100%{box-shadow:0 0 0 0 var(--mastro-tutorial-raised),0 0 10px var(--mastro-tutorial-raised)}50%{box-shadow:0 0 0 5px color-mix(in srgb,var(--tutorial-action) 35%,transparent),0 0 18px color-mix(in srgb,var(--tutorial-action) 40%,transparent)}} @media(max-width:700px){ .game-shell>.game-content{padding:18px 12px calc(18px + env(safe-area-inset-bottom))} .game-content .section-head{margin-bottom:12px;padding-bottom:10px} .game-content :is(.card-grid,.people-grid,.business-grid,.market-grid){gap:10px} .game-content .card,.game-content .person-card,.game-content .business-card{padding:12px} .game-content .business-card{--business-art-size:60px;gap:10px} .game-content .fraud-detail{padding:14px} .game-content .subtabs{margin-bottom:12px;gap:5px} .dialog{padding:14px}.dialog h2{font-size:1.65rem} .dialog-close{margin-bottom:8px} .dialog .player-block{padding:10px} .resource-trend{min-height:22px} .tutorial-bubble{padding:10px;font-size:.8125rem} .tutorial-bubble p{font-size:.8125rem;line-height:1.35} .tutorial-bubble h2{font-size:1.3rem} .tutorial-facts div{grid-template-columns:58px minmax(0,1fr);gap:6px} } /* Replays and reward reveals share the game chrome; artwork keeps its colors. */ .dialog.battle-dialog,.dialog.box-dialog{padding:0;background:var(--panel);border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-card);box-shadow:0 18px 80px var(--mastro-shadow-soft)} .battle-view,.box-celebration{font-family:var(--mastro-font-body);color:var(--text)} .battle-header,.battle-controls{background:var(--mastro-subtle);border-color:var(--line);padding:12px 18px;gap:10px} .battle-header h2{font:500 1.65rem/1.1 var(--mastro-font-display);color:var(--paper);margin:0} .battle-eyebrow,.battle-effectiveness{color:var(--gold);letter-spacing:.03em} .battle-countdown{padding:7px 9px;background:var(--mastro-deep);border-color:var(--line);border-radius:var(--mastro-radius-control);color:var(--text)} .battle-mute,.battle-mute[data-muted=true]{background:var(--mastro-raised);border-color:var(--mastro-line-strong);color:var(--muted);border-radius:var(--mastro-radius-control)} .battle-mute:hover{color:var(--gold)} .battle-hud,.brawl-scene .battle-hud{background:var(--mastro-backdrop);border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-card);box-shadow:3px 3px 0 var(--mastro-shadow-soft);color:var(--text);padding:10px 12px} .battle-hud strong,.battle-attributes dd,.battle-hud label b,.brawl-scene .battle-hud strong,.brawl-scene .battle-attributes dd,.brawl-scene .battle-hud label b{color:var(--paper)} .battle-hud label,.battle-attributes dt,.brawl-scene .battle-hud label,.brawl-scene .battle-attributes dt{color:var(--muted)} .battle-hud strong{font-size:.875rem;line-height:1.2} .battle-type,.battle-type[data-type=analise],.battle-type[data-type=influencia]{background:var(--mastro-raised);border:1px solid var(--line);color:var(--gold);border-radius:var(--mastro-radius-control);letter-spacing:0} .battle-hud progress::-webkit-progress-bar{background:var(--line)} .battle-hud progress::-webkit-progress-value,.brawl-scene .battle-hud progress::-webkit-progress-value{background:var(--teal)} .battle-hud progress.battle-low::-webkit-progress-value{background:var(--red)} .battle-hud progress::-moz-progress-bar,.brawl-scene .battle-hud progress::-moz-progress-bar{background:var(--teal)} .battle-equipped-item,.battle-empty-item{background:var(--mastro-deep);border-radius:var(--mastro-radius-control)} .battle-empty-item{color:var(--muted);border-color:var(--line)} .battle-item-detail{background:var(--panel);border-color:var(--mastro-line-strong);color:var(--text);box-shadow:0 4px 16px var(--mastro-shadow-soft)} .battle-item-detail strong{color:var(--paper)} .battle-item-detail span,.battle-item-detail small{color:var(--muted)} .battle-narrative,.battle-result{padding:12px 18px;min-height:96px;background:var(--panel);border-top:1px solid var(--line)} .battle-narrative h3,.battle-result h3{font:500 1.4rem/1.15 var(--mastro-font-display);margin:0 0 7px;color:var(--paper)} .battle-narrative p,.battle-result p{font-size:.8125rem;line-height:1.45;color:var(--muted)} .battle-result.is-victory h3{color:var(--teal)} .battle-rewards{gap:6px;margin:10px 0} .battle-rewards>*,.battle-rewards>span{padding:6px 8px;background:var(--mastro-subtle);border-color:var(--line);border-radius:var(--mastro-radius-control);color:var(--text);font-size:.8125rem} .battle-lineups{padding:10px 18px;gap:12px;background:var(--panel);border-color:var(--line)} .battle-lineups small,.battle-type-guide,.battle-controls>span{color:var(--muted);letter-spacing:0} .battle-reserve{background:var(--mastro-subtle);border-color:var(--line);border-radius:var(--mastro-radius-control)} .battle-reserve.is-active{outline-color:var(--gold)} .battle-controls button{font:500 .8125rem/1.2 var(--mastro-font-body);min-height:40px;border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control);background:var(--mastro-raised);color:var(--text)} .battle-controls button.primary{background:var(--gold);border-color:var(--mastro-gold-border);color:var(--ink)} .battle-loading{background:var(--mastro-backdrop);color:var(--gold)} .combat-order{gap:6px;margin:10px 0 12px} .combat-order li{background:var(--mastro-subtle);border-color:var(--line);border-radius:var(--mastro-radius-control)} .brawl-opponents{gap:12px;margin:14px 0} .brawl-rules{gap:10px;margin:12px 0} .box-celebration{padding:18px;background:radial-gradient(ellipse at 50% 35%,var(--mastro-gold-subtle),transparent 65%)} .box-celebration h2{font:500 1.8rem/1.1 var(--mastro-font-display);margin:14px 0 0} .box-prize h3{font:500 1.5rem/1.15 var(--mastro-font-display)} .box-opening-top{gap:10px;font-size:.8125rem} .box-opening-status{font-size:.8125rem;line-height:1.4} .box-rewards{gap:10px;padding:4px} .box-reward{background:var(--mastro-subtle);border-radius:var(--mastro-radius-card);padding:10px} .box-reward h3{font-size:1.15rem} .dialog :is(.budget-line,.item-comparison,.item-upgrade-preview,.listing-preview,.notification-entry){border-color:var(--line)} .item-cell{background:var(--mastro-subtle);border-radius:var(--mastro-radius-card);box-shadow:none} .item-cell:hover,.item-cell:focus-visible{background:var(--mastro-raised)} .item-cell-name,.item-summary h3{color:var(--paper)} .empty-item-slot,.slot-plus{color:var(--muted)} .item-summary>.loot-glyph,.market-balances,.notification-art{background:var(--mastro-deep)} .item-tooltip{font-family:var(--mastro-font-body);background:var(--mastro-paper);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-card);color:var(--ink);box-shadow:0 7px 24px var(--mastro-shadow-soft);padding:12px} .item-tooltip .item-summary h3,.item-tooltip .stats-inline,.item-tooltip p{color:var(--ink)} .item-tooltip .item-summary>.loot-glyph{background:var(--mastro-surface)} .upgrade-material-stats{color:var(--muted)} /* Each inventory action opens its own workspace in the page. */ .game-content .inventory-upgrade{display:block;margin:18px 0;background:var(--panel);border-color:var(--line)} .inventory-upgrade-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px 18px;flex-wrap:wrap;margin-bottom:16px} .inventory-upgrade .inventory-upgrade-heading h2{margin:0;color:var(--paper)} .inventory-upgrade .inventory-upgrade-heading p{margin:0;color:var(--muted);font-size:.8125rem} .upgrade-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .game-content .upgrade-actions .upgrade-action{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:center;justify-content:stretch;gap:12px;width:100%;min-width:0;min-height:112px;padding:14px 12px;text-align:left;white-space:normal;background:var(--mastro-subtle);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control);box-shadow:none} .upgrade-action-icon{display:grid;place-items:center;width:40px;height:40px;flex:none} .upgrade-action-icon>.upgrade-button-icon{display:block;width:40px;height:40px;margin:0;padding:0;object-fit:contain;image-rendering:auto} .upgrade-button-icon{display:inline-block;width:24px;height:24px;margin:0;object-fit:contain;vertical-align:middle;flex:none;image-rendering:auto} .upgrade-action-copy{display:grid;gap:7px;min-width:0} .upgrade-action-copy strong{font-size:.9375rem;line-height:1.25;font-weight:500;color:var(--paper)} .inventory-upgrade .upgrade-action-copy small{font-size:.75rem;line-height:1.45;color:var(--muted)} .upgrade-action>.ui-icon{display:none} .upgrade-actions .upgrade-action:hover,.upgrade-actions .upgrade-action[aria-expanded="true"]{background:var(--mastro-gold-subtle);border-color:var(--gold)} .upgrade-actions .upgrade-action[aria-expanded="true"] strong{color:var(--gold)} .upgrade-workspace{min-width:0;margin:18px 0;background:var(--panel);border-color:var(--mastro-line-strong)} .upgrade-workspace-actions{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:18px} .upgrade-workspace-actions button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;font-size:.8125rem} .upgrade-workspace h2{scroll-margin-top:18px} .upgrade-workspace>p{line-height:1.55} .upgrade-workspace .picker-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));max-height:48dvh;overflow:auto;padding:6px;scrollbar-width:thin} .upgrade-workspace .upgrade-material-grid{max-height:32dvh} .upgrade-workspace .upgrade-preview{background:var(--mastro-subtle)} .upgrade-workspace .upgrade-preview h3{font-size:1.3rem} .upgrade-workspace .upgrade-stat-comparison b{color:var(--teal)} .upgrade-workspace .upgrade-material-grid .item-cell.is-selected{background:var(--mastro-gold-subtle)} .upgrade-workspace summary{min-height:44px;padding-block:10px;cursor:pointer;line-height:1.4} .upgrade-workspace .upgrade-confirm button{display:flex;align-items:center;justify-content:center;gap:8px} .upgrade-workspace .upgrade-confirm .ui-icon{flex-shrink:0} .item-upgrade-button>.ui-icon{vertical-align:middle;margin-right:7px} @media(max-width:1100px){ .upgrade-actions{grid-template-columns:1fr} .game-content .upgrade-actions .upgrade-action{grid-template-columns:40px minmax(0,1fr) 18px;min-height:84px;padding:12px} .upgrade-action>.ui-icon{display:block;width:18px;height:18px;color:var(--muted)} .upgrade-action-copy{gap:4px} } @media(max-width:600px){ .inventory-upgrade-heading{gap:8px;margin-bottom:12px} .upgrade-workspace .picker-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:52dvh} .upgrade-workspace .upgrade-material-grid{max-height:32dvh} .upgrade-workspace .upgrade-preview h3{font-size:1.15rem} .upgrade-workspace .upgrade-preview p{font-size:.8125rem;line-height:1.5} } .target-defense,.attack-member{background:var(--mastro-subtle);border-color:var(--line);border-radius:var(--mastro-radius-control)} .target-defense{margin:12px 0;padding:10px} .notification-list{gap:6px;margin-top:12px} .notification-item{background:var(--mastro-subtle);border-color:var(--line);border-radius:var(--mastro-radius-card)} .notification-item.is-unread{background:var(--mastro-raised);border-color:var(--mastro-line-strong);border-left-color:var(--gold)} .notification-entry{padding:10px;gap:10px} .notification-detail{color:var(--muted);font-size:.8125rem;line-height:1.4} .notification-copy>strong{font-size:.875rem;line-height:1.3} .notification-meta,.notification-meta time{font-size:.75rem} .character-card{background:radial-gradient(ellipse at 50% 35%,var(--mastro-gold-subtle),var(--panel) 72%);border-color:var(--line);border-radius:var(--mastro-radius-card)} .room-chat-messages{background:var(--mastro-deep);border-radius:var(--mastro-radius-control);margin:10px 0;padding:0 8px} .battle-empty-item>.ui-icon{width:14px;height:14px} .coin-offer-clock{background:var(--mastro-subtle);border-color:var(--line);border-radius:var(--mastro-radius-control);padding:10px 12px} .coin-offer-clock>span,.coin-offer-clock small,.coin-offer-terms,.coin-offer-payment{color:var(--muted)} .coin-offer-content h2,.coin-offer-pricing>strong,.coin-offer-clock time{color:var(--gold)} .coin-offer-pricing>small{color:var(--teal)} .season-pass{background:var(--panel);border-color:var(--line);border-radius:var(--mastro-radius-card)} .pass-hero{background:linear-gradient(115deg,var(--mastro-gold-subtle),var(--panel));padding:16px;gap:12px} .pass-hero h2{font:500 1.65rem/1.1 var(--mastro-font-display)} .pass-hero p,.pass-level span,.pass-reward p{color:var(--muted)} .pass-active{background:var(--mastro-subtle);border-color:var(--line);color:var(--teal);border-radius:var(--mastro-radius-control)} .pass-milestone>span,.pass-milestone>strong{background:var(--panel)} .pass-milestone:before{background:var(--line)} .pass-reward,.pass-reward.is-paid,.pass-reward.is-locked,.pass-reward.is-paid.is-locked,.pass-reward.is-claimed{background:var(--mastro-subtle);border-color:var(--line);border-radius:var(--mastro-radius-card);box-shadow:0 3px 0 var(--mastro-shadow-soft)} .pass-reward.is-paid,.pass-reward.is-paid.is-ready{border-color:var(--mastro-gold-subtle)} .pass-reward.is-ready{border-color:var(--teal)} .pass-reward.is-claimed{box-shadow:none} .pass-reward h3{font-family:var(--mastro-font-display);color:var(--paper)} .pass-reward.is-paid h3,.is-paid>.reward-track{color:var(--gold)} .pass-reward button:disabled,.pass-reward.is-paid button:disabled,.daily-goal button:disabled{background:var(--mastro-raised);border-color:var(--line);color:var(--muted)} .reward-upgrade-note{background:var(--mastro-subtle);color:var(--muted);border-color:var(--teal)} .pass-rules{border-color:var(--line)} /* The faction introduction and arena overlays use the same neutral surfaces. */ :root{--f-gold:var(--mastro-gold)} .factions-intro{background:linear-gradient(90deg,var(--mastro-backdrop),var(--mastro-shadow-soft)),url('/assets/v05/faction-paulista-v1.png') center 43%/cover;border-color:var(--line);border-radius:var(--mastro-radius-card)} .faction-card,.faction-card[data-faction=right],.faction-battle,.faction-recent-donations,.faction-donors{background:var(--panel);border-color:var(--line);border-radius:var(--mastro-radius-card)} .faction-card-actions .faction-donate-shortcut{background:var(--mastro-raised);color:var(--gold)} .factions-tabs button[aria-selected=true]{background:var(--paper);color:var(--ink);border-color:var(--paper);border-radius:var(--mastro-radius-control)} .faction-war-scene{background:var(--mastro-deep)} .faction-war-camera button,.faction-war-countdown{background:var(--mastro-backdrop);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control)} .faction-war-label{background:var(--mastro-backdrop);color:var(--muted)} .faction-war-result{background:var(--mastro-subtle);color:var(--gold)} .faction-xp,.faction-war-vital meter,.faction-war-vital meter::-webkit-meter-bar{background:var(--line)} .faction-war-vital meter::-webkit-meter-optimum-value,.faction-war-vital meter::-moz-meter-bar{background:var(--teal)} #tutorial-overlay:has(.tutorial-faction-guide){background:color-mix(in srgb,var(--mastro-backdrop) 26%,transparent)} .tutorial-guide.tutorial-faction-guide{font-family:var(--mastro-font-body);background:var(--mastro-tutorial-surface);border-color:var(--mastro-tutorial-line);border-radius:var(--mastro-radius-card);box-shadow:0 15px 60px var(--mastro-shadow-soft);color:var(--mastro-tutorial-text)} .tutorial-faction-heading{padding:12px 16px;background:var(--mastro-tutorial-raised);border-color:var(--mastro-tutorial-line)} .tutorial-faction-heading h2{font:500 1.65rem/1.15 var(--mastro-font-display);color:var(--mastro-tutorial-accent);margin:0} .tutorial-faction-heading small,.tutorial-replay-date,.tutorial-faction-content .faction-battle-heading small{color:var(--mastro-tutorial-muted)} .tutorial-faction-content{padding:14px 16px;font-size:.875rem;line-height:1.45} .tutorial-faction-content p{font-size:.875rem} .tutorial-faction-choices{gap:10px;margin-top:14px} .tutorial-faction-choice,.tutorial-faction-choice[data-choice=right],.tutorial-faction-choice[data-choice=neutral]{background:var(--mastro-tutorial-raised);border-color:var(--mastro-tutorial-line);border-radius:var(--mastro-radius-card);padding:12px} .tutorial-faction-choice h3{font:500 1.4rem/1.1 var(--mastro-font-display);color:var(--mastro-tutorial-text)} .tutorial-faction-content .faction-battle-heading{background:var(--mastro-deep);border-radius:var(--mastro-radius-card)} .faction-donation,.faction-confirm{background:var(--panel);border-color:var(--line);border-radius:var(--mastro-radius-card);padding:14px} .faction-confirm{font-family:var(--mastro-font-body);color:var(--text)} .faction-confirm h2{font:500 1.6rem/1.1 var(--mastro-font-display)} .faction-confirm::backdrop{background:var(--mastro-backdrop)} .faction-donation-preview,.factions-message{background:var(--mastro-subtle);border-color:var(--line);color:var(--text)} .factions-message.is-error{background:var(--mastro-danger-surface);border-color:var(--mastro-danger-line);color:var(--red)} .faction-war-panel{background:var(--mastro-backdrop);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-card)} .faction-war-panel>button{background:var(--mastro-raised)} .faction-war-panel-key,.faction-war-rank,.faction-war-vital{color:var(--muted)} .faction-war-player-info>strong{color:var(--paper)} .faction-war-panel li{border-color:var(--line)} .faction-war-panel li.is-self{background:var(--mastro-gold-subtle)} .faction-war-points,.war-reward-summary>span>span,.tutorial-faction-content [data-intro-clock]{color:var(--gold)} .war-reward-rule{border-color:var(--line);color:var(--text)} .faction-chat form{background:var(--mastro-backdrop);border-color:var(--mastro-line-strong);border-radius:var(--mastro-radius-control)} .faction-chat form:focus-within{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)} .faction-chat button{color:var(--gold)} .faction-chat input::placeholder{color:var(--muted)} @media(max-width:600px){ .dialog.battle-dialog{width:100%;max-height:calc(100dvh - 24px)} .battle-header,.battle-controls{padding:10px 12px;gap:8px} .battle-header h2{font-size:1.3rem;line-height:1.15} .battle-hud,.brawl-scene .battle-hud{padding:8px} .battle-hud strong{font-size:.75rem} .battle-type{font-size:.5625rem;padding:2px 4px} .battle-attributes dt{font-size:.5625rem}.battle-attributes dd{font-size:.75rem} .battle-narrative,.battle-result{padding:10px 12px;min-height:92px} .battle-narrative h3,.battle-result h3{font-size:1.25rem} .battle-lineups{padding:9px 12px;gap:10px} .battle-controls button{min-height:44px;font-size:.75rem;padding:8px 10px} .battle-rewards>*,.battle-rewards>span{font-size:.75rem} .box-celebration{padding:14px} .box-celebration h2{font-size:1.6rem;margin-top:12px} .tutorial-faction-heading{padding:10px 12px}.tutorial-faction-heading h2{font-size:1.4rem} .tutorial-faction-content{padding:12px}.tutorial-faction-content p{font-size:.8125rem} .factions-page .faction-war-scene{height:clamp(340px,calc(100dvh - 270px),620px)} .faction-war-camera{left:8px;right:8px;max-width:none;display:grid;grid-template-columns:44px minmax(0,1fr) 44px 44px;gap:5px} .game-shell .faction-war-camera button,.tutorial-faction-content .faction-war-camera button{min-width:0;padding:6px;min-height:44px;height:44px;line-height:1.2;font-size:.75rem} } /* All paid Coin actions use the actual currency mark and one low-balance hint. */ button.coin-action,button.coin-form-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:normal;font-weight:500} button.coin-action>.premium-icon,button.coin-form-action>.premium-icon{width:24px;height:24px;flex:none;margin:0;object-fit:contain} .coin-action-copy{display:grid;justify-items:center;gap:3px;min-width:0} .coin-action-hint{display:block;font:500 .65rem/1.3 var(--mastro-font-body);color:inherit;opacity:.85} .coin-shop-shortfall{padding:10px 12px;border-left:2px solid var(--gold);background:var(--mastro-gold-subtle);color:var(--paper);font-size:.85rem;line-height:1.5} .factions-page img.faction-coin-icon{background:none;object-fit:contain}.factions-page button img.faction-coin-icon{width:24px;height:24px} .coin-action-hint[hidden]{display:none} a.player-profile-link{display:inline;color:inherit;font:inherit;text-decoration:none;background:none;border:0;border-radius:0;padding:0;min-width:0;min-height:0;box-shadow:none;overflow-wrap:anywhere} a.player-profile-link:hover{color:var(--mastro-gold);background:none;box-shadow:none;text-decoration:none} a.player-profile-link:focus-visible{outline:2px solid var(--mastro-gold);outline-offset:3px} .mobile-player-summary{display:flex;align-items:center;gap:7px;min-width:0} .mobile-player-summary>.mobile-player-button{flex:0 0 auto;padding:0;min-width:36px} .mobile-player-summary>span{display:grid;gap:2px;min-width:0;font-size:.875rem} .mobile-player-summary>span>small{font-size:.7rem;color:var(--mastro-muted)} /* Only values embedded in descriptive copy receive this emphasis. */ body b.game-value{display:inline!important;font:inherit;font-weight:700!important;color:var(--mastro-gold)} body .game-value-copy{font:inherit;color:inherit} body .interface-tooltip b.game-value{color:var(--mastro-value-ink)} /* Classes: creation list, mandatory choice, VIP change and profile card. */ .class-choices{margin-top:18px;min-width:0} .class-rule{margin:0 0 10px;font-size:.8rem;line-height:1.45;color:var(--mastro-muted)} .class-list{display:grid;gap:8px;min-width:0} .class-list-wide{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} button.class-option{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr);align-items:center;gap:12px;min-width:0;width:100%;padding:8px 36px 8px 8px;text-align:left;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-control,10px);background:var(--mastro-subtle);box-shadow:none;font-weight:400;color:var(--mastro-paper)} button.class-option:hover{background:var(--mastro-raised);border-color:var(--mastro-line-strong)} button.class-option[aria-pressed=true]{border-color:var(--mastro-gold);background:var(--mastro-gold-subtle)} button.class-option:focus-visible{outline:2px solid var(--mastro-gold);outline-offset:2px} .class-option-art{display:block;width:56px;height:70px;object-fit:cover;object-position:35% 18%;border-radius:6px} .class-option-copy{display:grid;gap:2px;min-width:0} .class-option-copy small{font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mastro-gold)} .class-option-copy strong{font-size:.9rem;line-height:1.25} .class-option-copy span{font-size:.75rem;line-height:1.4;color:var(--mastro-muted)} .class-selected{display:none;position:absolute;right:8px;top:8px;width:20px;height:20px;border-radius:50%;align-items:center;justify-content:center;color:var(--mastro-ink);background:var(--mastro-gold)} .class-selected .ui-icon{width:12px;height:12px} .class-option[aria-pressed=true] .class-selected{display:flex} .class-list-wide button.class-option{grid-template-columns:96px minmax(0,1fr);padding:10px 36px 10px 10px} .class-list-wide .class-option-art{width:96px;height:120px} .class-details{display:grid;gap:8px;margin-top:12px;font-size:.8rem;line-height:1.45} .class-details p{margin:0} .class-description{font-style:italic;color:var(--mastro-paper)} .class-variants-intro{color:var(--mastro-muted)} .class-variants{display:grid;gap:6px;margin:0;padding:0;list-style:none} .class-variants li{display:grid;gap:2px;padding:8px 10px;border:1px solid var(--mastro-line);border-radius:8px;background:var(--mastro-subtle)} .class-variants span{color:var(--mastro-muted)} .dialog.class-dialog{width:860px} .class-dialog h2{margin-top:0} .class-choice-actions{display:flex;justify-content:flex-end;margin-top:16px} .class-choice-actions button{min-width:220px;min-height:48px} .class-change-fields{display:grid;gap:8px;min-width:0;margin:0;padding:0;border:0} .class-change-fields legend{margin-bottom:10px;font-size:.85rem} .utility-card label.class-change-option{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:10px;padding:8px 10px;border:1px solid var(--mastro-line);border-radius:8px;cursor:pointer} .utility-card .class-change-option input{width:18px;height:18px;min-height:18px;margin:2px 0 0} .class-change-option>span{display:grid;gap:3px;min-width:0} .class-change-option strong{font-size:.86rem} .class-change-option em{margin-left:6px;font-size:.7rem;font-style:normal;color:var(--mastro-gold)} .class-change-option small{font-size:.75rem;line-height:1.4;color:var(--mastro-muted)} .utility-card label.class-change-option:has(input:disabled){cursor:default;opacity:.65} .utility-card label.class-change-option:has(input:checked){border-color:var(--mastro-gold);background:var(--mastro-gold-subtle)} .class-profile{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:start} .class-profile-art{display:block;width:120px;height:150px;object-fit:cover;object-position:35% 18%;border-radius:8px} .class-profile h2{margin:2px 0 6px} .class-profile p{margin:0 0 6px} .class-profile-role{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mastro-gold)} .class-profile-bonus{font-weight:600} @media(max-width:700px){ .class-list-wide{grid-template-columns:minmax(0,1fr)} .class-list-wide button.class-option{grid-template-columns:72px minmax(0,1fr)} .class-list-wide .class-option-art{width:72px;height:90px} .class-choice-actions{position:sticky;bottom:-14px;z-index:1;margin:12px -14px -14px;padding:12px 14px max(14px,env(safe-area-inset-bottom));background:var(--mastro-surface);box-shadow:0 -10px 16px var(--mastro-surface)} .class-choice-actions button{width:100%;min-width:0} .class-profile{grid-template-columns:88px minmax(0,1fr)} .class-profile-art{width:88px;height:110px} } /* Faction choice at character creation. */ .faction-choices{margin-top:18px;min-width:0} .faction-list{display:grid;gap:8px;min-width:0} button.faction-option{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:12px;min-width:0;width:100%;padding:8px 36px 8px 10px;text-align:left;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-control,10px);background:var(--mastro-subtle);box-shadow:none;font-weight:400;color:var(--mastro-paper)} button.faction-option:hover{background:var(--mastro-raised);border-color:var(--mastro-line-strong)} button.faction-option[aria-pressed=true]{border-color:var(--mastro-gold);background:var(--mastro-gold-subtle)} button.faction-option:focus-visible{outline:2px solid var(--mastro-gold);outline-offset:2px} .faction-option-crest{display:block;width:44px;height:44px;object-fit:contain} .faction-option-copy{display:grid;gap:2px;min-width:0} .faction-option-copy strong{font-size:.9rem;line-height:1.25} .faction-option-copy span{font-size:.75rem;line-height:1.4;color:var(--mastro-muted)} .faction-option[aria-pressed=true] .class-selected{display:flex} .tutorial-faction-choice.is-picked{border-color:var(--mastro-gold);background:var(--mastro-gold-subtle)} .tutorial-faction-picked{margin:0;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mastro-gold)} .faction-choices #faction-rule{margin-top:8px} /* Rehearsal: class review after the faction. */ .tutorial-class-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:0;margin:8px 0} button.tutorial-class-choice{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:10px;min-width:0;padding:6px 8px;text-align:left;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-control,10px);background:var(--mastro-subtle);box-shadow:none;font-weight:400;color:var(--mastro-paper)} button.tutorial-class-choice:hover{border-color:var(--mastro-line-strong)} button.tutorial-class-choice[aria-pressed=true]{border-color:var(--mastro-gold);background:var(--mastro-gold-subtle)} button.tutorial-class-choice:focus-visible{outline:2px solid var(--mastro-gold);outline-offset:2px} .tutorial-class-choice img{display:block;width:44px;height:55px;object-fit:cover;object-position:35% 18%;border-radius:5px} .tutorial-class-choice>span{display:grid;gap:1px;min-width:0} .tutorial-class-choice small{font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mastro-gold)} .tutorial-class-choice strong{font-size:.82rem;line-height:1.2} .tutorial-class-choice>span>span{font-size:.7rem;line-height:1.35;color:var(--mastro-muted)} @media(max-width:700px){.tutorial-class-choices{grid-template-columns:minmax(0,1fr)}} #tutorial-overlay button.tutorial-class-choice{background:var(--mastro-tutorial-surface);border-color:var(--mastro-tutorial-line);color:var(--mastro-tutorial-text)} #tutorial-overlay button.tutorial-class-choice[aria-pressed=true]{background:var(--mastro-gold-subtle);border-color:var(--mastro-gold);box-shadow:inset 0 0 0 1px var(--mastro-gold)} #tutorial-overlay button[data-intro-action=enter]:not(:disabled),#tutorial-overlay .tutorial-faction-choice.is-picked button:not(:disabled){background:var(--mastro-gold);border-color:var(--mastro-gold-border);color:var(--mastro-ink)} @media(max-width:700px){.tutorial-class-choices{gap:6px}button.tutorial-class-choice{grid-template-columns:32px minmax(0,1fr);gap:8px;padding:5px 7px}.tutorial-class-choice img{width:32px;height:40px}} /* Rehearsal class step: the list scrolls above a fixed footer with the step, exit and entry. */ .tutorial-faction-footer{flex-shrink:0;padding:12px 20px 16px;border-top:1px solid var(--mastro-tutorial-line)} .tutorial-faction-footer .tutorial-meta{margin:0 0 10px} .tutorial-faction-guide .tutorial-faction-footer .tutorial-faction-actions{margin-top:0} .tutorial-faction-footer .tutorial-error:not(:empty){margin:0 0 8px} @media(max-width:600px){.tutorial-faction-footer{padding:10px 12px 12px}} @media(max-width:600px),(max-height:500px){.tutorial-faction-footer{padding:8px 10px}.tutorial-faction-footer .tutorial-meta{margin-bottom:8px}.tutorial-faction-guide .tutorial-faction-footer .tutorial-faction-actions{gap:8px}} /* Golpes on wider screens: start and energy recovery share a row when both labels fit, and tighter spacing keeps the selected fraud without scrolling until a detail opens. */ @media(min-width:701px){@container fraud-detail (min-width:440px){ .fraud-idle-controls:not(.fraud-active-controls):has(>.energy-recovery-link){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense;column-gap:10px} .fraud-idle-controls:not(.fraud-active-controls):has(>.energy-recovery-link)>*{grid-column:1/-1} .fraud-idle-controls:not(.fraud-active-controls)>.fraud-apply{grid-column:1;margin:0} .fraud-idle-controls:not(.fraud-active-controls)>.energy-recovery-link{grid-column:2;margin:0} .fraud-idle-controls:not(.fraud-active-controls)>.fraud-energy-note{margin:0 0 10px} .fraud-idle-controls:not(.fraud-active-controls)>.idle-explainer{margin:4px 0 0;line-height:1.5} }} @media(min-width:951px){ .fraud-view .section-head{padding-bottom:14px;margin-bottom:12px} .fraud-view .daily-goals{margin-bottom:12px} .fraud-view>.next-steps{margin:12px 0 0} .game-content .fraud-detail{padding:18px} .fraud-overview{padding-bottom:10px} .fraud-metrics{padding:10px 0;row-gap:10px;margin-bottom:10px} .fraud-metrics .metric-box{padding-top:10px} .fraud-pace{margin:8px 0} .fraud-detail .fraud-preparation{margin:8px 0 0} } .coin-shop-banner{position:relative;display:flex;align-items:center;min-height:176px;margin:0 0 20px;padding:22px;border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-card);overflow:hidden;background:linear-gradient(90deg,var(--mastro-backdrop),transparent 76%),url('/assets/v05/vip-cashier-v1.png') 66% center/cover no-repeat} .coin-shop-banner>div{position:relative;max-width:65%}.coin-shop-banner h2{margin:0;font-family:var(--mastro-font-display);font-size:clamp(1.7rem,2.5vw,2.35rem);line-height:1.05;text-shadow:0 2px 3px var(--mastro-deep);color:var(--mastro-paper)} .vip-checkout{min-width:0;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-card);background:var(--mastro-surface);overflow:hidden}.vip-checkout .checkout-banner{margin:0;border:0;border-bottom:1px solid var(--mastro-line-strong);border-radius:0}.vip-checkout .checkout-back{margin-top:14px;min-height:44px;padding:6px 10px;background:var(--mastro-deep);border:1px solid var(--mastro-line-strong);color:var(--mastro-paper);font-size:.82rem} .vip-checkout-body{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:24px;padding:24px}.checkout-summary{min-width:0;align-self:start;display:grid;justify-items:center;text-align:center;padding:0 20px 20px;border-right:1px solid var(--mastro-line)}.checkout-tray{display:block;width:min(100%,200px);height:auto;image-rendering:pixelated;margin:0 auto 16px}#checkout-summary-values{width:100%}#checkout-summary-values>span,#checkout-summary-values>small{display:block;color:var(--mastro-muted);font-size:.8rem}#checkout-coins{display:block;margin:4px 0;font-family:var(--mastro-font-display);font-size:1.7rem;line-height:1.15;color:var(--mastro-paper)}.checkout-total{margin-top:20px;padding-top:18px;border-top:1px solid var(--mastro-line);display:grid;gap:4px}.checkout-total>span,.checkout-total>small{color:var(--mastro-muted);font-size:.8rem}.checkout-total>strong{font-family:var(--mastro-font-display);font-size:2rem;color:var(--mastro-gold);line-height:1.1} .checkout-payment{min-width:0}.checkout-payment h3{margin:0 0 14px;font-family:var(--mastro-font-display);font-size:1.3rem}.checkout-payment p{font-size:.87rem;line-height:1.5}.checkout-methods{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px}.checkout-methods>button{display:grid;justify-content:start;align-content:center;gap:3px;min-height:74px;padding:12px;text-align:left;white-space:normal;background:var(--mastro-deep);border:1px solid var(--mastro-line-strong);color:var(--mastro-paper);border-radius:var(--mastro-radius-control)}.checkout-methods>button>strong{font-size:1rem}.checkout-methods>button>small{font-size:.72rem;font-weight:400;color:var(--mastro-muted)}.checkout-methods>button[aria-pressed=true]{background:var(--mastro-gold-subtle);border-color:var(--mastro-gold);box-shadow:inset 0 0 0 1px var(--mastro-gold)}.checkout-methods>button[aria-pressed=true]>strong{color:var(--mastro-gold)} .checkout-payment .checkout-pay{width:100%;min-height:46px}.checkout-notice,.checkout-error{padding:12px;border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-control);background:var(--mastro-gold-subtle);color:var(--mastro-paper)}.checkout-error{border-color:var(--mastro-danger-line);background:var(--mastro-danger-surface);color:var(--mastro-danger)}.checkout-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.checkout-actions>button{min-height:44px;flex:1}.checkout-footer{color:var(--mastro-muted);margin:22px 0 0;padding-top:16px;border-top:1px solid var(--mastro-line);font-size:.75rem!important} .checkout-pix-result{margin-top:22px}#checkout-qr-code{display:block;max-width:100%;height:auto;margin:0 auto 22px;border:12px solid var(--mastro-white);background:var(--mastro-white);border-radius:var(--mastro-radius-control)}.checkout-pix-result>label{display:block;margin-bottom:8px;font-size:.8rem;font-weight:600}#checkout-pix-code{display:block;width:100%;min-width:0;resize:none;padding:12px;border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-control);background:var(--mastro-deep);color:var(--mastro-paper);font:12px monospace;margin-bottom:12px}.checkout-pix-result>button{width:100%;min-height:44px}#checkout-challenge-frame{width:100%;height:520px;border:0;background:var(--mastro-white);border-radius:var(--mastro-radius-control)}#checkout-result-title{color:var(--mastro-gold);margin-top:4px}#checkout-card-form{min-height:100px}.vip-checkout [hidden]{display:none!important}.vip-checkout button:focus-visible,.vip-checkout textarea:focus-visible{outline:2px solid var(--mastro-gold);outline-offset:3px} @media(max-width:1250px){.vip-checkout-body{grid-template-columns:1fr}.checkout-summary{grid-template-columns:100px minmax(0,1fr);align-items:center;text-align:left;justify-items:start;gap:16px;padding:0 0 20px;border-right:0;border-bottom:1px solid var(--mastro-line)}.checkout-tray{width:100px;margin:0}.checkout-total{margin-top:10px;padding-top:10px}.checkout-notice{grid-column:1/-1}#checkout-coins{font-size:1.5rem}.checkout-total>strong{font-size:1.8rem}} @media(max-width:600px){.coin-shop-banner{min-height:144px;padding:18px;background-position:60% center}.coin-shop-banner>div{max-width:72%}.vip-checkout-body{padding:16px;gap:18px}.checkout-summary{grid-template-columns:84px minmax(0,1fr);gap:12px}.checkout-tray{width:84px}.checkout-methods>button{padding:10px;min-height:74px}.checkout-methods>button>small{font-size:.7rem}.checkout-actions{flex-direction:column}.checkout-banner h2{font-size:1.8rem}} /* Original Banco Mastro key art; both entry states use the game's shared tokens. */ .entry-boot{position:fixed;inset:0;z-index:300;display:grid;place-items:center;overflow:hidden;background:var(--mastro-deep);isolation:isolate;color:var(--mastro-paper)} .entry-boot-scene,.entry-scene{position:absolute;inset:0;z-index:-2;pointer-events:none} .entry-boot-scene img,.entry-scene img{display:block;width:100%;height:100%;object-fit:cover} .entry-vault-frame{position:absolute;left:50%;top:50%;width:max(100vw,177.778svh);aspect-ratio:16/9;transform:translate(-50%,-50%);transform-origin:50% 40%;perspective:1300px} .entry-vault-frame>picture{position:absolute;inset:0;display:block} .entry-vault-wall{z-index:1} .entry-vault-leaf{z-index:2;clip-path:ellipse(17.3% 31.2% at 50% 40%);transform-origin:66% 40%;backface-visibility:hidden} .entry-boot-scene{animation:entry-vault-camera 16s ease-in-out infinite alternate} .entry-boot::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,var(--mastro-backdrop),transparent 48%,var(--mastro-shadow-soft)),radial-gradient(ellipse at center,transparent 20%,var(--mastro-backdrop))} .entry-boot::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 42%,var(--mastro-gold-subtle) 50%,transparent 58%);opacity:.25;animation:entry-light-sweep 7s ease-in-out infinite} .entry-boot-content{display:grid;justify-items:center;gap:25px;position:relative;z-index:1;width:min(80%,360px);text-align:center;filter:drop-shadow(0 4px 18px var(--mastro-shadow))} .entry-boot-logo{width:100%;height:auto;max-height:165px;object-fit:contain;animation:entry-logo-arrive .7s ease-out both} .entry-boot-content p{margin:0;color:var(--mastro-paper);font:500 .8rem/1.4 var(--mastro-font-body);letter-spacing:.16em;text-transform:uppercase} .entry-loading-track{position:relative;display:block;overflow:hidden;width:148px;height:2px;background:var(--mastro-line)} .entry-loading-track::after{content:'';position:absolute;inset:0;background:var(--mastro-gold);transform:translateX(-100%);animation:entry-loading-scan 1.7s ease-in-out infinite} .entry-boot-help{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));left:20px;right:20px;text-align:center;font-size:.85rem;color:var(--mastro-paper);text-underline-offset:4px} .entry-boot-help[hidden]{display:none} .entry-boot.is-ready{pointer-events:none;animation:entry-boot-exit .8s ease-in both} .entry-boot.is-ready .entry-vault-frame{animation:entry-vault-depart .8s cubic-bezier(.55,0,.7,1) both} .entry-boot.is-ready .entry-vault-wall{animation:entry-vault-uncover .12s linear both} .entry-boot.is-ready .entry-vault-leaf{animation:entry-vault-open .48s cubic-bezier(.3,0,.2,1) both} .entry-boot.is-ready .entry-boot-content{animation:entry-caption-exit .18s ease-in both} .entry-noscript{position:fixed;z-index:301;left:20px;right:20px;bottom:24px;max-width:480px;margin:auto;padding:16px;background:var(--mastro-deep);border:1px solid var(--mastro-line);color:var(--mastro-paper);font-family:var(--mastro-font-body)} .entry-noscript a{color:var(--mastro-gold)} @keyframes entry-vault-camera{from{transform:scale(1)}to{transform:scale(1.08)}} @keyframes entry-light-sweep{0%,20%{transform:translateX(-90%)}80%,100%{transform:translateX(90%)}} @keyframes entry-logo-arrive{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}} @keyframes entry-loading-scan{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}} @keyframes entry-boot-exit{0%,62%{opacity:1}100%{opacity:0}} @keyframes entry-vault-depart{0%,12%{transform:translate(-50%,-50%) scale(1)}100%{transform:translate(-50%,-50%) scale(3.6)}} @keyframes entry-vault-uncover{from{opacity:1}to{opacity:0}} @keyframes entry-vault-open{from{transform:rotateY(0)}to{transform:rotateY(-105deg)}} @keyframes entry-caption-exit{to{opacity:0;transform:translateY(-10px)}} .entry-screen.access-screen{position:relative;isolation:isolate;display:flex;flex-direction:column;min-height:100svh;background:var(--mastro-deep);overflow:clip} .entry-screen .entry-scene{animation:entry-lobby-camera 24s ease-in-out infinite alternate} .entry-screen::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent 35%,var(--mastro-shadow-soft) 66%,var(--mastro-deep)),linear-gradient(0deg,var(--mastro-deep),transparent 20%)} .entry-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px clamp(24px,4vw,64px);z-index:1} .entry-brand img{display:block;width:164px;height:76px;object-fit:contain} .entry-header .access-back{display:inline-flex;align-items:center;gap:8px;margin:0;padding:10px 0;color:var(--mastro-paper);text-decoration:none;font-size:.85rem;text-shadow:0 1px 5px var(--mastro-shadow)} .entry-header .access-back:hover{color:var(--mastro-gold);text-decoration:none} .entry-header .ui-icon{width:18px;height:18px} .access-content{flex:1;display:grid;grid-template-columns:1fr minmax(320px,440px);align-items:center;gap:40px;width:min(100%,1440px);margin:auto;padding:24px clamp(24px,6vw,92px) 64px} .access-panel{grid-column:2;position:relative;min-width:0;padding:32px;border:1px solid var(--mastro-line);border-top:2px solid var(--mastro-gold);border-radius:var(--mastro-radius-card);background:var(--mastro-backdrop);box-shadow:0 18px 60px var(--mastro-shadow-soft);animation:entry-panel-arrive .65s ease-out both} .access-panel .access-eyebrow{margin:0 0 12px;color:var(--mastro-gold);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase} .access-panel h1{font:500 3.3rem/1 var(--mastro-font-display);letter-spacing:-.015em;margin:0 0 16px;color:var(--mastro-paper)} .access-panel .access-intro{font-size:.95rem;line-height:1.5;color:var(--mastro-muted);margin:0 0 24px} .access-actions{display:grid;gap:10px;margin:0 0 20px} .access-actions .oauth-button{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:52px;padding:12px 42px;font-size:.95rem;font-weight:500;line-height:1.3;border-radius:4px;box-shadow:none;white-space:normal} .access-actions .oauth-button .provider-logo{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:20px;height:20px;object-fit:contain;flex:none} .access-actions .oauth-google{background:var(--mastro-white);border-color:var(--mastro-line-strong);color:var(--mastro-ink)} .access-actions .oauth-google:hover:not(:disabled){background:var(--mastro-paper);border-color:var(--mastro-white);color:var(--mastro-ink)} .access-actions .oauth-discord{background:var(--mastro-discord);border-color:var(--mastro-discord-line);color:var(--mastro-white)} .access-actions .oauth-discord:hover:not(:disabled){background:var(--mastro-discord-hover);border-color:var(--mastro-discord-line)} .access-actions .oauth-button:disabled{opacity:.55} .access-actions>p,.access-actions>small{margin:0;font-size:.85rem;line-height:1.45} .access-panel .access-note{font-size:.75rem;line-height:1.5;color:var(--mastro-muted);margin:0 0 16px} .access-panel .access-help{display:inline-block;margin:0;font-size:.8rem;line-height:1.5;color:var(--mastro-paper);text-decoration:none} .access-panel .access-help:hover{color:var(--mastro-gold);text-decoration:underline;text-underline-offset:4px} .access-footer{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-top:18px;margin-top:22px;border-top:1px solid var(--mastro-line)} .access-footer .legal-link{font-size:.75rem;color:var(--mastro-muted);text-underline-offset:4px} .access-footer small{font-size:.7rem;color:var(--mastro-muted)} @keyframes entry-lobby-camera{from{transform:scale(1)}to{transform:scale(1.035) translateX(-.5%)}} @keyframes entry-panel-arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}} @media(min-width:1600px){.entry-screen .entry-scene img{object-position:center 38%}} @media(max-width:760px){ .entry-screen .entry-scene{height:410px;bottom:auto} .entry-screen .entry-scene img{object-position:18% top} .entry-screen::before{background:linear-gradient(0deg,var(--mastro-deep) 20%,transparent 65%)} .entry-header{padding:12px 20px;gap:12px} .entry-brand img{width:126px;height:58px} .entry-header .access-back{font-size:.75rem} .access-content{display:block;width:100%;padding:202px 16px 24px} .access-panel{max-width:460px;margin:0 auto;padding:24px;background:var(--mastro-deep)} .access-panel h1{font-size:2.7rem;margin-bottom:12px} .access-panel .access-intro{font-size:.9rem;margin-bottom:20px} .access-panel .access-eyebrow{margin-bottom:10px} .access-actions{margin-bottom:16px} .access-footer{margin-top:18px;padding-top:16px} .entry-boot-content{width:min(78%,310px);gap:20px} } @media(max-width:360px){.access-panel{padding:20px}.access-panel h1{font-size:2.4rem}.entry-header{padding-inline:16px}.access-content{padding-inline:12px;padding-top:180px}} @media(min-width:761px) and (max-height:720px){.entry-header{padding-block:12px}.entry-brand img{height:52px}.access-content{padding-top:10px;padding-bottom:24px}.access-panel{padding:24px}.access-panel h1{font-size:2.7rem;margin-bottom:12px}.access-panel .access-intro{margin-bottom:18px}.access-actions{margin-bottom:14px}.access-footer{margin-top:16px;padding-top:14px}} @media(max-height:540px) and (orientation:landscape){.entry-screen .entry-scene{height:100%}.entry-screen .entry-scene img{object-position:left center}.access-content{padding-top:10px;padding-bottom:24px;display:block}.access-panel{width:min(100%,420px);margin-left:auto;margin-right:0;padding:24px}.entry-header{padding-block:10px}.entry-brand img{height:52px}.entry-screen::before{background:linear-gradient(90deg,transparent,var(--mastro-backdrop) 70%)}} /* The original character keeps its identity, framed by the Banco Mastro gallery. */ .mastro-selection.character-selection{position:relative;isolation:isolate;max-width:none;min-height:100svh;overflow:hidden;display:flex;justify-content:flex-start;padding:0;margin:0;background:var(--mastro-deep);font-weight:500} .selection-room{position:absolute;inset:0;z-index:-3;pointer-events:none} .selection-room img{width:100%;height:100%;object-fit:cover;object-position:45% center} .mastro-selection::before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(90deg,transparent 20%,var(--mastro-backdrop) 64%,var(--mastro-deep)),linear-gradient(0deg,var(--mastro-deep),transparent 30%,var(--mastro-shadow-soft))} .selection-header,.selection-footer{width:min(100%,1500px);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 40px} .selection-header .selection-brand{width:160px;height:70px;display:block;object-fit:contain} .selection-account{display:flex;align-items:center;gap:24px} .selection-wallet{display:flex;align-items:center;gap:9px;color:var(--gold);font-size:1.1rem;font-variant-numeric:tabular-nums} .selection-wallet .pixel-icon{width:28px;height:28px} .selection-wallet>span{display:grid;gap:2px} .selection-wallet small{font-size:.65rem;color:var(--muted)} .selection-header button{font-size:.76rem;min-height:36px;padding:7px 12px} .selection-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,430px);width:min(100%,1340px);margin:auto;flex:1;min-height:560px;padding:0 40px;gap:36px} .selection-stage{position:relative;min-width:0;min-height:550px;align-self:stretch;pointer-events:none;isolation:isolate} .selection-spotlight{position:absolute;inset:5% 0 12%;background:radial-gradient(ellipse,var(--mastro-gold-subtle),transparent 65%);animation:selection-light 5s ease-in-out infinite alternate} .selection-plinth{position:absolute;width:min(95%,560px);height:auto;left:50%;bottom:0;transform:translateX(-50%);filter:drop-shadow(0 12px 25px var(--mastro-shadow));z-index:-1} .selection-stage .sprite.selection-hero{position:absolute;width:min(110%,640px);height:calc(100% - 40px);left:50%;bottom:40px;transform:translateX(-50%);filter:drop-shadow(0 12px 12px var(--mastro-shadow));animation:selection-hero-arrive .6s cubic-bezier(.2,.7,.2,1) both} .selection-stage-caption{position:absolute;bottom:4px;left:50%;transform:translateX(-50%);color:var(--gold);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap} .selection-stage-caption>span{display:block;text-align:center;font-size:.55rem;letter-spacing:.3em;color:var(--muted);margin-top:4px} .selection-roster{align-self:center;padding:24px 0;min-width:0} .selection-eyebrow{margin:0 0 20px;color:var(--gold);text-transform:uppercase;letter-spacing:.18em;font-size:.68rem} .mastro-selection h1{font-size:clamp(2rem,3.3vw,3rem);line-height:1.12;margin:0 0 16px;letter-spacing:-.02em;font-weight:500;overflow-wrap:anywhere} .selection-summary{display:flex;align-items:center;gap:12px;min-width:0;margin-bottom:26px} .selection-summary>.selection-portrait{width:90px;height:90px;flex-shrink:0;margin:0} .selection-summary>div{min-width:0} .selection-summary h1{margin:0 0 8px;font-size:clamp(1.8rem,3vw,2.7rem)} .selection-summary .vip-mark{width:52px;height:20px;vertical-align:middle} .selection-level{font-size:.82rem;margin:0;color:var(--muted);display:flex;align-items:center;flex-wrap:wrap;gap:12px} .selection-level>span{color:var(--paper);font-variant-numeric:tabular-nums} .selection-state{font-size:.76rem;color:var(--muted);margin:0 0 16px} .selection-intro{font-size:.88rem;line-height:1.6;color:var(--muted);margin:0 0 24px} .selection-free{font-size:.72rem;margin:14px 0 0} .selection-play>button{width:100%;min-height:52px;display:flex;justify-content:center;align-items:center;gap:10px;font-size:1rem;font-weight:500} .selection-manage{font-size:.72rem;margin:22px 0} .selection-manage summary{color:var(--muted);cursor:pointer;width:fit-content} .selection-manage button{margin-top:10px;font-size:.72rem;padding:8px 12px} .selection-roster .season-panel{padding:18px 0 0;margin:24px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:none} .selection-roster .season-panel h2{font-size:1rem;margin-top:4px;font-weight:500} .selection-roster .season-panel .season-summary{gap:12px} .selection-roster .season-panel .season-summary small,.selection-roster .season-panel .season-date,.selection-roster .season-panel .season-rules{font-size:.7rem} .selection-roster .season-panel .season-date{margin-top:8px} .selection-roster .season-timer strong{font-size:.85rem} .selection-footer{color:var(--muted);font-size:.66rem;padding-block:16px;margin-top:auto} .selection-footer .legal-link{font-size:.7rem} .selection-entering .selection-room{animation:selection-room-arrive 1s ease-out both} .selection-entering .selection-roster{animation:entry-logo-arrive .55s .1s ease-out both} @keyframes selection-room-arrive{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:scale(1)}} @keyframes selection-hero-arrive{from{opacity:0;transform:translateX(-50%) translateY(18px)}to{opacity:1;transform:translateX(-50%) translateY(0)}} @keyframes selection-light{from{opacity:.5}to{opacity:1}} @media(min-width:761px) and (max-height:800px){.selection-body{min-height:520px}.selection-stage{min-height:500px}.selection-roster{padding-block:16px}.selection-header{padding-block:10px}.selection-header .selection-brand{height:56px}.selection-footer{padding-block:10px}} @media(max-width:760px){ .selection-header{padding:12px 16px;gap:10px;align-items:flex-start}.selection-header .selection-brand{width:117px;height:52px} .selection-account{gap:8px;align-items:flex-end;flex-direction:column}.selection-wallet{font-size:.9rem;gap:5px}.selection-wallet .pixel-icon{width:23px;height:23px}.selection-wallet small{font-size:.6rem}.selection-header button{font-size:.68rem;padding:4px 8px;min-height:30px} .selection-room{height:460px;bottom:auto;mask-image:linear-gradient(#000 65%,transparent)}.selection-room img{object-position:28% top}.mastro-selection::before{background:linear-gradient(0deg,var(--mastro-deep) 30%,transparent 75%,var(--mastro-shadow-soft))} .selection-body{display:flex;flex-direction:column;min-height:0;padding:0 20px;gap:4px;margin:0 auto;max-width:520px} .selection-stage{height:300px;min-height:300px;width:100%;margin-top:-24px}.selection-stage .sprite.selection-hero{width:370px;height:335px;bottom:12px;max-width:120%}.selection-plinth{width:330px;max-width:100%;bottom:-6px}.selection-stage-caption{bottom:2px;font-size:.6rem}.selection-stage-caption>span{font-size:.5rem} .selection-roster{position:relative;isolation:isolate;width:100%;padding:16px 0 4px}.selection-roster::before{content:'';position:absolute;inset:-8px -20px 0;z-index:-1;background:var(--mastro-deep);box-shadow:0 -12px 24px var(--mastro-deep);pointer-events:none} .selection-eyebrow{font-size:.64rem;margin-bottom:14px}.mastro-selection h1{font-size:2rem}.selection-summary{margin-bottom:22px;gap:12px}.selection-summary>.selection-portrait{width:74px;height:74px}.selection-summary h1{font-size:1.9rem}.selection-level{font-size:.78rem;gap:10px} .selection-footer{padding:16px 20px}.selection-roster .season-panel{margin-top:22px}.selection-manage{margin-block:18px} } @media(max-width:360px){.selection-stage{height:260px;min-height:260px}.selection-stage .sprite.selection-hero{height:300px}.selection-header{padding-inline:12px}.selection-body{padding-inline:16px}.selection-summary h1{font-size:1.65rem}.selection-summary>.selection-portrait{width:65px;height:65px}.selection-summary{gap:9px}.selection-level{font-size:.72rem}} @media(max-width:760px){.selection-stage-caption>span{display:none}} /* Character creation shares the selection scene, with room for touch and keyboard. */ .modal-backdrop.creation-backdrop{padding:0;display:block;overflow:hidden} .dialog.character-dialog{position:relative;isolation:isolate;display:flex;flex-direction:column;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:var(--mastro-deep);box-shadow:none;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;font-weight:500;scroll-padding-block:20px} .creation-room{position:absolute;inset:0;z-index:-3;pointer-events:none;animation:selection-room-arrive .7s ease-out both} .creation-room img{display:block;width:100%;height:100%;object-fit:cover;object-position:40% center} .character-dialog::before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(90deg,transparent 15%,var(--mastro-backdrop) 62%,var(--mastro-deep)),linear-gradient(0deg,var(--mastro-deep),transparent 45%,var(--mastro-shadow-soft))} .creation-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none;width:min(100%,1500px);margin:0 auto;padding:18px 40px} .creation-header .creation-brand{display:block;width:160px;height:70px;object-fit:contain} .character-dialog .creation-back{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 12px;background:var(--mastro-backdrop);border-color:var(--mastro-line);font-size:.8rem;font-weight:500;box-shadow:none} .creation-back .ui-icon{width:17px;height:17px} .character-dialog .creation-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,440px);align-items:stretch;gap:40px;flex:1;width:min(100%,1340px);min-height:440px;margin:0 auto;padding:0 40px} .character-dialog .creation-preview{display:flex;flex-direction:column;align-self:stretch;justify-content:center;min-width:0;margin:0;padding:0;background:none;border:0;border-radius:0;text-align:center} .creation-stage-art{position:relative;isolation:isolate;flex:1;min-height:0;pointer-events:none} .creation-stage-art .selection-spotlight{inset:0 0 8%} .creation-plinth{position:absolute;z-index:-1;left:50%;bottom:-20px;transform:translateX(-50%);width:min(105%,550px);height:auto;filter:drop-shadow(0 12px 25px var(--mastro-shadow))} .creation-preview .sprite.creation-sprite{position:absolute;display:block;left:50%;bottom:22px;transform:translateX(-50%);width:110%;max-width:640px;height:100%;margin:0;filter:drop-shadow(0 12px 12px var(--mastro-shadow));animation:selection-hero-arrive .4s ease-out both} .creation-preview figcaption{position:relative;margin:0;padding:10px 0 4px;color:var(--mastro-paper);font-weight:500} .creation-preview figcaption h3{font:500 clamp(1.5rem,2.4vw,2rem)/1.15 var(--mastro-font-display);margin:0 0 6px} .creation-preview figcaption p{min-height:0;font-size:.78rem;line-height:1.45;margin:0;color:var(--mastro-muted)} .creation-controls{min-width:0;padding:12px 0;animation:entry-panel-arrive .5s ease-out both} .character-dialog .creation-heading{margin:0 0 24px} .character-dialog .creation-eyebrow{margin:0 0 10px;color:var(--gold);font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;font-weight:500} .character-dialog .creation-heading h2{font:500 clamp(2rem,3.4vw,3rem)/1.05 var(--mastro-font-display);letter-spacing:-.015em;margin:0;max-width:360px} .creation-name{margin-bottom:18px} .character-dialog .character-name-label{display:block;font-size:.8rem;font-weight:500;margin:0 0 8px;color:var(--mastro-paper)} .character-dialog #character-name{display:block;width:100%;min-width:0;max-width:100%;margin:0;min-height:48px;padding:12px 14px;background:var(--mastro-subtle);border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-control);color:var(--mastro-paper);font:500 1rem/1.3 var(--mastro-font-body)} .character-dialog #character-name:focus{outline:2px solid var(--gold);outline-offset:2px} .character-dialog #character-name::placeholder{color:var(--mastro-muted);opacity:1} .character-dialog #character-name[aria-invalid=true]{border-color:var(--red)} .character-dialog .character-name-error{font-size:.78rem;font-weight:500;line-height:1.4;margin:6px 0 0;color:var(--red)} .character-dialog .character-name-error:empty{display:none} .character-dialog .character-choices{min-width:0} .character-dialog .avatar-heading{margin:0 0 9px} .character-dialog .avatar-heading h3{font:500 .8rem/1.4 var(--mastro-font-body);color:var(--mastro-paper)} .character-dialog .avatar-filters{display:flex;gap:6px;margin:0 0 10px} .character-dialog .avatar-filters button{min-width:0;min-height:36px;padding:7px 13px;font-size:.73rem;font-weight:500;border-color:var(--mastro-line);background:var(--mastro-subtle);box-shadow:none} .character-dialog .avatar-filters button[aria-pressed=true]{color:var(--gold);border-color:var(--gold);background:var(--mastro-gold-subtle)} .character-dialog .avatar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:none;overflow:visible;padding:3px;margin:-3px} .character-dialog .avatar-option{position:relative;display:flex;flex-direction:column;align-items:center;min-width:0;padding:6px 4px;gap:2px;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-control);background:var(--mastro-subtle);font-weight:500;box-shadow:none;text-align:center;transition:background .15s,border-color .15s} .character-dialog .avatar-option[hidden]{display:none} .character-dialog .avatar-option .sprite.avatar-choice-sprite{height:clamp(64px,7.8vw,92px);width:100%;aspect-ratio:auto} .character-dialog .avatar-option>span:first-of-type{display:flex;align-items:center;min-height:24px;font-size:.72rem;line-height:1.25;font-weight:500} .character-dialog .avatar-option:hover{background:var(--mastro-raised);border-color:var(--mastro-line-strong)} .character-dialog .avatar-option[aria-pressed=true]{border-color:var(--gold);background:var(--mastro-gold-subtle)} .character-dialog .avatar-selected{display:none;position:absolute;align-items:center;justify-content:center;right:5px;top:5px;width:18px;height:18px;border-radius:50%;color:var(--mastro-ink);background:var(--gold)} .character-dialog .avatar-option[aria-pressed=true] .avatar-selected{display:flex} .character-dialog .avatar-selected .ui-icon{width:12px;height:12px} .character-dialog .avatar-option:focus-visible,.character-dialog .avatar-filters button:focus-visible{outline:2px solid var(--gold);outline-offset:2px} .character-dialog .creation-footer{display:block;border:0;margin:20px 0 0;padding:0} .character-dialog button.creation-start{display:flex;align-items:center;justify-content:center;gap:14px;min-width:0;width:100%;min-height:52px;font-size:.95rem;font-weight:500} .creation-start .ui-icon{width:19px;height:19px} /* Desktop keeps the room and the portrait still; only the choices scroll. */ @media(min-width:901px){ .character-dialog .creation-layout{grid-template-rows:minmax(0,1fr)} .character-dialog .creation-preview{padding-bottom:36px} .creation-controls{overflow-y:auto;overscroll-behavior:contain;margin-inline:-12px;padding:16px 12px 36px;scroll-padding-block:20px;scrollbar-width:thin;scrollbar-color:var(--mastro-line-strong) transparent;mask-image:linear-gradient(transparent,#000 16px,#000 calc(100% - 24px),transparent)} } @media(min-width:901px) and (max-height:760px){ .creation-header{padding-block:10px}.creation-header .creation-brand{height:52px} .character-dialog .creation-layout{min-height:400px}.character-dialog .creation-preview,.creation-controls{padding-bottom:24px} .character-dialog .creation-heading{margin-bottom:18px}.character-dialog .creation-heading h2{font-size:2.3rem} .character-dialog .avatar-option .sprite.avatar-choice-sprite{height:66px}.character-dialog .creation-footer{margin-top:16px} } @media(max-width:900px){ .creation-header{padding:10px 16px}.creation-header .creation-brand{width:117px;height:52px} .character-dialog .creation-back{font-size:.73rem;padding:8px 10px} .creation-room{height:460px;bottom:auto;mask-image:linear-gradient(#000 60%,transparent)}.creation-room img{object-position:28% top} .character-dialog::before{background:linear-gradient(0deg,var(--mastro-deep) 20%,transparent 80%,var(--mastro-shadow-soft))} .character-dialog .creation-layout{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;min-height:0;gap:8px;width:min(100%,520px);padding:0 20px max(20px,env(safe-area-inset-bottom));margin:0 auto;flex:none} .character-dialog .creation-preview{display:block;flex:none;margin:-12px 0 0} .creation-stage-art{height:clamp(170px,25svh,230px);min-height:0} .creation-preview .sprite.creation-sprite{width:340px;max-width:100%;height:calc(100% + 24px);bottom:6px} .creation-plinth{width:290px;max-width:100%;bottom:-22px} .creation-preview figcaption{padding:4px 0 8px}.creation-preview figcaption h3{font-size:1.35rem;margin-bottom:4px}.creation-preview figcaption p{font-size:.72rem} .creation-controls{position:relative;isolation:isolate;padding:6px 0 0} .creation-controls::before{content:'';position:absolute;inset:0 -20px -20px;z-index:-1;background:var(--mastro-deep);box-shadow:0 -10px 22px var(--mastro-deep);pointer-events:none} .character-dialog .creation-heading{margin-bottom:16px}.character-dialog .creation-heading h2{font-size:2rem;max-width:none}.character-dialog .creation-eyebrow{display:none} .creation-name{margin-bottom:16px}.character-dialog .character-name-label{font-size:.75rem;margin-bottom:6px} .character-dialog #character-name{min-height:46px;padding:10px 12px} .character-dialog .avatar-option .sprite.avatar-choice-sprite{height:62px}.character-dialog .avatar-option{padding:4px;gap:0} .character-dialog .avatar-option>span:first-of-type{font-size:.66rem;min-height:24px;line-height:1.25} .character-dialog .avatar-grid{gap:7px}.character-dialog .avatar-filters button{min-height:40px;padding-inline:14px} .character-dialog .creation-footer{position:sticky;bottom:0;z-index:2;margin:6px 0 -8px;padding:10px 0 max(12px,env(safe-area-inset-bottom));background:var(--mastro-deep);box-shadow:0 -8px 14px var(--mastro-deep)} } @media(max-width:360px){ .creation-header{padding-inline:12px}.character-dialog .creation-layout{padding-inline:16px}.creation-controls::before{inset-inline:-16px} .creation-stage-art{height:150px}.creation-preview figcaption h3{font-size:1.2rem}.creation-preview figcaption p{font-size:.68rem} .character-dialog .creation-heading h2{font-size:1.8rem}.character-dialog .avatar-option .sprite.avatar-choice-sprite{height:52px} .character-dialog .avatar-option>span:first-of-type{font-size:.62rem}.character-dialog .avatar-grid{gap:6px} } @media(max-width:900px) and (max-height:540px) and (orientation:landscape){ .character-dialog .creation-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:24px;width:100%;max-width:1000px;padding-inline:24px} .character-dialog .creation-preview{position:sticky;top:12px;align-self:start;margin:0}.creation-stage-art{height:230px} .creation-room{height:100%}.character-dialog .creation-heading h2{font-size:1.8rem} .character-dialog .avatar-option .sprite.avatar-choice-sprite{height:48px}.character-dialog .creation-heading{margin-bottom:12px} } /* Hospital and prison share one layout; only the original scene and character differ. */ .game-shell>.game-content.stay-view{display:block;position:relative;padding:0;overflow-y:auto} .stay-cinematic{position:relative;isolation:isolate;min-height:100%;background:var(--mastro-deep);overflow:clip} .stay-room-art{position:absolute;inset:0;z-index:-3;pointer-events:none} .stay-room-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:40% center;animation:stay-camera 24s ease-in-out infinite alternate} .stay-cinematic::before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(0deg,var(--mastro-deep),transparent 55%),linear-gradient(90deg,var(--mastro-shadow-soft),transparent 38%,var(--mastro-backdrop))} .stay-light{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 18% 25%,var(--mastro-gold-subtle),transparent 54%);animation:stay-light 6s ease-in-out infinite alternate} .stay-layout{display:grid;grid-template-columns:minmax(240px,.9fr) minmax(280px,1.1fr);align-items:start;gap:clamp(16px,2vw,28px);padding:28px clamp(18px,2.5vw,32px);min-height:100%} .stay-cinematic .obligation.stay-overview{min-width:0;max-width:none;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;text-align:left} .stay-heading{position:relative;z-index:1;text-shadow:0 2px 14px var(--mastro-shadow)} .stay-heading .stay-eyebrow{margin:0 0 7px;color:var(--gold);font:500 .65rem/1.4 var(--mastro-font-body);letter-spacing:.18em;text-transform:uppercase} .stay-cinematic .stay-heading h1{margin:0;font:500 clamp(2.2rem,4vw,3.4rem)/1 var(--mastro-font-display);color:var(--paper)} .stay-heading .stay-cause{margin:8px 0 0;font-size:.76rem;color:var(--mastro-muted)} .stay-character{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;width:100%;height:clamp(195px,24vw,290px);margin:12px 0 0;pointer-events:none} .stay-patient{display:block;width:110%;max-width:460px;height:100%;object-fit:contain;filter:drop-shadow(0 12px 16px var(--mastro-shadow))} .stay-cell-character{height:250px;margin-top:12px;overflow:hidden;mask-image:linear-gradient(#000 80%,transparent)} .stay-cell-character .sprite.stay-prison-avatar{width:100%;height:290px;max-height:none;filter:drop-shadow(0 8px 12px var(--mastro-shadow))} .stay-cell-gate{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;filter:drop-shadow(0 6px 8px var(--mastro-shadow))} .stay-details{position:relative;z-index:1;padding:16px;background:var(--mastro-backdrop);border:1px solid var(--mastro-line-strong);border-radius:var(--mastro-radius-card);box-shadow:0 12px 32px var(--mastro-shadow-soft)} .stay-admission{margin:0 0 16px;padding:0 0 14px;border-bottom:1px solid var(--mastro-line-strong)} .stay-opponent{display:flex;align-items:center;gap:10px;margin-bottom:10px;min-width:0} .stay-opponent>.portrait{width:64px;height:64px;flex:none} .stay-opponent>div{display:grid;gap:4px;min-width:0;overflow-wrap:anywhere} .stay-opponent small{font-size:.68rem;color:var(--mastro-muted)} .stay-opponent strong{font-size:.9rem;color:var(--paper)} .stay-opponent>div>.player-profile-link{display:flex;align-items:center;min-height:44px;width:fit-content;font-size:.76rem;color:var(--gold)} .stay-admission .stay-taunt{margin:0;color:var(--paper);font-size:.82rem;line-height:1.6;overflow-wrap:anywhere} .stay-details .stay-countdown{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:var(--paper)} .stay-countdown>.ui-icon{width:24px;height:24px;flex:none;color:var(--gold)} .stay-countdown>span{display:grid;gap:2px;min-width:0} .stay-countdown small{font-size:.72rem;line-height:1.3;color:var(--mastro-muted)} .stay-countdown strong{font:500 2rem/1.15 var(--mastro-font-display);font-variant-numeric:tabular-nums;color:var(--gold)} .stay-facts{display:grid;gap:8px;list-style:none;margin:0 0 14px;padding:0;color:var(--paper);font-size:.75rem;line-height:1.4;font-weight:500} .stay-facts li{display:flex;align-items:center;gap:8px} .stay-facts .ui-icon{width:16px;height:16px;flex:none;color:var(--mastro-muted)} .stay-details .stay-next{border-left:2px solid var(--gold);padding-left:10px;margin:0 0 12px;color:var(--paper);font-size:.75rem;line-height:1.5} .stay-details .stay-payment-rule{font-size:.75rem;line-height:1.45;color:var(--mastro-muted);margin:0 0 12px} .stay-details .stay-actions{display:grid;gap:8px;margin:0} .stay-cinematic .stay-actions button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;padding:10px;font-size:.8rem;line-height:1.3;white-space:normal;font-weight:500} .stay-cinematic .stay-actions .stay-reduce{background:var(--mastro-subtle);border-color:var(--mastro-line-strong);color:var(--paper);box-shadow:none} .stay-cinematic .room-chat{position:sticky;top:20px;display:flex;flex-direction:column;min-width:0;min-height:420px;height:min(720px,calc(100dvh - 96px));max-height:none;margin:0;padding:18px;border:1px solid var(--mastro-line-strong);border-top:2px solid var(--gold);border-radius:var(--mastro-radius-card);background:var(--mastro-backdrop);box-shadow:0 16px 50px var(--mastro-shadow-soft)} .stay-cinematic .room-chat-heading{flex:none;gap:12px;margin:0 0 12px;padding:0;background:none;border:0} .stay-cinematic .room-chat-heading h2{font:500 1.6rem/1.1 var(--mastro-font-display);margin:0;color:var(--paper)} .stay-cinematic #room-chat-status{font-size:.68rem;line-height:1.3;white-space:nowrap;color:var(--mastro-muted)} .stay-cinematic .room-chat-messages{flex:1;min-height:220px;height:auto;margin:0 0 12px;padding:0 10px;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-control);background:var(--mastro-backdrop);scrollbar-width:thin} .stay-cinematic .room-message{padding-block:10px;border-color:var(--mastro-line)} .stay-cinematic .room-message p{font-size:.82rem;line-height:1.5;font-weight:500} .stay-cinematic .room-message-heading strong{font-size:.78rem;font-weight:500} .stay-cinematic .room-message-heading time{font-size:.65rem} .stay-cinematic #room-chat-error{font-size:.76rem;line-height:1.4;margin:0 0 10px} .stay-cinematic #room-chat-error:empty{display:none} .stay-cinematic #room-chat-form{margin:0;flex:none} .stay-cinematic .room-chat-compose{display:flex;flex-direction:row;gap:8px} .stay-cinematic .room-chat-compose input{flex:1;min-width:0;min-height:44px;font:500 1rem/1.3 var(--mastro-font-body)} .stay-cinematic .room-chat-compose button{flex:none;width:auto;font-size:.8rem;font-weight:500;padding-inline:14px;min-height:44px} .stay-cinematic .chat-stickers{margin-top:8px} @keyframes stay-camera{from{transform:scale(1)}to{transform:scale(1.025)}} @keyframes stay-light{from{opacity:.45}to{opacity:1}} @media(min-width:701px) and (max-width:1100px){.stay-layout{grid-template-columns:minmax(210px,.9fr) minmax(250px,1.1fr);gap:16px;padding:20px 16px}.stay-details{padding:12px}.stay-cinematic .room-chat{padding:14px}.stay-character{height:210px}.stay-cell-character{height:220px}} @media(max-width:700px){ .stay-layout{display:flex;flex-direction:column;gap:18px;padding:16px} .stay-room-art{height:100%;bottom:0}.stay-room-art img{object-position:28% center} .stay-cinematic::before{background:linear-gradient(0deg,var(--mastro-backdrop),var(--mastro-shadow-soft) 60%,transparent)} .stay-cinematic .obligation.stay-overview{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;width:100%;gap:0 8px} .stay-heading{grid-column:1;grid-row:1}.stay-cinematic .stay-heading h1{font-size:2.6rem}.stay-heading .stay-eyebrow{font-size:.6rem;letter-spacing:.12em}.stay-heading .stay-cause{font-size:.7rem} .stay-character{grid-column:2;grid-row:1;height:170px;margin:0}.stay-patient{width:110%;max-width:100%;height:100%}.stay-cell-character{height:170px}.stay-cell-character .sprite.stay-prison-avatar{height:210px} .stay-details{grid-column:1/-1;width:100%;padding:14px} .stay-details .stay-countdown{margin-bottom:12px}.stay-countdown strong{font-size:1.8rem} .stay-facts{gap:7px;margin-bottom:12px}.stay-details .stay-actions{grid-template-columns:1fr 1fr;align-items:stretch} .stay-cinematic .stay-actions button{font-size:.74rem;padding:9px 8px;min-height:48px} .stay-cinematic .room-chat{position:relative;top:auto;flex:none;width:100%;height:clamp(360px,65svh,540px);min-height:360px;padding:14px} .stay-cinematic .room-chat-heading h2{font-size:1.45rem}.stay-cinematic .room-chat-messages{min-height:180px} } @media(max-width:360px){.stay-layout{padding:12px;gap:14px}.stay-cinematic .stay-heading h1{font-size:2.2rem}.stay-character{height:145px}.stay-details{padding:12px}.stay-cinematic .stay-actions button{font-size:.69rem}.stay-cinematic .room-chat{padding:12px}.stay-cinematic .room-chat-compose button{padding-inline:10px}} /* All locations share the site's typography, surfaces and control geometry. */ .city-scene{position:relative;isolation:isolate;min-width:0;overflow:clip;margin:0 0 16px;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-card);background:var(--mastro-deep)} .city-scene-art{position:absolute;inset:0;z-index:-3;pointer-events:none} .city-scene-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:38% center;animation:city-camera 22s ease-in-out infinite alternate} .city-scene::before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(0deg,var(--mastro-backdrop),transparent 65%),linear-gradient(90deg,transparent 25%,var(--mastro-shadow-soft));pointer-events:none} .city-scene-light{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 12% 20%,var(--mastro-gold-subtle),transparent 65%);opacity:.25;animation:city-light 6s ease-in-out infinite alternate} .city-scene-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,.95fr);align-items:center;gap:16px;min-height:420px;padding:20px;min-width:0} .scene-visual{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;min-width:0;align-self:stretch;min-height:320px;padding:14px 0 0;text-align:center} .city-scene .scene-eyebrow{display:block;margin:0 0 8px;font:500 .65rem/1.4 var(--mastro-font-body);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);text-shadow:0 2px 8px var(--mastro-shadow)} .scene-caption{position:relative;max-width:100%;padding:12px 8px 0;text-shadow:0 2px 12px var(--mastro-shadow)} .city-scene .scene-caption :is(h1,h2){font:500 clamp(1.6rem,2.8vw,2.6rem)/1.05 var(--mastro-font-display);margin:0 0 6px;color:var(--paper);overflow-wrap:anywhere} .scene-state{display:inline-flex;align-items:center;gap:6px;font-size:.76rem;line-height:1.4;color:var(--mastro-muted)} .scene-focus{position:relative;min-width:0;background:var(--mastro-backdrop);border:1px solid var(--mastro-line-strong);border-top:2px solid var(--gold);border-radius:var(--mastro-radius-card);padding:16px;box-shadow:0 12px 32px var(--mastro-shadow-soft)} .city-scene .scene-focus>.card{width:100%;display:block;padding:0;margin:0;min-width:0;border:0;border-radius:0;background:transparent;box-shadow:none} .city-scene .scene-focus>.card>:is(.portrait,.building,.shop-art){display:none} .city-scene .scene-focus :is(.person-content,.business-content){width:100%;min-width:0} .city-scene .scene-focus .person-content{display:flex;flex-direction:column;align-items:stretch;gap:10px} .city-scene .scene-focus .person-content .card-title{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:flex-start} .city-scene .scene-focus .person-content .card-title h2{width:100%;margin:0 0 4px} .city-scene .scene-focus .person-content .actions{align-self:stretch;justify-self:auto;justify-content:flex-start;max-width:100%;margin:0} .city-scene .scene-focus .person-content p{margin:0;font-size:.8rem;line-height:1.4} .city-scene .person-content>.equipment-slots{grid-template-columns:repeat(3,44px)} .city-scene .person-content>.equipment-slots .item-cell{width:44px;height:44px;min-height:44px} .city-scene .scene-focus .business-content{display:flex;flex-direction:column;gap:10px} .city-scene .scene-focus .business-content>.card-bottom{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;margin-top:2px} .city-scene .scene-focus :is(h2,h3){font-weight:500;overflow-wrap:anywhere} .city-scene .scene-focus h2{font:500 1.75rem/1.1 var(--mastro-font-display);margin-bottom:12px} .city-scene .scene-focus .actions{flex-wrap:wrap;gap:8px} .city-scene .scene-focus button{min-height:44px;max-width:100%;white-space:normal;font-weight:500} .city-scene .scene-focus :is(p,small,dl){font-weight:500} .scene-visual>.sprite.scene-actor{display:block;flex:none;width:clamp(180px,23vw,310px);height:clamp(210px,25vw,310px);max-width:100%;max-height:none;filter:drop-shadow(0 12px 14px var(--mastro-shadow));background:none;border:0} .scene-selector{display:flex;align-items:stretch;gap:8px;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;padding:2px 2px 10px;margin:0 0 8px;scrollbar-width:thin;scroll-snap-type:x proximity} .game-content .scene-choice{display:flex;align-items:center;gap:8px;flex:0 0 152px;min-height:68px;padding:7px 10px;background:var(--mastro-subtle);border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-control);text-align:left;font:500 .76rem/1.25 var(--mastro-font-body);color:var(--paper);scroll-snap-align:start;box-shadow:none} .scene-choice>span:last-child{overflow-wrap:anywhere;min-width:0} .game-content .scene-choice:hover{color:var(--gold);border-color:var(--mastro-line-strong);background:var(--mastro-surface);transform:none} .game-content .scene-choice.is-selected{color:var(--gold);border-color:var(--gold);background:var(--mastro-gold-subtle)} .scene-choice-art{display:flex;align-items:center;justify-content:center;flex:none;width:44px;height:48px} .scene-choice-art>.sprite{display:block;width:48px;height:48px;border:0;background:none;flex:none;max-height:none} .game-content .scene-catalogue-heading{font:500 1.45rem/1.2 var(--mastro-font-display);margin:18px 0 12px} .city-scene.night-scene .city-scene-content{display:block;padding:24px 20px 20px;min-height:340px} .night-scene-heading{min-height:100px;display:flex;flex-direction:column;justify-content:center;text-shadow:0 2px 12px var(--mastro-shadow)} .night-scene-heading h2{font:500 2.7rem/1 var(--mastro-font-display);margin:0 0 8px} .night-scene-heading small{font-size:.74rem;color:var(--paper)} .night-scene .night-encounters{margin-top:16px;padding:14px;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-card);background:var(--mastro-backdrop)} .night-scene .night-encounters :is(.encounter-card,.night-player-card){background:var(--mastro-subtle);box-shadow:none} .night-scene .encounters-heading{gap:10px;flex-wrap:wrap} .game-content .clubs{--club-rows:4} .game-content .clubs:has(.unlock-link){--club-rows:5} .game-content .cinematic-club{display:grid;grid-template-rows:subgrid;grid-row:span var(--club-rows);overflow:hidden;padding:0;gap:0;border-top:1px solid var(--mastro-line)} .cinematic-club .scene-thumbnail{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover} .cinematic-club .club-copy{padding:14px;display:grid;grid-template-rows:subgrid;grid-row:2 / span calc(var(--club-rows) - 1);gap:10px;min-width:0} .cinematic-club .club-copy .card-title{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap} .cinematic-club .club-copy h2{margin:0}.cinematic-club .club-copy .club-facts{margin:0}.cinematic-club button{grid-row:3;margin:0;min-height:44px;align-self:start} .cinematic-club .club-copy>.unlock-link{grid-row:4;align-self:start} .game-content .cinematic-club.is-current-club{border-color:var(--gold)} .agency-team{position:relative;display:flex;align-items:flex-end;justify-content:center;flex-wrap:wrap;min-height:240px;gap:0;width:100%;margin-top:auto} .agency-team>.sprite.operations-owner{display:block;width:100%;height:240px;max-height:none;flex:1 0 100%;filter:drop-shadow(0 10px 12px var(--mastro-shadow))} .agency-defender{position:relative;display:grid;justify-items:center;gap:2px;width:32%;max-width:105px;margin-top:-28px;text-shadow:0 2px 8px var(--mastro-shadow)} .agency-defender>.portrait{width:82px;height:90px;max-width:100%;background:none;border:0;filter:drop-shadow(0 8px 8px var(--mastro-shadow))} .agency-defender>span{font-size:.64rem;line-height:1.2;overflow-wrap:anywhere;max-width:100%;color:var(--paper)} .operations-scene.is-interdicted .city-scene-art{filter:saturate(.45) brightness(.7)} .operations-scene.is-interdicted .scene-focus{border-top-color:var(--mastro-danger)} .operations-scene.is-interdicted .scene-state{padding:4px 9px;background:var(--mastro-danger-surface);border:1px solid var(--mastro-danger-line);border-radius:var(--mastro-radius-control)} .operations-scene.is-developed .city-scene-light{background:radial-gradient(ellipse at 35% 70%,var(--mastro-gold-subtle),transparent 80%)} .city-scene .business-card .manager-picker>summary{min-height:44px}.city-scene .business-card .card-bottom{gap:8px;flex-wrap:wrap} .police-location .city-scene-content{align-items:start} .police-visual{align-self:stretch;justify-content:flex-end;min-height:430px} .police-officers{display:flex;align-items:flex-end;justify-content:center;width:100%;margin-top:auto} .police-officers .scene-actor{width:70%;height:280px;max-height:none;filter:drop-shadow(0 8px 16px var(--mastro-shadow))} .police-officers .scene-partner{width:42%;height:210px;margin-left:-20%;max-height:none;opacity:.85;filter:drop-shadow(0 6px 12px var(--mastro-shadow))} .police-visual .scene-caption p{font-size:.8rem;line-height:1.4;margin:6px 0 0;color:var(--paper)} .city-scene .police-screen{max-width:none;margin:0;text-align:left} .city-scene .police-choices{display:grid;grid-template-columns:1fr;gap:10px;margin:0} .city-scene .police-choices article{padding:0 0 10px;border:0;border-bottom:1px solid var(--mastro-line);border-radius:0;background:none;box-shadow:none} .city-scene .police-choices h3{margin:0 0 4px;font:500 1.2rem/1.2 var(--mastro-font-display)} .city-scene .police-choices p{font-size:.76rem;line-height:1.35;margin:0 0 6px}.city-scene .police-choices button{width:100%;margin:0} .city-scene .police-warning{font-size:.74rem;line-height:1.45;margin:10px 0 0;color:var(--mastro-muted)} .market-scene .city-scene-content{grid-template-columns:minmax(0,.75fr) minmax(260px,1fr);min-height:360px} .market-visual{min-height:300px;justify-content:center}.market-display{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;padding-top:120px} .market-display-item{width:32%;height:95px;max-height:none;filter:drop-shadow(0 10px 12px var(--mastro-shadow))} .market-scene .room-chat{width:100%;min-width:0;margin:0;padding:14px;background:var(--mastro-backdrop);border:1px solid var(--mastro-line-strong);border-top:2px solid var(--gold);border-radius:var(--mastro-radius-card)} .market-scene .room-chat-heading{flex-wrap:wrap;gap:6px}.market-scene .room-chat-messages{height:220px;min-height:180px;background:var(--mastro-subtle)} .market-scene .room-chat-compose{display:flex;flex-direction:row;gap:8px}.market-scene .room-chat-compose input{flex:1;width:0;min-width:0;min-height:44px;font-size:1rem}.market-scene .room-chat-compose button{min-height:44px;width:auto;max-width:40%;padding-inline:12px;flex:none} .shop-visual{min-height:340px;justify-content:center}.shop-visual>.scene-eyebrow{align-self:flex-start} .scene-visual>.sprite.scene-product{width:100%;height:245px;max-height:none;filter:drop-shadow(0 18px 12px var(--mastro-shadow))} .garage-scene .scene-product{height:270px}.city-scene .shop-card .stats-inline{gap:10px;margin:12px 0}.city-scene .shop-card button{width:100%} .pharmacy-scene .city-scene-content{min-height:280px}.pharmacy-visual{min-height:230px;justify-content:space-between;align-items:flex-start} .pharmacy-display{display:flex;width:100%;justify-content:center;align-items:flex-end;padding-top:80px}.pharmacy-display>.scene-medicine{width:32%;height:110px;max-height:none;filter:drop-shadow(0 8px 12px var(--mastro-shadow))} .city-scene .pharmacy-status h2{display:flex;align-items:center;flex-wrap:wrap;gap:6px}.city-scene .pharmacy-status h2 strong{margin-left:auto;font-weight:500;color:var(--mastro-success)} .city-scene .pharmacy-status p{font-size:.78rem;line-height:1.4} @keyframes city-camera{from{transform:scale(1)}to{transform:scale(1.025)}} @keyframes city-light{from{opacity:.12}to{opacity:.32}} @media(min-width:701px) and (max-width:1150px){.city-scene-content{padding:16px;gap:12px;grid-template-columns:minmax(0,.8fr) minmax(240px,1fr)}.scene-focus{padding:14px}.scene-visual>.sprite.scene-actor{width:100%;height:245px}.agency-defender{max-width:75px}.agency-defender>.portrait{width:68px;height:75px}.city-scene .scene-focus h2{font-size:1.5rem}} @media(max-width:700px){ .city-scene{margin-bottom:14px}.city-scene-content{grid-template-columns:1fr;gap:12px;padding:14px;min-height:0} .city-scene-art img{object-position:center top}.city-scene::before{background:linear-gradient(0deg,var(--mastro-backdrop),var(--mastro-shadow-soft) 55%,transparent)} .scene-visual{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;justify-content:stretch;min-height:165px;padding:0;text-align:left} .scene-visual>.sprite.scene-actor{grid-column:2;grid-row:1;width:100%;height:185px;margin:0}.scene-visual>.scene-caption{grid-column:1;grid-row:1;padding:0;align-self:center} .city-scene .scene-caption :is(h1,h2){font-size:1.85rem}.city-scene .scene-eyebrow{font-size:.6rem;letter-spacing:.12em} .scene-focus{padding:14px}.city-scene .scene-focus h2{font-size:1.55rem}.city-scene .scene-focus .stats-inline{flex-wrap:wrap;gap:8px} .game-content .scene-choice{flex-basis:138px;font-size:.72rem;min-height:60px;padding:6px 8px;gap:6px}.scene-choice-art{width:38px;height:42px}.scene-choice-art>.sprite{width:42px;height:42px} .city-scene.night-scene .city-scene-content{padding:18px 12px 12px}.night-scene-heading{min-height:100px}.night-scene-heading h2{font-size:2.4rem} .night-scene .night-encounters{padding:12px;margin-top:12px}.night-scene .night-encounters .people-grid{grid-template-columns:1fr}.night-scene .person-card{gap:8px;padding:12px}.night-scene .person-card>.portrait{width:52px;height:62px;flex:none} .game-content .clubs{grid-template-columns:repeat(2,minmax(0,1fr))}.cinematic-club .club-copy{padding:10px;gap:8px}.game-content .cinematic-club h2{font-size:1.5rem}.cinematic-club .level-badge{font-size:.65rem}.cinematic-club .club-facts{font-size:.75rem}.cinematic-club button{font-size:.75rem;padding:8px} .agency-visual{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);min-height:205px}.agency-visual>.scene-eyebrow{grid-column:1;grid-row:1;align-self:start;margin-top:10px}.agency-visual>.scene-caption{grid-column:1;grid-row:1;padding-top:24px}.agency-team{grid-column:2;grid-row:1;min-height:170px;margin:0}.agency-team>.sprite.operations-owner{height:170px}.agency-defender{max-width:58px;margin-top:-30px}.agency-defender>.portrait{width:50px;height:55px}.agency-defender>span{font-size:.56rem} .police-location .city-scene-content{gap:14px}.police-visual{min-height:200px}.police-visual>.scene-eyebrow{grid-column:1;grid-row:1;align-self:start;margin-top:6px}.police-visual>.scene-caption{padding-top:24px}.police-officers{grid-column:2;grid-row:1;margin:0}.police-officers .scene-actor{height:200px}.police-officers .scene-partner{height:155px}.police-visual .scene-caption p{font-size:.72rem} .police-location .city-scene-art img{object-position:left top} .market-scene .city-scene-content{grid-template-columns:1fr;gap:10px;min-height:0}.market-visual{min-height:125px;display:flex}.market-display{padding-top:20px;max-width:260px}.market-display-item{height:100px}.market-scene .room-chat{padding:12px}.market-scene .room-chat-messages{height:190px}.market-scene .room-chat-compose button{font-size:.76rem;padding-inline:10px} .shop-visual{grid-template-columns:1fr 1fr;min-height:190px}.shop-visual>.scene-eyebrow{grid-column:1;grid-row:1;align-self:start;margin-top:6px}.scene-visual>.sprite.scene-product{grid-column:2;grid-row:1;height:200px;width:100%}.shop-visual>.scene-caption{grid-column:1;grid-row:1;padding-top:28px}.garage-scene .scene-product{height:175px} .pharmacy-scene .city-scene-content{min-height:0}.pharmacy-visual{display:flex;min-height:130px}.pharmacy-display{padding:0;align-self:flex-end;max-width:250px}.pharmacy-display>.scene-medicine{height:85px}.city-scene .pharmacy-status h2{font-size:1.4rem} } @media(max-width:360px){.city-scene-content{padding:12px}.scene-focus{padding:12px}.city-scene .scene-caption :is(h1,h2){font-size:1.6rem}.city-scene .scene-focus h2{font-size:1.4rem}.scene-visual>.sprite.scene-actor{height:165px}.game-content .clubs{grid-template-columns:1fr}.agency-defender>span{font-size:.52rem}.police-visual{min-height:210px}.police-officers .scene-actor{height:180px}} /* The operations page is a portfolio, with the office as a restrained backdrop. */ .operations-overview .city-scene-content{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:22px;min-height:170px;padding:24px} .operations-overview .city-scene-art img{object-position:38% 48%} .operations-overview::before{background:linear-gradient(90deg,var(--mastro-backdrop),var(--mastro-shadow-soft) 70%),linear-gradient(0deg,var(--mastro-backdrop),transparent)} .operations-heading h1{font:500 3rem/1 var(--mastro-font-display);margin:0;color:var(--paper);text-shadow:0 2px 12px var(--mastro-shadow)} .operations-overview .scene-eyebrow{margin-bottom:8px} .operations-summary{display:flex;flex-wrap:wrap;align-items:flex-end;gap:24px;margin:0;text-shadow:0 2px 10px var(--mastro-shadow)} .operations-summary>div{min-width:0} .operations-summary dt{display:flex;align-items:center;gap:6px;margin:0 0 6px;font:500 .76rem/1.3 var(--mastro-font-body);color:var(--mastro-muted)} .operations-summary dd{font:500 2rem/1.1 var(--mastro-font-display);margin:0;color:var(--gold);font-variant-numeric:tabular-nums} .operations-summary dd>span{font-size:1.15rem;color:var(--mastro-muted)} .operations-summary .operations-closed dd{color:var(--mastro-danger)} .business-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin:20px 0 12px} .game-content .business-toolbar h2,.game-content .business-catalogue-title{font:500 1.5rem/1.1 var(--mastro-font-display);margin:0;color:var(--paper)} .business-toolbar .purchase-quantity{margin:0}.game-content .business-catalogue-title{margin:24px 0 12px} .operations-dashboard .business-grid{gap:10px} .game-content .operations-dashboard .operation-row{display:grid;grid-template-columns:minmax(185px,.85fr) minmax(0,2.15fr);align-items:center;gap:18px;padding:16px;border:1px solid var(--mastro-line);border-radius:var(--mastro-radius-card);background:var(--mastro-surface);box-shadow:none;min-height:130px} .operation-row .business-identity{display:flex;align-items:center;gap:12px;min-width:0} .operation-row .business-identity>.building{width:60px;height:64px;flex:none;margin:0;padding:0;border:0;background:none;box-shadow:none} .operation-row .business-identity>div{min-width:0} .game-content .operation-row .business-identity h2{margin:0 0 7px;font:500 1.5rem/1.05 var(--mastro-font-display);color:var(--paper);overflow-wrap:anywhere} .business-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.business-meta .level-badge{font-size:.7rem;gap:4px}.business-meta .level-badge>.pixel-icon{width:16px;height:16px} .business-state{display:inline-flex;align-items:center;padding:3px 6px;border-radius:var(--mastro-radius-control);background:var(--mastro-danger-surface);font-size:.68rem;line-height:1.2} .operations-dashboard .operation-row .business-content{display:grid;grid-template-columns:minmax(80px,.6fr) minmax(150px,1.4fr) minmax(110px,1fr);align-items:center;gap:12px;min-width:0} .operations-dashboard .operation-row .business-content>*{grid-column:auto;grid-row:auto;min-width:0} .operation-row .business-status{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:0;min-width:0} .business-income-label{font-size:.7rem;color:var(--mastro-muted)} .operation-row .business-status .reward{display:flex;align-items:center;gap:5px;font:500 1rem/1.2 var(--mastro-font-body);color:var(--gold);overflow-wrap:anywhere} .operation-row .business-status .pixel-icon{width:19px;height:19px;flex:none} .operation-row .business-defense{display:flex;flex-direction:column;gap:6px;min-width:0} .operation-row .business-defense .manager-picker{max-width:none;width:100%;margin:0} .operation-row .business-defense .manager-picker>summary{padding:6px 8px;min-height:44px;font-size:.75rem;background:var(--mastro-subtle);border-color:var(--mastro-line)} .operation-row .business-defense .manager-picker>summary .portrait{width:28px;height:28px} .operation-row .business-defense .defense-roster{margin:0;gap:4px}.operation-row .defense-roster>span{padding:0;border:0;background:none;font-size:.68rem;color:var(--mastro-muted)} .operation-row .business-defense .defense-order{margin:0}.operation-row .business-defense .defense-order>summary{min-height:30px;padding:3px 0;font-size:.72rem;line-height:1.4} .operation-row .business-actions{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-width:0} .operation-row .business-actions>button,.operation-row .business-actions .utility-context>button{min-height:44px;width:100%;margin:0;font-size:.76rem;padding:9px 10px;white-space:normal;font-weight:500} .operation-row .business-actions .utility-context{margin:0;gap:6px}.operation-row .business-actions .utility-context small{font-size:.65rem;line-height:1.3} .operation-row .business-actions .purchase-balance{margin:0;font-size:.7rem;line-height:1.35} .operation-row .business-content>.business-attacker{grid-column:1/-1;margin:0;padding-top:10px;border-top:1px solid var(--mastro-line)} .operations-dashboard .operation-row.closed-business{border-left:3px solid var(--mastro-danger);background:var(--mastro-danger-surface)} .operations-dashboard .business-offers{grid-template-columns:repeat(2,minmax(0,1fr))} .game-content .operations-dashboard .operation-row.is-offer{grid-template-columns:minmax(0,1fr);gap:14px;min-height:0} .operations-dashboard .operation-row.is-offer .business-content{grid-template-columns:minmax(0,1fr) auto;gap:12px} .operation-row.is-offer .business-offer{margin:0;gap:6px;font-size:.73rem}.operation-row.is-offer .business-offer>span{flex-basis:100%}.operation-row.is-offer .business-offer>span:first-child{font-size:.9rem} .operation-row.locked-business{opacity:.75} @media(min-width:701px) and (max-width:1250px){.game-content .operations-dashboard .operation-row{grid-template-columns:minmax(0,1fr);gap:12px}.operation-row .business-identity>.building{width:50px;height:52px}.operations-dashboard .operation-row .business-content{grid-template-columns:minmax(80px,.5fr) minmax(145px,1.4fr) minmax(115px,1fr)}} @media(max-width:700px){ .operations-overview .city-scene-content{min-height:158px;padding:18px 16px;gap:20px;align-items:flex-start;flex-direction:column}.operations-heading h1{font-size:2.4rem}.operations-overview .scene-eyebrow{margin-bottom:6px} .operations-summary{gap:20px}.operations-summary dt{font-size:.68rem;gap:4px;margin-bottom:5px}.operations-summary dd{font-size:1.65rem}.operations-summary dd>span{font-size:1rem} .business-toolbar{margin-top:18px;gap:8px}.business-toolbar .purchase-quantity{margin:0}.game-content .business-toolbar h2,.game-content .business-catalogue-title{font-size:1.35rem} .game-content .operations-dashboard .operation-row{grid-template-columns:minmax(0,1fr);padding:12px;gap:12px;min-height:0} .operation-row .business-identity{gap:10px}.operation-row .business-identity>.building{width:48px;height:52px}.game-content .operation-row .business-identity h2{font-size:1.5rem;margin-bottom:6px} .operations-dashboard .operation-row .business-content{grid-template-columns:minmax(70px,1fr) minmax(0,1.3fr);gap:12px}.operation-row .business-status{grid-column:1;grid-row:1}.operation-row .business-actions{grid-column:2!important;grid-row:1!important}.operation-row .business-defense{grid-column:1/-1!important;grid-row:2!important;gap:4px;padding-top:10px;border-top:1px solid var(--mastro-line)} .operation-row .business-defense .defense-order>summary{min-height:40px;padding:8px 0}.operation-row .business-actions>button{font-size:.75rem}.operation-row .business-status .reward{font-size:.93rem} .operations-dashboard .business-offers{grid-template-columns:minmax(0,1fr)}.operations-dashboard .operation-row.is-offer .business-content{grid-template-columns:minmax(0,1fr) minmax(100px,1fr)} } @media(max-width:360px){.operations-overview .city-scene-content{padding:16px 12px}.operations-summary{gap:14px}.operations-summary dt{font-size:.64rem}.operations-summary dd{font-size:1.5rem}.game-content .operation-row .business-identity h2{font-size:1.4rem}} .shop-equipment-rule{margin:0 0 14px;font-size:.8rem;line-height:1.45;color:var(--mastro-muted)} .shopping-groups .city-scene-content{display:block;min-height:0;padding:16px} .shop-equipment-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));align-items:start;gap:16px;min-width:0} .shop-equipment-group{min-width:0;padding:16px;border:1px solid var(--mastro-line-strong);border-top:2px solid var(--gold);border-radius:var(--mastro-radius-card);background:var(--mastro-backdrop)} .shop-group-heading{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-bottom:12px;min-width:0} .game-content .shop-group-heading h2{display:flex;align-items:center;gap:8px;margin:0;font:500 1.65rem/1.1 var(--mastro-font-display);color:var(--paper)} .shop-group-state{font-size:.72rem;line-height:1.4;color:var(--mastro-muted);overflow-wrap:anywhere} .shop-group-state.is-equipped{color:var(--mastro-success)} .shop-equipment-group .scene-selector{margin:0 0 12px;padding-bottom:8px} .game-content .shop-equipment-group .scene-choice{flex-basis:142px;min-height:60px;font-size:.73rem;padding:6px 8px} .shop-group-body{display:grid;grid-template-columns:minmax(70px,.45fr) minmax(0,1fr);align-items:center;gap:12px;min-width:0} .shop-group-art{display:flex;align-items:center;justify-content:center;min-width:0;pointer-events:none} .shop-group-art>.scene-product{display:block;width:100%;height:150px;max-height:none;filter:drop-shadow(0 8px 10px var(--mastro-shadow))} .shop-group-body>.scene-focus{min-width:0;padding:0;border:0;background:none;box-shadow:none} .shop-group-body .scene-focus .shop-card h3{font:500 1.5rem/1.1 var(--mastro-font-display);margin:0 0 10px;color:var(--paper)} .shop-group-body .scene-focus .shop-card .stats-inline{margin:0 0 12px;gap:8px;font-size:.76rem} .shop-group-body .scene-focus .shop-card .shop-role{margin:0 0 10px;font-size:.75rem} .city-scene .shop-card .shop-replacement{margin:0 0 12px;font-size:.74rem;line-height:1.4;color:var(--mastro-muted)} .shop-group-body .shop-card>button{min-height:44px;width:100%;font-size:.76rem;padding:9px;white-space:normal;font-weight:500} @media(max-width:700px){.shopping-groups .city-scene-content{padding:12px}.shop-equipment-groups{gap:12px}.shop-equipment-group{padding:14px}.shop-group-body{grid-template-columns:minmax(60px,.4fr) minmax(0,1fr);gap:10px}.shop-group-art>.scene-product{height:130px}.game-content .shop-group-heading h2{font-size:1.5rem}.shop-group-body .scene-focus .shop-card h3{font-size:1.4rem}} @media(max-width:360px){.shop-equipment-group{padding:12px}.shopping-groups .city-scene-content{padding:10px}.shop-group-body{grid-template-columns:58px minmax(0,1fr);gap:8px}.shop-group-art>.scene-product{height:110px}.shop-group-body .shop-card>button{font-size:.72rem}} .business-progress{display:flex;flex-wrap:wrap;gap:6px 18px;margin:8px 0;color:var(--muted)} .business-progress strong{color:var(--gold)} .business-automatic{display:flex;flex-direction:column;gap:6px;padding-top:10px;border-top:1px solid var(--line);flex-basis:100%;min-width:0} .business-automatic small,.business-attack-status{display:block;line-height:1.5;color:var(--muted);overflow-wrap:anywhere} .business-automatic button{white-space:normal} .business-rules{font-size:14px;line-height:1.6;color:var(--muted);margin:0 0 18px} .competitors-list{display:grid;gap:10px;margin:18px 0} .competitor-row{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:8px;min-width:0} .competitor-row>.portrait{width:54px;height:54px;flex-shrink:0} .competitor-row>div{flex:1;min-width:0;overflow-wrap:anywhere} .competitor-row .level-badge,.competitor-row small{display:block;margin-top:5px} .competitor-attack-control{display:block;border-radius:var(--mastro-radius-control)} .competitor-attack-control>button:disabled{pointer-events:none} .competitors-pages{display:flex;align-items:center;justify-content:space-between;gap:12px} .replacement-options{display:grid;gap:10px} @media(max-width:700px){.competitor-row{gap:8px;padding:9px;flex-wrap:wrap}.competitor-row>button,.competitor-attack-control,.competitor-attack-control>button{width:100%}.business-automatic button{width:100%}.business-progress{gap:5px 12px}} .operations-dashboard .operation-row .business-content>.business-automatic{grid-column:1/-1!important;grid-row:auto!important} .business-finances .business-progress{flex-direction:column;font-size:.75rem;gap:6px} @media(max-width:700px){.operations-dashboard .operation-row .business-content>.business-finances{grid-column:1;grid-row:1;align-self:start}.business-finances .business-progress{font-size:.72rem}} .business-rules strong,.competitors-rules strong,.competitors-range strong,.business-automatic strong{color:#fff;font-weight:700!important} .competitors-range strong{display:inline-block;white-space:nowrap} .business-upgrade-control{display:block;min-width:0;border-radius:var(--mastro-radius-control)} .business-upgrade-control:focus-visible{outline:2px solid var(--gold);outline-offset:3px} .business-upgrade-control>button:disabled{pointer-events:none} .operation-row .business-actions .business-upgrade-control>button{min-height:44px;width:100%;margin:0;font-size:.76rem;padding:9px 10px;white-space:normal;font-weight:500} /* The chat window opens next to its navigation button, with one tab per room. */ .general-chat-toggle{position:relative;display:flex;align-items:center;gap:8px;text-align:left;color:var(--muted)} .general-chat-toggle .ui-icon{flex:none;width:20px;height:20px} .general-chat-toggle.is-open{color:var(--gold);border-color:var(--gold)} .navigation-footer>.general-chat-toggle{width:100%;padding-inline:8px} .general-chat-unread{flex:none;width:8px;height:8px;margin-left:auto;border-radius:50%;background:var(--red);animation:general-chat-unread-pulse 1.2s ease-in-out infinite} .general-chat-toggle .general-chat-unread[hidden]{display:none} @keyframes general-chat-unread-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.8)}} .general-chat{position:fixed;z-index:85;display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid var(--mastro-line-strong);border-top:2px solid var(--gold);border-radius:var(--mastro-radius-card);background:var(--mastro-deep);box-shadow:0 12px 45px var(--mastro-shadow-soft);font-size:.85rem;isolation:isolate} .general-chat[hidden],.general-chat [hidden]{display:none} .general-chat{transform-origin:bottom left} .general-chat[inert]{pointer-events:none} .general-chat-heading{display:flex;align-items:center;flex:none;gap:8px;padding:4px 8px 4px 12px;border-bottom:1px solid var(--mastro-line);background:var(--mastro-surface);color:var(--gold)} .general-chat-heading button{display:grid;place-items:center;min-width:40px;min-height:40px;padding:8px;border:1px solid transparent;background:transparent;box-shadow:none;color:var(--muted)} .general-chat-heading button:hover{border-color:var(--mastro-line-strong);color:var(--text)} .general-chat-tabs{display:flex;flex:1;gap:4px;min-width:0;overflow-x:auto;scrollbar-width:none} .general-chat-heading .general-chat-tabs [role=tab]{display:inline-flex;align-items:center;flex:none;gap:6px;min-width:0;padding:6px 12px;font-size:.8rem;font-weight:600} .general-chat-heading .general-chat-tabs [role=tab]:hover:not(:disabled){border-color:var(--mastro-line-strong);background:transparent;color:var(--text)} .general-chat-heading .general-chat-tabs [role=tab][aria-selected=true]:not(:disabled){border-color:var(--mastro-line-strong) var(--mastro-line-strong) var(--gold);background:var(--mastro-deep);color:var(--gold)} .general-chat-tabs [role=tab]:focus-visible{outline:2px solid var(--gold);outline-offset:-4px} .general-chat-tabs .general-chat-unread{margin-left:0} .general-chat-panel{display:flex;flex:1;flex-direction:column;min-height:0} .general-chat-status,.general-chat-error{flex:none;margin:0;padding:8px 12px;font-size:.75rem;line-height:1.4} .general-chat-status{color:var(--muted)} .general-chat-error:empty{display:none} .general-chat .general-chat-messages{flex:1;min-height:0;height:auto;margin:0;padding:0 12px;border:0;border-radius:0;background:var(--mastro-deep);scrollbar-width:thin;overflow-x:hidden} .general-chat-messages .room-message{gap:8px;padding-block:10px;font-size:.82rem;line-height:1.5} .general-chat-messages .room-message .portrait{width:28px;height:28px;flex:none} .general-chat-messages .room-message-heading{gap:2px 8px} .general-chat-messages .room-message-heading strong{font-size:.78rem} .general-chat-messages .room-message-heading time{font-size:.65rem} .general-chat-messages .room-message-body p{margin-top:3px} .general-chat-empty{padding:28px 12px;text-align:center;color:var(--muted);font-size:.8rem;line-height:1.5} .general-chat-latest{align-self:center;flex:none;min-height:32px;margin:4px 8px;padding:5px 10px;font-size:.75rem;color:var(--gold)} .general-chat-retry{align-self:flex-start;flex:none;margin:0 12px 8px;padding:6px 10px;min-height:32px;font-size:.75rem} .general-chat-form{display:flex;flex:none;gap:8px;margin:0;padding:10px;border-top:1px solid var(--mastro-line);background:var(--mastro-surface)} .general-chat-form input{flex:1;min-width:0;width:0;min-height:42px;padding:9px 10px;border:1px solid var(--mastro-line-strong);font:inherit} .general-chat-form button{flex:none;min-width:94px;min-height:42px;padding:9px 12px;font-size:.8rem} @media(max-width:900px){ .game-shell .mobile-nav{grid-template-columns:repeat(6,minmax(0,1fr))} .game-shell .mobile-nav .general-chat-toggle.is-open{background:var(--gold);color:var(--mastro-subtle);border-color:var(--gold)} .mobile-nav .general-chat-unread{position:absolute;top:4px;right:calc(50% - 18px);margin:0} .general-chat-form input{font-size:16px} .general-chat{transform-origin:bottom center} .general-chat-heading button{min-width:44px;min-height:44px} }