:root{--surface:#303632;--control:#373c39;--text:#dce3de;--field:#252a27;--phone-gap:15px;--phone-number-opacity:1;--phone-number-color:#38af78}
:root[data-mode=light]{color-scheme:light;--bg:#f2f5f3;--side:#ffffff;--surface:#fff;--control:#e7eee9;--text:#1e3027;--field:#f7faf8;--line:#ced8d1;--muted:#556b5d}
body{color:var(--text)}button{color:var(--text);background:var(--control);border-color:var(--line)}input:not([type=checkbox]):not([type=range]),textarea,select{background:var(--field);color:var(--text);border-color:var(--line)}button.primary,button.active,.sideTabs button.active{background:var(--green);border-color:var(--green);color:#fff}.logo{background:linear-gradient(120deg,var(--green),var(--theme-end));color:#fff;border-color:transparent}.sideTabs .active{box-shadow:inset 0 -2px var(--theme-end)}.phone.selected{border-color:var(--green)}.phoneNumber{font-size:1.12em;font-weight:700;color:var(--phone-number-color);opacity:var(--phone-number-opacity)}.grid{gap:var(--phone-gap)}
.appearanceLauncher{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin:4px 0 10px;padding:7px;font-size:12px;background:transparent;border-color:var(--line);color:var(--green)}
.appearanceDialog,.browserSessionsDialog{width:min(620px,94vw);max-height:90vh;overflow:auto;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);padding:24px;box-shadow:0 22px 70px #0005}.appearanceDialog::backdrop,.browserSessionsDialog::backdrop{background:#10181480;backdrop-filter:blur(4px)}.appearanceDialog h3{font-size:17px;font-weight:600;border-left:3px solid var(--green);padding-left:10px;margin:22px 0}.appearanceRows{display:grid;grid-template-columns:190px minmax(0,1fr);align-items:center;gap:23px 15px}.appearanceRows>span,.appearanceRows>label{text-align:right;font-size:13px}.segmented{display:flex;flex-wrap:wrap;gap:0}.segmented button{border-radius:0}.segmented button:first-child{border-radius:4px 0 0 4px}.segmented button:last-child{border-radius:0 4px 4px 0}.colorSwatches{display:grid;grid-template-columns:repeat(6,40px);gap:10px}.colorSwatches button{height:28px;padding:0;border:2px solid transparent;border-radius:5px}.colorSwatches .chosen{outline:2px solid var(--text);outline-offset:2px}.labelSwatches{grid-template-columns:repeat(9,26px);gap:8px}.labelSwatches button{height:27px}.appearanceRange{display:flex;align-items:center;gap:10px}.appearanceRange input{min-width:0;width:100%;accent-color:var(--green)}.appearanceRange output{min-width:42px;font-size:11px;color:var(--muted)}.appearanceFooter{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid var(--line);padding-top:20px;margin-top:28px}.appearanceFooter small,.sessionHint{color:var(--muted);font-size:11px;line-height:1.6}.browserSessionsDialog form{display:flex;align-items:end;gap:12px;margin:18px 0}.browserSessionsDialog form label{display:grid;gap:8px;flex:1}.browserSessionsDialog form button{white-space:nowrap}.browserSessionRow{display:flex;align-items:center;gap:15px;padding:13px 0;border-bottom:1px solid var(--line)}.browserSessionRow>div{flex:1;display:grid;gap:7px}.browserSessionRow small{color:var(--muted);font-size:11px}#browserSessionsStatus{color:var(--green);white-space:pre-wrap}.rentalTokenRow{flex-wrap:wrap}.rentalTokenRow button{white-space:nowrap}.rentalTokenRow span{flex-basis:100%}
:root[data-side=right] aside{left:auto;right:0;border-left:1px solid var(--line);border-right:0}:root[data-side=right] main{margin-left:0;margin-right:var(--side-width)}:root[data-side=right] .sidebarCollapsed aside{transform:translateX(100%)}:root[data-side=right] .sidebarCollapsed main{margin-right:0}
:root[data-mode=light] .login,:root[data-mode=light] dialog,:root[data-mode=light] .floatingDialog,:root[data-mode=light] #zoomTools,:root[data-mode=light] .phonehead,:root[data-mode=light] .phonefoot,:root[data-mode=light] .phoneTagRow,:root[data-mode=light] .proxyPanel,:root[data-mode=light] .textColumnCard,:root[data-mode=light] .adbPreset,:root[data-mode=light] .proxyOverview>div{background:var(--surface);color:var(--text);border-color:var(--line)}:root[data-mode=light] .proxyBadge,:root[data-mode=light] .zoomProxyState,:root[data-mode=light] .textColumnButtons{background:var(--control);color:var(--muted)}:root[data-mode=light] .dialogTitle strong,:root[data-mode=light] .textColumnLine>span:last-child,:root[data-mode=light] .textColumnCard>small,:root[data-mode=light] #greeting,:root[data-mode=light] h1,:root[data-mode=light] h2,:root[data-mode=light] .muted{color:var(--text)}:root[data-mode=light] .phone,:root[data-mode=light] .proxyTable{background:var(--surface);color:var(--text)}:root[data-mode=light] .xwTextDialog #textSource,:root[data-mode=light] .xwDelimiter>input{background:var(--field);color:var(--text);border-color:var(--line)}:root[data-mode=light] .proxyDead .proxyBadge,:root[data-mode=light] .proxyDead .zoomProxyState{background:#ffe4e4;color:#a61622}
@media(max-width:720px){:root[data-side=right] aside{transform:translateX(100%)}:root[data-side=right] .sidebarOpen aside{transform:translateX(0)}.appearanceDialog,.browserSessionsDialog{padding:18px}.appearanceRows{grid-template-columns:1fr;gap:10px}.appearanceRows>span,.appearanceRows>label{text-align:left;margin-top:10px}.colorSwatches{grid-template-columns:repeat(6,minmax(25px,40px))}.labelSwatches{grid-template-columns:repeat(9,minmax(20px,27px));gap:6px}.appearanceFooter{flex-wrap:wrap}.browserSessionsDialog form{flex-wrap:wrap}.browserSessionsDialog form label{flex-basis:100%}}
