/* ===== NESTRA THEME TOKENS ===== */ :root{ color-scheme:light; --bg:#dce6f3; --panel:#f7fbff; --field:#ffffff; --panel-2:#edf4fb; --logo-surface:#ffffff; --logo-line:#9fb9d3; --line:#b8cbe0; --line-soft:#d0dce9; --text:#0e2038; --muted:#5b6b82; --brand:#0a63c4; --brand-ink:#ffffff; --brand2:#087cf0; --brand-soft:#d7e8fb; --ok:#16855c; --ok-soft:#cfe6da; --ok-line:#3f7f60; --cell-off:#dde5ef; --danger:#c04456; --warn:#9d6a0d; --sidebar:#08192d; --chart-a:#0a63c4; --chart-b:#18a8c9; --chart-c:#6a67d8; --chart-d:#2b8f68; --youtube:#e82f3d; --youtube-ink:#ffffff; --shadow:0 14px 34px -18px rgba(14,32,56,.34); } html[data-theme="dark"]{ color-scheme:dark; --bg:#06111f; --panel:#10253b; --field:#091827; --panel-2:#0a1c2e; --logo-surface:#edf6ff; --logo-line:#6fa9d8; --line:#355b79; --line-soft:#223d56; --text:#eef5fd; --muted:#94acc6; --brand:#2f9dff; --brand-ink:#04121f; --brand2:#21c8ff; --brand-soft:#123b60; --ok:#3ecf95; --ok-soft:#1a3b30; --ok-line:#3c9a74; --cell-off:#1c2e43; --danger:#ff6b7d; --warn:#ffb84d; --sidebar:#030b16; --chart-a:#2f9dff; --chart-b:#22c7c9; --chart-c:#8a7dff; --chart-d:#46bf88; --youtube:#ff3347; --youtube-ink:#ffffff; --shadow:0 16px 38px -18px rgba(0,0,0,.72); } html[data-theme="gold"]{ color-scheme:dark; --bg:#0b0905; --panel:#21190c; --field:#130f08; --panel-2:#171107; --logo-surface:#fff7e4; --logo-line:#b98c2d; --line:#6a5424; --line-soft:#403318; --text:#f6eed6; --muted:#b8a874; --brand:#e5b845; --brand-ink:#1a1403; --brand2:#f7d370; --brand-soft:#3b2d0d; --ok:#9ec27a; --ok-soft:#2f3418; --ok-line:#7d9a52; --cell-off:#2c2517; --danger:#e2705f; --warn:#e2a33c; --sidebar:#080603; --chart-a:#e5b845; --chart-b:#d98c36; --chart-c:#c9a963; --chart-d:#8ea95a; --youtube:#e33b32; --youtube-ink:#fff7e4; --shadow:0 16px 38px -18px rgba(0,0,0,.76); } *{box-sizing:border-box;}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text);}button,input,select{font:inherit;}button{cursor:pointer;}.sidebar{position:fixed;inset:0 auto 0 0;width:230px;background:var(--sidebar);color:var(--brand2);padding:28px 18px;display:flex;flex-direction:column;z-index:5;}.brand{font-weight:900;letter-spacing:.18em;font-size:24px;}.brand.big{color:var(--text);text-align:center;font-size:30px;}.brand-sub{opacity:.45;font-size:11px;letter-spacing:.3em;margin-top:2px;}.center{text-align:center;}.version{margin-top:8px;color:var(--muted);font-size:11px;font-weight:800;}nav{margin-top:34px;display:grid;gap:8px;}.nav{border:0;background:transparent;color:var(--brand2);text-align:left;padding:12px 14px;border-radius:10px;}.nav.active,.nav:hover{background:color-mix(in srgb,var(--brand) 16%,var(--sidebar));color:var(--brand2);}.sidebar-bottom{margin-top:auto;font-size:13px;color:var(--brand2);display:flex;gap:8px;align-items:center;}.dot{width:9px;height:9px;border-radius:50%;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));display:inline-block;}.dot.online{background:var(--ok);}main{margin-left:230px;min-height:100vh;}.topbar{height:82px;padding:18px 34px;background:var(--panel);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;}.topbar select{border:0;font-size:17px;font-weight:700;outline:none;min-width:260px;background:var(--field);}.eyebrow{font-size:10px;color:var(--muted);letter-spacing:.18em;font-weight:800;}.view{display:none;padding:34px;}.view.active{display:block;}.hero{background:linear-gradient(135deg,var(--brand),var(--brand2));color:var(--brand-ink);border-radius:22px;padding:30px;min-height:170px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 12px 30px color-mix(in srgb,var(--brand) 24%,transparent);}.hero .eyebrow{color:var(--muted);}.hero h1{margin:8px 0 10px;font-size:34px;}.status-line{font-size:13px;font-weight:800;display:flex;gap:8px;align-items:center;}.status-dot{width:10px;height:10px;border-radius:50%;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.status-dot.online{background:var(--ok);box-shadow:0 0 0 5px color-mix(in srgb,var(--ok) 24%,transparent);}.hero-time{text-align:right;}.hero-time span{display:block;opacity:.72;}.hero-time strong{font-size:38px;}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:18px 0;}.card,.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;}.label{color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;}.metric{font-size:24px;font-weight:800;margin:10px 0 4px;}.metric.small{font-size:18px;}.muted{color:var(--muted);font-size:13px;}.strongish{font-weight:700;}.clamp{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.dashboard-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;}.panel-head{display:flex;align-items:center;justify-content:space-between;}.panel h2{margin:0 0 16px;font-size:18px;}.usage-row{display:grid;grid-template-columns:1fr auto;gap:12px;padding:11px 0;border-top:1px solid var(--line);align-items:center;}.usage-row:first-child{border-top:0;}.usage-name{font-weight:750;}.mini-process{font-size:11px;color:var(--muted);margin-top:2px;}.usage-time{color:var(--muted);font-variant-numeric:tabular-nums;}.history-row{display:flex;justify-content:space-between;padding:11px 0;border-top:1px solid var(--line);}.history-row:first-child{border-top:0;}.history-row span{color:var(--muted);}.section-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:22px;}.section-head h1{margin:6px 0 4px;font-size:30px;}.section-head p{color:var(--muted);margin:0;}.app-tools{display:flex;gap:10px;}.app-tools input{width:260px;}.apps-summary{display:flex;gap:12px;flex-wrap:wrap;margin:-4px 0 16px;}.apps-summary span{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-size:12px;color:var(--muted);}.apps-summary strong{color:var(--text);}.app-list{display:grid;gap:16px;}.app-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;overflow:hidden;}.app-card-top{padding:20px;display:flex;align-items:center;justify-content:space-between;gap:20px;}.app-identity{display:flex;gap:14px;align-items:center;min-width:0;}.app-icon-img,.app-icon-fallback{width:52px;height:52px;border-radius:13px;flex:0 0 auto;}.app-icon-img{object-fit:contain;padding:4px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.app-icon-fallback{display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-size:22px;font-weight:900;}.app-copy{min-width:0;}.app-name-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}.app-name-row h2{margin:0;font-size:19px;}.app-process{font-size:12px;color:var(--muted);font-weight:700;margin-top:3px;}.app-path{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:720px;margin-top:3px;}.app-usage{text-align:right;flex:0 0 auto;}.app-usage span{display:block;color:var(--muted);font-size:11px;}.app-usage strong{display:block;font-size:20px;margin-top:2px;}.status-badge{font-size:10px;font-weight:900;letter-spacing:.04em;border-radius:999px;padding:5px 8px;}.status-badge.allowed{background:var(--ok-soft);color:var(--ok);}.status-badge.blocked{background:color-mix(in srgb,var(--danger) 11%,var(--panel));color:var(--danger);}.status-badge.scheduled{background:color-mix(in srgb,var(--warn) 11%,var(--panel));color:var(--warn);}.status-badge.system{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);}.limit-strip{padding:0 20px 18px;}.limit-strip-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-bottom:7px;}.progress{height:7px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border-radius:999px;overflow:hidden;}.progress span{display:block;height:100%;background:var(--brand);border-radius:999px;}.app-controls{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:.9fr 1.4fr 1.1fr 1.3fr;}.control-box{padding:17px 18px;border-right:1px solid var(--line);min-width:0;}.control-box:last-child{border-right:0;}.control-title{display:block;font-size:10px;color:var(--muted);font-weight:900;text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px;}.switch-line{display:flex;gap:8px;align-items:center;font-weight:750;font-size:13px;}.switch-line input{width:18px;height:18px;accent-color:var(--brand);}.time-pair,.limit-input,.bonus-buttons{display:flex;gap:7px;align-items:center;margin-top:10px;}.time-pair input{width:105px;}.limit-input input{width:90px;}.bonus-current{font-weight:800;font-size:13px;}.bonus-buttons{flex-wrap:wrap;}.bonus-buttons button{padding:7px 9px;font-size:12px;}.app-card-footer{padding:14px 20px;display:flex;justify-content:space-between;align-items:center;gap:18px;}.system-note{font-size:12px;color:var(--muted);font-weight:700;}.primary,.secondary{border-radius:10px;padding:10px 15px;font-weight:800;}.primary{background:var(--brand);color:var(--brand-ink);border:1px solid var(--brand);}.primary:disabled,.secondary:disabled,input:disabled{opacity:.45;cursor:not-allowed;}.secondary{background:var(--field);color:var(--text);border:1px solid var(--line);}.compact{padding:9px 12px;}.inline-setting{display:flex;gap:9px;align-items:center;flex-wrap:wrap;}.inline-setting label{color:var(--muted);font-size:12px;font-weight:800;}input[type=time],input[type=number],input[type=password],input[type=search],select{border:1px solid var(--line);border-radius:9px;padding:10px 11px;background:var(--field);color:var(--text);min-width:0;}.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}.shot{background:var(--panel);border:1px solid var(--line);border-radius:13px;overflow:hidden;}.shot img{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--panel);display:block;}.shot-meta{padding:9px 11px;display:flex;justify-content:space-between;color:var(--muted);font-size:12px;}.login-overlay{position:fixed;inset:0;background:color-mix(in srgb,var(--sidebar) 78%,transparent);backdrop-filter:blur(8px);display:grid;place-items:center;z-index:20;}.login-overlay.hidden{display:none;}.login-card{width:min(420px,calc(100% - 32px));background:var(--panel);border-radius:20px;padding:30px;box-shadow:0 22px 70px color-mix(in srgb,var(--text) 18%,transparent);}.login-card h1{text-align:center;margin:16px 0 8px;}.login-card p{color:var(--muted);font-size:13px;line-height:1.5;}.login-card input{width:100%;margin:10px 0;}.login-card button{width:100%;}.error{color:var(--danger);font-size:13px;margin-top:10px;min-height:18px;}.toast{position:fixed;right:24px;bottom:24px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);padding:11px 14px;border-radius:10px;opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s;z-index:30;}.toast.show{opacity:1;transform:translateY(0);}.empty{color:var(--muted);padding:22px;text-align:center;border:1px dashed var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} @media(max-width:1200px){.app-controls{grid-template-columns:1fr 1fr;}.control-box:nth-child(2){border-right:0;}.control-box:nth-child(-n/**/+2){border-bottom:1px solid var(--line);}.gallery{grid-template-columns:repeat(3,1fr);}} @media(max-width:900px){.dashboard-grid{grid-template-columns:1fr;}.cards{grid-template-columns:1fr;}.app-head{align-items:flex-start;flex-direction:column;}.app-tools{width:100%;}.app-tools input{flex:1;width:auto;}.app-card-top{align-items:flex-start;}.app-path{max-width:460px;}} @media(max-width:760px){.sidebar{width:78px;padding:24px 10px;}.brand{font-size:14px;letter-spacing:.08em;}.brand-sub,.version,.nav{font-size:0;}.nav::first-letter{font-size:14px;}main{margin-left:78px;}.topbar,.view{padding-left:18px;padding-right:18px;}.topbar select{min-width:160px;}.hero{align-items:flex-start;gap:20px;flex-direction:column;}.hero-time{text-align:left;}.section-head{align-items:flex-start;flex-direction:column;}.app-tools{flex-direction:column;}.app-controls{grid-template-columns:1fr;}.control-box{border-right:0!important;border-bottom:1px solid var(--line);}.control-box:last-child{border-bottom:0;}.app-card-top{flex-direction:column;}.app-usage{text-align:left;}.app-card-footer{align-items:flex-start;flex-direction:column;}.gallery{grid-template-columns:1fr 1fr;}} /* v0.2.8 branding + configurable block message */ .sidebar-logo{width:170px;max-height:170px;object-fit:contain;align-self:center;border-radius:18px;display:block;}.login-logo{display:block;width:210px;height:210px;object-fit:contain;margin:0 auto 10px;border-radius:20px;}.message-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr);gap:18px;align-items:start;}.message-editor{display:flex;flex-direction:column;}.message-toggle{padding-bottom:18px;margin-bottom:4px;border-bottom:1px solid var(--line);}.form-label{display:block;margin:18px 0 8px;color:var(--muted);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;}.wide-input{width:100%;border:1px solid var(--line);border-radius:10px;padding:11px 12px;background:var(--field);color:var(--text);}.message-textarea{width:100%;resize:vertical;min-height:190px;border:1px solid var(--line);border-radius:12px;padding:13px;background:var(--field);color:var(--text);font:inherit;line-height:1.5;}.wide-input:focus,.message-textarea:focus{outline:2px solid var(--brand);border-color:var(--brand);}.placeholder-help{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-top:14px;}.placeholder-help strong{font-size:12px;color:var(--muted);margin-right:4px;}.token{border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);border-radius:8px;padding:6px 8px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;}.token:hover{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.message-help{margin-top:10px;line-height:1.5;}.message-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px;}.preview-panel{position:sticky;top:100px;}.notification-preview{margin-top:14px;border:1px solid var(--line);border-radius:16px;padding:20px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 16px 40px color-mix(in srgb,var(--text) 18%,transparent);display:grid;grid-template-columns:128px 1fr;gap:18px;min-height:280px;transition:.2s;}.notification-preview.preview-disabled{opacity:.42;filter:grayscale(.3);}.notification-preview>img{width:128px;height:128px;object-fit:contain;border-radius:14px;}.notification-copy{min-width:0;}.notification-brand{color:var(--brand);font-size:12px;font-weight:900;margin:4px 0 7px;}.notification-copy h2{font-size:21px;margin:0 0 12px;overflow-wrap:anywhere;}.preview-body{color:var(--text);white-space:pre-line;line-height:1.5;min-height:92px;overflow-wrap:anywhere;}.preview-ok{display:block;margin:15px 0 0 auto;border:0;border-radius:9px;background:var(--brand);color:var(--text);font-weight:800;padding:9px 28px;cursor:default;}.preview-note{margin-top:14px;line-height:1.5;} @media(max-width:1100px){.message-grid{grid-template-columns:1fr;}.preview-panel{position:static;}} @media(max-width:760px){.sidebar-logo{width:58px;height:58px;border-radius:10px;}.login-logo{width:170px;height:170px;}.message-actions{flex-direction:column;}.message-actions button{width:100%;}.notification-preview{grid-template-columns:92px 1fr;}.notification-preview>img{width:92px;height:92px;}} .short-input{max-width:240px;} /* v0.2.8 transparent branding + modern block-message preview */ .sidebar-logo{width:154px;max-height:154px;object-fit:contain;align-self:center;border-radius:0;display:block;filter:drop-shadow(0 10px 20px color-mix(in srgb,var(--text) 18%,transparent));} .login-logo{display:block;width:190px;height:190px;object-fit:contain;margin:0 auto 6px;border-radius:0;filter:drop-shadow(0 14px 28px color-mix(in srgb,var(--text) 18%,transparent));} .message-tip{margin-top:14px;padding:11px 13px;border-radius:10px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border:1px solid var(--line);color:var(--text);font-size:12px;line-height:1.45;} .notification-preview{margin-top:14px;border:1px solid var(--line);border-radius:22px;padding:0;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 22px 52px color-mix(in srgb,var(--text) 18%,transparent);display:block;min-height:360px;overflow:hidden;transition:.2s;} .preview-header{min-height:124px;padding:17px 22px;display:flex;align-items:center;gap:16px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--brand-ink);} .preview-header>img{width:92px;height:92px;object-fit:contain;flex:0 0 auto;filter:drop-shadow(0 8px 16px color-mix(in srgb,var(--brand) 24%,transparent));} .notification-brand{color:var(--brand-ink);font-size:13px;font-weight:900;margin:0 0 5px;} .preview-badge{display:inline-block;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border:1px solid var(--line);border-radius:999px;padding:5px 9px;font-size:9px;font-weight:900;letter-spacing:.08em;} .preview-app{font-size:15px;font-weight:900;margin-top:8px;} .notification-copy{padding:21px 23px 20px;min-width:0;} .notification-copy h2{font-size:23px;margin:0 0 14px;overflow-wrap:anywhere;color:var(--text);} .preview-body-card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:13px 15px;} .preview-body{color:var(--text);white-space:pre-line;line-height:1.55;min-height:80px;overflow-wrap:anywhere;} .preview-ok{display:block;margin:18px 0 0 auto;border:0;border-radius:12px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 8px 18px color-mix(in srgb,var(--text) 18%,transparent);color:var(--text);font-weight:850;padding:11px 30px;cursor:default;} @media(max-width:760px){.sidebar-logo{width:58px;height:58px;}.login-logo{width:160px;height:160px;}.preview-header>img{width:72px;height:72px;}.preview-header{min-height:106px;padding:14px 16px;}.notification-copy{padding:18px;}} /* v0.2.8 light / dark theme */ html{color-scheme:light;} .topbar-actions{display:flex;align-items:center;gap:10px;} .theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:104px;border:1px solid var(--line);border-radius:10px;padding:9px 12px;background:var(--field);color:var(--text);font-weight:800;transition:background .18s,border-color .18s,color .18s,transform .18s;} .theme-toggle:hover{background:var(--field);transform:translateY(-1px);} .theme-icon{font-size:18px;line-height:1;}.theme-label{font-size:12px;} .login-theme-toggle{position:absolute;top:22px;right:22px;z-index:22;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));backdrop-filter:blur(12px);} @media(max-width:760px){.theme-toggle{min-width:42px;padding:9px;}.theme-label{display:none;}.login-theme-toggle{top:14px;right:14px;}.topbar-actions{gap:7px;}} /* v0.3 Device Access Control */ .cards{grid-template-columns:repeat(4,minmax(0,1fr));} .access-head{align-items:center;}.access-limit-panel{padding:24px 28px;}.access-days{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-bottom:24px;}.access-day{width:58px;height:58px;border-radius:50%;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:900;transition:.16s;}.access-day span{font-size:13px;}.access-day small{font-size:9px;margin-top:2px;font-weight:750;}.access-day:hover{transform:translateY(-1px);border-color:var(--brand);}.access-day.selected{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);box-shadow:0 8px 20px color-mix(in srgb,var(--brand) 24%,transparent);}.access-day.today:not(.selected){box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--brand) 24%,transparent);} .access-limit-main{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:4px auto 8px;max-width:980px;}.access-selected-label{font-size:22px;font-weight:900;margin-top:6px;}.access-today-usage{color:var(--muted);font-size:13px;font-weight:800;} .access-slider{--access-progress:100%;display:block;width:min(980px,100%);height:8px;margin:22px auto 8px;border:0;border-radius:999px;appearance:none;-webkit-appearance:none;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));outline:none;}.access-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;border-radius:50%;background:var(--brand);border:4px solid var(--line);box-shadow:0 2px 10px color-mix(in srgb,var(--text) 18%,transparent);cursor:pointer;}.access-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--brand);border:4px solid var(--line);box-shadow:0 2px 10px color-mix(in srgb,var(--text) 18%,transparent);cursor:pointer;}.access-slider-marks{display:grid;grid-template-columns:repeat(9,1fr);width:min(1000px,100%);margin:0 auto 20px;color:var(--muted);font-size:11px;font-weight:800;text-align:center;}.access-slider-marks span:first-child{text-align:left;}.access-slider-marks span:last-child{text-align:right;} .access-status-row{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:12px;margin-top:18px;border-top:1px solid var(--line);padding-top:18px;}.access-status-card,.access-bonus-card{border:1px solid var(--line);border-radius:13px;padding:14px 16px;background:color-mix(in srgb,var(--warn) 11%,var(--panel));}.access-status-card span,.access-bonus-card>span{display:block;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;}.access-status-card strong,.access-bonus-card>strong{display:block;margin-top:5px;font-size:17px;}.access-bonus-buttons{margin-top:9px;} .access-schedule-panel{margin-top:18px;}.access-schedule-head{gap:20px;}.schedule-actions{display:flex;gap:8px;flex-wrap:wrap;}.access-grid-wrap{overflow-x:auto;padding:8px 2px 4px;}.access-grid{display:grid;grid-template-columns:46px repeat(24,30px);grid-auto-rows:30px;gap:3px;min-width:838px;justify-content:center;align-items:center;}.access-grid-corner{width:46px;}.access-hour{font-size:10px;color:var(--muted);font-weight:800;text-align:center;align-self:end;padding-bottom:3px;}.access-row-label{height:30px;border:0;background:transparent;color:var(--muted);font-size:11px;font-weight:900;text-align:right;padding-right:8px;}.access-row-label.selected{color:var(--brand);}.access-cell{width:30px;height:30px;border:0;border-radius:5px;padding:0;transition:transform .1s,filter .1s,background .1s;}.access-cell.allowed{background:var(--ok-soft);}.access-cell.blocked{background:color-mix(in srgb,var(--danger) 11%,var(--panel));}.access-cell:hover{transform:scale(1.08);filter:brightness(1.08);z-index:2;}.access-legend{display:flex;gap:20px;justify-content:center;margin:16px 0 2px;color:var(--muted);font-size:11px;font-weight:750;}.access-legend span{display:flex;align-items:center;gap:7px;}.access-legend i{width:16px;height:16px;border-radius:4px;display:inline-block;}.access-legend i.allowed{background:var(--ok-soft);}.access-legend i.blocked{background:color-mix(in srgb,var(--danger) 11%,var(--panel));} @media(max-width:1200px){.cards{grid-template-columns:repeat(2,1fr);}.access-status-row{grid-template-columns:1fr 1fr;}.access-bonus-card{grid-column:1/-1;}} @media(max-width:760px){.cards{grid-template-columns:1fr;}.access-limit-panel{padding:18px;}.access-days{gap:8px;}.access-day{width:48px;height:48px;}.access-limit-main{align-items:flex-start;flex-direction:column;}.access-selected-label{font-size:18px;}.access-status-row{grid-template-columns:1fr;}.access-bonus-card{grid-column:auto;}.access-schedule-head{align-items:flex-start;flex-direction:column;}.schedule-actions{width:100%;}.schedule-actions button{flex:1;}.access-grid{justify-content:start;}.access-slider-marks{font-size:9px;}} /* ===== v0.3.3 APPLICATIONS: STATISTICS + LIST ===== */ .stats-legend-swatch{width:22px;height:8px;display:block;flex:0 0 auto;}.hour-stack-svg{display:block;width:100%;height:100%;}.usage-bar-svg{display:block;width:100%;height:8px;}.usage-bar-bg,.history-bar-bg{fill:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.usage-bar-fill,.history-bar-fill{fill:var(--brand);}.history-bar-svg{display:block;width:100%;height:100%;} .compact-head{margin-bottom:10px;}.apps-tabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin-bottom:18px;}.apps-tab{border:0;background:transparent;color:var(--muted);font-size:12px;font-weight:900;letter-spacing:.03em;padding:12px 2px 11px;position:relative;}.apps-tab.active{color:var(--brand);}.apps-tab.active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--brand);border-radius:2px;}.apps-pane{display:none;}.apps-pane.active{display:block;}.app-stats-toolbar{display:flex;justify-content:flex-end;align-items:center;margin:0 0 14px;}.stats-date-nav{display:flex;gap:8px;align-items:center;}.stats-date-nav input{min-width:160px;}.circle-btn{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-size:22px;display:grid;place-items:center;line-height:1;}.circle-btn:disabled{opacity:.35;}.app-stats-chart-panel{padding:20px 22px 16px;}.chart-title{text-align:center;color:var(--muted);font-size:12px;font-weight:800;margin-bottom:14px;}.stats-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 16px;min-height:22px;margin-bottom:12px;font-size:10px;color:var(--muted);}.stats-legend span{display:flex;align-items:center;gap:6px;max-width:160px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.stats-legend i{width:22px;height:8px;border-radius:1px;flex:0 0 auto;}.hourly-chart-shell{display:grid;grid-template-columns:36px 1fr;gap:8px;height:300px;}.chart-y-axis{display:flex;flex-direction:column;justify-content:space-between;text-align:right;color:var(--muted);font-size:10px;padding:0 0 28px;}.hourly-chart{display:grid;grid-template-columns:repeat(24,minmax(18px,1fr));gap:3px;align-items:stretch;height:100%;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(25% - 1px),var(--line) calc(25% - 1px),var(--line) 25%);padding-top:1px;}.hour-column{display:grid;grid-template-rows:1fr 24px;min-width:0;}.hour-stack{height:100%;display:flex;flex-direction:column-reverse;justify-content:flex-start;align-self:end;overflow:hidden;border-radius:2px 2px 0 0;}.hour-segment{display:block;width:100%;min-height:1px;}.hour-label{font-size:9px;color:var(--muted);transform:rotate(-35deg);transform-origin:center top;white-space:nowrap;padding-top:5px;text-align:center;}.app-stats-list-panel{margin-top:18px;padding:12px 20px;}.stats-total-row{font-size:14px;padding:8px 0 14px;border-bottom:1px solid var(--line);}.stats-app-row{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);}.stats-app-row:last-child{border-bottom:0;}.stats-app-icon,.stats-app-fallback{width:42px;height:42px;border-radius:8px;object-fit:contain;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));padding:3px;}.stats-app-fallback{display:grid;place-items:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--brand);font-weight:900;}.stats-app-copy{display:grid;gap:4px;min-width:0;}.stats-app-copy strong{font-size:14px;}.stats-app-copy span{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.stats-app-meta{display:grid;gap:3px;min-width:160px;font-size:11px;color:var(--muted);text-align:left;}.stats-app-meta strong{color:var(--text);} .app-table-panel{padding:18px 22px;}.app-list-settings{display:grid;gap:14px;padding-bottom:16px;border-bottom:1px solid var(--line);}.check-setting{display:flex;align-items:center;gap:9px;font-weight:750;font-size:13px;}.check-setting input{width:18px;height:18px;accent-color:var(--brand);}.app-filter-line{display:flex;align-items:center;gap:14px;font-size:13px;}.app-filter-line label{font-weight:750;}.app-filter-line input{width:240px;}.app-list-columns{display:grid;grid-template-columns:minmax(360px,1fr) 130px 170px 170px 100px;align-items:center;color:var(--muted);font-size:10px;font-weight:800;padding:13px 8px 9px;border-bottom:1px solid var(--line);}.compact-summary{margin:10px 0 4px;}.app-table-list{display:grid;}.app-table-row-wrap{border-bottom:1px solid var(--line);}.app-table-row{display:grid;grid-template-columns:minmax(360px,1fr) 130px 170px 170px 100px;align-items:center;gap:0;min-height:76px;padding:8px;}.app-table-row.protected{opacity:.62;}.app-row-identity{display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;align-items:center;min-width:0;}.app-row-icon,.app-row-fallback{width:38px;height:38px;object-fit:contain;border-radius:7px;padding:2px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.app-row-fallback{display:grid;place-items:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--brand);font-weight:900;}.app-row-identity>div{display:grid;gap:2px;min-width:0;}.app-row-identity strong{font-size:13px;}.app-row-identity span{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.app-row-identity small{font-size:9px;color:var(--muted);}.nestra-toggle{display:inline-flex;align-items:center;}.nestra-toggle input{position:absolute;opacity:0;pointer-events:none;}.nestra-toggle span{width:38px;height:20px;border-radius:999px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));position:relative;transition:.18s;display:block;}.nestra-toggle span::after{content:"";position:absolute;width:16px;height:16px;border-radius:50%;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));top:2px;left:2px;transition:.18s;box-shadow:0 1px 4px color-mix(in srgb,var(--text) 18%,transparent);}.nestra-toggle input:checked+span{background:var(--field);}.nestra-toggle input:checked+span::after{left:20px;}.nestra-toggle input:disabled+span{opacity:.4;}.details-toggle{font-size:11px;padding:7px 9px;}.app-row-details{display:none;grid-template-columns:1.25fr 1fr 1.4fr auto;gap:20px;align-items:end;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));padding:16px 60px 18px;}.app-table-row-wrap.details-open .app-row-details{display:grid;}.app-row-details>div>label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:900;margin-bottom:5px;}.app-row-details .time-pair,.app-row-details .limit-input,.app-row-details .bonus-buttons{margin-top:0;}.app-row-details .time-pair input{width:104px;}.app-row-details .limit-input input{width:85px;}.app-row-details .primary{white-space:nowrap;}.compact-summary span{padding:6px 10px;background:transparent;} @media(min-width:761px) and (max-width:1280px){.app-list-columns,.app-table-row{grid-template-columns:minmax(300px,1fr) 105px 145px 145px 90px;}.app-row-details{grid-template-columns:1fr 1fr; padding-left:20px;padding-right:20px;}.hourly-chart{gap:2px;}} @media(max-width:900px){.app-list-columns{display:none;}.app-table-row{grid-template-columns:minmax(240px,1fr) repeat(3,70px) 88px;}.stats-app-row{grid-template-columns:40px minmax(0,1fr);}.stats-app-meta{grid-column:2;text-align:left;min-width:0;}.hourly-chart-shell{overflow-x:auto;}.hourly-chart{min-width:760px;}.app-row-details{grid-template-columns:1fr;}} @media(max-width:680px){.app-table-row{grid-template-columns:1fr;gap:10px;}.nestra-toggle{justify-content:flex-start;}.details-toggle{justify-self:start;}.app-filter-line{align-items:flex-start;flex-direction:column;}.app-filter-line input{width:100%;}.apps-tabs{gap:14px;}.stats-date-nav{width:100%;justify-content:flex-end;}} /* ===== v0.3.3 FULL WINDOWS APP CONTROL ===== */ .full-control-note{display:flex;gap:10px;align-items:flex-start;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--muted);font-size:11px;line-height:1.45;}.full-control-note strong{color:var(--brand);white-space:nowrap;font-size:11px;}.full-control-note span{min-width:0;}.app-table-row:not(.protected) .details-toggle{opacity:1;}.app-table-row.protected .details-toggle{opacity:.45;} @media(max-width:760px){.full-control-note{flex-direction:column;gap:3px;}.full-control-note strong{white-space:normal;}} /* ===== v0.3.3 REMOTE CONTROL / PRZEJMIJ ===== */ .takeover-btn{border:1px solid var(--brand);background:linear-gradient(135deg,var(--brand),var(--brand2));color:var(--brand-ink);border-radius:10px;padding:10px 18px;font-weight:900;letter-spacing:.05em;box-shadow:0 8px 22px color-mix(in srgb,var(--brand) 24%,transparent);transition:.18s;}.takeover-btn:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 10px 28px color-mix(in srgb,var(--brand) 24%,transparent);}.takeover-btn:disabled,.takeover-btn.offline{opacity:.38;cursor:not-allowed;filter:grayscale(.35);} .remote-view{min-width:0;}.remote-head{align-items:flex-start;gap:22px;}.remote-head-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end;}.remote-status-badge{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:8px 12px;font-size:10px;font-weight:900;letter-spacing:.06em;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--muted);}.remote-status-badge::before{content:"";width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 0 0 4px color-mix(in srgb,var(--text) 18%,transparent);}.remote-status-badge.online{color:var(--ok);border-color:var(--ok-line);background:var(--ok-soft);}.remote-status-badge.online::before{background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 24%,transparent);}.remote-status-badge.waiting{color:var(--text);border-color:var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.remote-status-badge.waiting::before{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 0 0 4px color-mix(in srgb,var(--text) 18%,transparent);}.remote-status-badge.offline{color:var(--text);}.danger{border:1px solid var(--danger);background:color-mix(in srgb,var(--danger) 11%,var(--panel));color:var(--danger);border-radius:10px;padding:10px 14px;font-weight:850;}.danger:hover{background:color-mix(in srgb,var(--danger) 11%,var(--panel));}.remote-panel{padding:0;overflow:hidden;}.remote-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:13px 15px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.remote-toolbar-group{display:flex;gap:8px;flex-wrap:wrap;}.remote-toolbar .secondary{padding:8px 11px;font-size:11px;}.remote-text-tools{display:flex;align-items:center;gap:8px;min-width:330px;max-width:600px;flex:1;justify-content:flex-end;}.remote-text-tools input{min-width:220px;max-width:430px;width:100%;height:36px;}.remote-screen-wrap{position:relative;display:flex;align-items:center;justify-content:center;min-height:420px;height:min(calc(100vh - 255px),calc((100vw - 300px)*0.72));max-height:calc(100vh - 255px);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));overflow:hidden;outline:none;user-select:none;cursor:default;}.remote-screen-wrap:focus{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--brand) 24%,transparent);}.remote-screen-wrap img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;pointer-events:none;image-rendering:auto;}.remote-placeholder{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;color:var(--muted);text-align:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.remote-placeholder.hidden{display:none;}.remote-placeholder span{font-size:12px;color:var(--muted);}.remote-spinner{width:42px;height:42px;border:3px solid var(--line);border-top-color:var(--line);border-radius:50%;animation:remoteSpin .85s linear infinite;}@keyframes remoteSpin{to{transform:rotate(360deg);}}.remote-focus-hint{position:absolute;left:50%;bottom:15px;transform:translateX(-50%);padding:7px 11px;border-radius:999px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border:1px solid var(--line);color:var(--muted);font-size:10px;pointer-events:none;backdrop-filter:blur(6px);}.remote-screen-wrap:focus .remote-focus-hint{opacity:.28;}.remote-footer{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:18px;padding:10px 15px;border-top:1px solid var(--line);font-size:11px;}.remote-footer>div:first-child{display:flex;align-items:center;gap:8px;font-weight:800;}.remote-security-note{text-align:right;color:var(--muted);}.remote-screen-wrap:fullscreen{max-height:none;width:100vw;height:100vh;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.remote-screen-wrap:fullscreen img{width:100vw;height:100vh;max-height:100vh;max-width:100vw;object-fit:contain;}.remote-screen-wrap:fullscreen .remote-focus-hint{bottom:22px;} @media(max-width:1050px){.remote-toolbar{align-items:stretch;flex-direction:column;}.remote-text-tools{max-width:none;min-width:0;justify-content:stretch;}.remote-screen-wrap{min-height:420px;}.remote-footer{grid-template-columns:1fr 1fr;}.remote-security-note{grid-column:1/-1;text-align:left;}} @media(max-width:700px){.remote-head-actions{justify-content:flex-start;}.remote-toolbar-group{display:grid;grid-template-columns:1fr 1fr;}.remote-text-tools{flex-direction:column;align-items:stretch;}.remote-text-tools input{min-width:0;max-width:none;}.remote-screen-wrap{min-height:300px;}.remote-footer{grid-template-columns:1fr;}.remote-security-note{text-align:left;}.takeover-btn{padding:9px 12px;}.remote-toolbar .secondary{font-size:10px;}} /* ===== v0.4.1 WEB CONTROL ===== */ .browser-support{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end;}.browser-support span{font-size:9px;font-weight:900;letter-spacing:.08em;border:1px solid var(--line);border-radius:999px;padding:6px 9px;color:var(--muted);background:var(--panel);} .web-tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin-bottom:16px;}.web-tab{border:0;background:transparent;color:var(--muted);font-size:11px;font-weight:900;padding:11px 2px 12px;position:relative;}.web-tab.active{color:var(--brand);}.web-tab.active::after{content:"";position:absolute;height:2px;background:var(--brand);left:0;right:0;bottom:-1px;}.web-pane{display:none;}.web-pane.active{display:block;}.web-list-panel{padding:16px 22px;min-height:520px;}.web-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:14px;border-bottom:1px solid var(--line);}.web-toolbar label{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:750;}.web-toolbar input{width:170px;}.web-toolbar select{width:120px;}.web-event-list{display:grid;}.web-event-row{display:grid;grid-template-columns:34px minmax(0,1fr) 42px;gap:12px;align-items:center;min-height:66px;border-bottom:1px solid var(--line);padding:8px 5px;}.web-event-icon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);font-size:20px;}.web-event-main{display:grid;gap:2px;min-width:0;}.web-event-main strong{font-size:13px;}.web-event-main span{font-size:10px;color:var(--muted);}.web-event-main small{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.web-copy{border:0;background:transparent;color:var(--brand);font-size:22px;cursor:pointer;}.search-engine-icon{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-weight:900;font-size:15px;}.web-lists-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding:44px;min-height:500px;}.web-list-column h2{margin:0 0 18px;font-size:14px;}.web-add-row{display:grid;grid-template-columns:1fr auto;gap:8px;}.web-add-row input{min-width:0;}.web-add-row button{color:var(--brand);background:transparent;border:1px solid var(--line);font-weight:850;}.domain-list{margin-top:16px;display:grid;}.domain-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 8px;border-bottom:1px solid var(--line);font-size:12px;}.domain-remove{border:0;background:transparent;color:var(--brand);font-size:10px;font-weight:900;}.compact-empty{padding:14px 0;text-align:left;}.web-settings-panel{padding:44px;min-height:520px;max-width:none;}.web-settings-panel h2{font-size:14px;margin:0 0 22px;}.web-settings-panel .check-setting{margin:16px 0;font-weight:650;}.web-message-title{margin-top:34px!important;}.web-message-box{width:100%;min-height:110px;margin-top:10px;resize:vertical;}.web-settings-actions{display:flex;justify-content:flex-end;margin-top:18px;}.web-policy-note{margin-top:20px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;color:var(--muted);font-size:10px;line-height:1.5;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} @media(max-width:900px){.web-lists-grid{grid-template-columns:1fr;gap:35px;padding:24px;}.web-settings-panel{padding:24px;}.browser-support{justify-content:flex-start;}.web-toolbar{align-items:stretch;flex-direction:column;}.web-toolbar label{justify-content:space-between;}.web-toolbar input{width:65%;}.web-toolbar select{width:100%;}} /* ===== v0.4.2 STRICT DOMAIN GUARD ===== */ /* ===== v0.5 BRAND REFRESH + NETWORK GUARD ===== */ body{background:var(--bg);} .sidebar{width:238px;padding:24px 16px 20px;background:var(--sidebar);border-right:1px solid var(--line);box-shadow:14px 0 40px color-mix(in srgb,var(--text) 18%,transparent);} .sidebar-logo{width:176px;max-height:176px;filter:drop-shadow(0 8px 18px color-mix(in srgb,var(--text) 18%,transparent));border-radius:0;}.version{text-align:center;margin-top:4px;color:var(--muted);letter-spacing:.04em;} nav{margin-top:25px;gap:6px;}.nav{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:11px;padding:11px 12px;border-radius:11px;color:var(--brand2);font-weight:750;transition:.18s;border:1px solid transparent;}.nav:hover{background:color-mix(in srgb,var(--brand) 16%,var(--sidebar));border-color:var(--line);color:var(--brand2);}.nav.active{background:color-mix(in srgb,var(--brand) 16%,var(--sidebar));border-color:var(--brand);color:var(--brand2);box-shadow:inset 3px 0 0 color-mix(in srgb,var(--brand) 24%,transparent),0 8px 22px color-mix(in srgb,var(--brand) 24%,transparent);}.nav.active::after{content:"";position:absolute;right:10px;width:5px;height:5px;border-radius:50%;background:var(--brand);box-shadow:0 0 12px color-mix(in srgb,var(--brand) 24%,transparent);}.nav-icon{width:22px;height:22px;display:grid;place-items:center;color:var(--brand2);}.nav.active .nav-icon{color:var(--brand2);}.nav-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}.nav-icon svg rect{fill:none;}.nav-new{font-style:normal;font-size:7px;letter-spacing:.08em;border:1px solid var(--line);color:var(--brand2);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border-radius:999px;padding:2px 5px;}.sidebar-bottom{padding:10px 9px;border-top:1px solid var(--line);} main{margin-left:238px;}.topbar{height:86px;padding:15px 30px;background:var(--panel);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);box-shadow:0 6px 20px color-mix(in srgb,var(--text) 18%,transparent);}.device-brand-row{display:flex;align-items:center;gap:12px;}.topbar-mark{width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 4px 9px color-mix(in srgb,var(--text) 18%,transparent));}.topbar select{background:transparent!important;color:var(--text);min-width:270px;}.topbar-actions{display:flex;align-items:center;gap:9px;}.view{padding:30px 34px 42px;}.card,.panel{box-shadow:0 10px 30px color-mix(in srgb,var(--text) 18%,transparent);}.primary{background:linear-gradient(135deg,var(--brand),var(--brand2));border-color:var(--brand);box-shadow:0 8px 20px color-mix(in srgb,var(--brand) 24%,transparent);transition:.18s;}.primary:hover:not(:disabled){filter:brightness(1.04);transform:translateY(-1px);box-shadow:0 10px 26px color-mix(in srgb,var(--brand) 24%,transparent);}.secondary{transition:.18s;}.secondary:hover:not(:disabled){border-color:var(--line);color:var(--brand);background:var(--field);}.hero{background:linear-gradient(135deg,var(--brand),var(--brand2));box-shadow:0 16px 40px color-mix(in srgb,var(--brand) 24%,transparent);} .theme-toggle{border-color:var(--line)!important;}.takeover-btn{background:linear-gradient(135deg,var(--brand),var(--brand2))!important;} .network-view{min-width:0;}.network-head{align-items:center;}.network-title-row{display:flex;align-items:center;gap:14px;}.network-title-mark{width:66px;height:66px;object-fit:contain;filter:drop-shadow(0 7px 18px color-mix(in srgb,var(--text) 18%,transparent));}.network-head h1{margin-top:3px;}.network-guard-badge{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:9px 13px;font-size:10px;font-weight:900;letter-spacing:.09em;border:1px solid var(--line);}.network-guard-badge::before{content:"";width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.network-guard-badge.on{color:var(--ok);border-color:var(--ok-line);background:var(--ok-soft);}.network-guard-badge.on::before{background:var(--ok);box-shadow:0 0 0 5px color-mix(in srgb,var(--ok) 24%,transparent);}.network-guard-badge.off{color:var(--muted);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} .network-top-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(340px,.8fr);gap:16px;}.network-master-card{min-height:225px;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:24px;border-color:var(--line);background:var(--panel);}.network-master-copy{display:flex;align-items:center;gap:20px;min-width:0;}.network-shield-wrap{width:116px;height:116px;flex:0 0 auto;border-radius:28px;display:grid;place-items:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border:1px solid var(--line);}.network-shield-wrap img{width:94px;height:94px;object-fit:contain;filter:drop-shadow(0 10px 18px color-mix(in srgb,var(--text) 18%,transparent));}.network-master-card h2{font-size:26px;margin:5px 0 8px;}.network-master-card p{max-width:720px;margin:0;color:var(--muted);font-size:12px;line-height:1.6;}.master-switch{display:grid;justify-items:center;gap:8px;min-width:118px;cursor:pointer;}.master-switch input{position:absolute;opacity:0;}.master-switch-track{width:76px;height:38px;border-radius:999px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));position:relative;box-shadow:inset 0 2px 5px color-mix(in srgb,var(--text) 18%,transparent);transition:.2s;}.master-switch-track::after{content:"";width:30px;height:30px;border-radius:50%;position:absolute;left:4px;top:4px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 3px 10px color-mix(in srgb,var(--text) 18%,transparent);transition:.2s;}.master-switch input:checked+.master-switch-track{background:var(--field);box-shadow:0 0 24px color-mix(in srgb,var(--text) 18%,transparent);}.master-switch input:checked+.master-switch-track::after{left:42px;}.master-switch strong{font-size:11px;color:var(--muted);}.master-switch input:checked~strong{color:var(--brand);} .network-settings-card{padding:19px 20px;}.panel-title-icon{display:flex;align-items:center;gap:9px;margin-bottom:8px;}.panel-title-icon>span{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:var(--text);background:var(--panel);border:1px solid var(--line);}.panel-title-icon h2{font-size:16px;margin:0;}.network-setting-row{min-height:61px;padding:10px 2px;border-top:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;}.network-setting-row>div{display:grid;gap:3px;}.network-setting-row strong{font-size:12px;}.network-setting-row small{color:var(--muted);font-size:9.5px;line-height:1.4;}.network-setting-row.readonly{opacity:.86;}.network-lock{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-weight:900;} .network-main-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(360px,.9fr);gap:16px;margin-top:16px;}.service-card{padding:21px;}.service-card-head{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:13px;align-items:center;}.youtube-mark{width:52px;height:40px;border-radius:12px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);display:grid;place-items:center;font-size:20px;box-shadow:0 8px 20px color-mix(in srgb,var(--text) 18%,transparent);}.service-card-head h2{margin:2px 0 0;font-size:20px;}.service-status{font-size:9px;font-weight:900;letter-spacing:.07em;border-radius:999px;padding:7px 9px;border:1px solid;}.service-status.allowed{color:var(--ok);border-color:var(--ok-line);background:var(--ok-soft);}.service-status.blocked{color:var(--danger);border-color:var(--danger);background:color-mix(in srgb,var(--danger) 11%,var(--panel));}.service-description{font-size:11.5px;color:var(--muted);line-height:1.55;margin:16px 0;}.service-domain-chips{display:flex;flex-wrap:wrap;gap:7px;}.service-domain-chips span,.network-rule-chips>span:not(.muted){font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:9.5px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--brand);border-radius:999px;padding:6px 8px;}.service-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px;}.service-actions button{font-size:10px;padding:9px 11px;}.coverage-card{padding:20px;}.coverage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;}.coverage-item{min-height:92px;border:1px solid var(--line);border-radius:12px;padding:11px 8px;display:grid;justify-items:center;align-content:center;text-align:center;gap:3px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.coverage-item b{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-size:9px;box-shadow:0 5px 14px color-mix(in srgb,var(--text) 18%,transparent);}.coverage-item span{font-weight:850;font-size:10.5px;}.coverage-item small{color:var(--muted);font-size:8px;}.coverage-item.game{grid-column:span 1;} .network-rules-panel{margin-top:16px;padding:20px;}.network-rules-head{display:flex;justify-content:space-between;gap:20px;align-items:center;}.network-rules-head h2{font-size:17px;margin:5px 0 0;}.network-count{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-weight:900;color:var(--text);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 7px 18px color-mix(in srgb,var(--text) 18%,transparent);}.network-rule-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:16px;min-height:32px;}.network-info-strip{display:grid;grid-template-columns:30px 1fr;gap:11px;align-items:start;margin-top:18px;padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.network-info-icon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-weight:900;}.network-info-strip>div{display:grid;gap:3px;}.network-info-strip strong{font-size:11px;}.network-info-strip span{font-size:10px;color:var(--muted);line-height:1.5;}.network-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:16px;}.network-admin-note{font-size:10px;color:var(--muted);line-height:1.5;}.network-save{min-width:190px;}.network-save::before{content:"◈ ";opacity:.8;} .login-overlay{background:color-mix(in srgb,var(--sidebar) 78%,transparent);}.login-card{border:1px solid var(--line);box-shadow:0 28px 90px color-mix(in srgb,var(--text) 18%,transparent),0 0 0 1px color-mix(in srgb,var(--text) 18%,transparent);}.login-logo{width:245px;height:210px;border-radius:0;filter:drop-shadow(0 10px 22px color-mix(in srgb,var(--text) 18%,transparent));} @media(max-width:1150px){.network-top-grid,.network-main-grid{grid-template-columns:1fr;}.network-master-card{align-items:flex-start;}.coverage-grid{grid-template-columns:repeat(6,1fr);}} @media(max-width:900px){.coverage-grid{grid-template-columns:repeat(3,1fr);}.network-master-card{flex-direction:column;}.master-switch{display:flex;align-items:center;justify-items:initial;}.network-title-row{align-items:flex-start;}.network-title-mark{width:52px;height:52px;}.network-actions{align-items:stretch;flex-direction:column;}.network-save{width:100%;}} @media(max-width:760px){.sidebar{width:80px;padding:20px 8px;}.sidebar-logo{width:62px;height:62px;object-fit:contain;}.sidebar .version,.nav>span:not(.nav-icon),.nav-new{display:none;}.nav{grid-template-columns:1fr;padding:10px;justify-items:center;}.nav-icon{width:24px;height:24px;}.nav.active::after{right:5px;}main{margin-left:80px;}.topbar-mark{display:none;}.device-brand-row{gap:0;}.network-master-copy{align-items:flex-start;}.network-shield-wrap{width:80px;height:80px;border-radius:20px;}.network-shield-wrap img{width:66px;height:66px;}.coverage-grid{grid-template-columns:repeat(2,1fr);}.service-card-head{grid-template-columns:52px 1fr;}.service-status{grid-column:1/-1;justify-self:start;}.network-head{align-items:flex-start;}.network-guard-badge{align-self:flex-start;}} /* ===== v0.5 VISUAL REFRESH / ICON-RICH UI ===== */ .sidebar-logo{filter:drop-shadow(0 10px 26px color-mix(in srgb,var(--text) 18%,transparent));transition:transform .25s ease,filter .25s ease;}.sidebar-logo:hover{transform:translateY(-2px) scale(1.015);filter:drop-shadow(0 12px 32px color-mix(in srgb,var(--text) 18%,transparent));} .nav{overflow:hidden;}.nav::before{content:"";position:absolute;inset:0;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));opacity:0;transition:.18s;}.nav:hover::before,.nav.active::before{opacity:1;}.nav.active{box-shadow:inset 3px 0 0 color-mix(in srgb,var(--brand) 24%,transparent),0 0 0 1px color-mix(in srgb,var(--brand) 24%,transparent),0 7px 24px color-mix(in srgb,var(--brand) 24%,transparent);}.nav.active .nav-icon{filter:drop-shadow(0 0 8px color-mix(in srgb,var(--brand) 24%,transparent));} .topbar-mark{width:44px;height:44px;filter:drop-shadow(0 0 12px color-mix(in srgb,var(--text) 18%,transparent));}.takeover-btn,.primary{background:linear-gradient(135deg,var(--brand),var(--brand2))!important;}.takeover-btn:hover:not(:disabled),.primary:hover:not(:disabled){box-shadow:0 0 0 1px color-mix(in srgb,var(--brand) 24%,transparent),0 12px 30px color-mix(in srgb,var(--brand) 24%,transparent);} .hero{position:relative;overflow:hidden;border:1px solid var(--brand);background:linear-gradient(135deg,var(--brand),var(--brand2));box-shadow:0 18px 45px color-mix(in srgb,var(--brand) 24%,transparent);}.hero::before{content:"";position:absolute;inset:-45% 34% -65% -5%;background:linear-gradient(135deg,var(--brand),var(--brand2));transform:rotate(-9deg);}.hero::after{content:"";position:absolute;width:310px;height:310px;border:1px solid var(--brand);border-radius:50%;right:-75px;top:-96px;box-shadow:0 0 0 42px color-mix(in srgb,var(--brand) 24%,transparent),0 0 0 88px color-mix(in srgb,var(--brand) 24%,transparent);}.hero>*{position:relative;z-index:1;} .cards{grid-template-columns:repeat(4,minmax(0,1fr));}.card{position:relative;overflow:hidden;min-height:122px;}.card::after{content:"";position:absolute;width:78px;height:78px;border-radius:50%;right:-28px;top:-28px;background:var(--panel);}.card .metric{color:var(--text);}.label{color:var(--muted);}.metric{letter-spacing:-.02em;} .usage-row.vivid{grid-template-columns:minmax(225px,1fr) minmax(130px,.8fr) 72px;gap:14px;min-height:62px;padding:9px 0;}.usage-app{display:grid;grid-template-columns:40px minmax(0,1fr);gap:11px;align-items:center;}.usage-app-icon,.mini-app-icon{width:36px;height:36px;object-fit:contain;border-radius:9px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));padding:2px;box-shadow:0 4px 12px color-mix(in srgb,var(--text) 18%,transparent);}.usage-app-icon.icon-fallback,.mini-app-icon.icon-fallback{display:grid;place-items:center;background:var(--brand-soft);color:var(--text);font-weight:900;}.usage-bar{height:8px;border-radius:999px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));overflow:hidden;}.usage-bar>span{display:block;height:100%;border-radius:999px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 0 16px color-mix(in srgb,var(--text) 18%,transparent);}.usage-time{font-weight:750;text-align:right;color:var(--text);} .history-bars{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;align-items:end;min-height:230px;padding:10px 0 0;}.history-bar-item{display:grid;grid-template-rows:145px auto auto;justify-items:center;gap:7px;min-width:0;}.history-bar-track{width:46px;height:145px;display:flex;align-items:flex-end;border-radius:10px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));overflow:hidden;border:1px solid var(--line);}.history-bar-track>span{display:block;width:100%;min-height:3px;border-radius:8px 8px 2px 2px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 0 18px color-mix(in srgb,var(--text) 18%,transparent);}.history-bar-item strong{font-size:10px;color:var(--text);}.history-bar-item small{font-size:9px;color:var(--muted);text-align:center;white-space:nowrap;} .app-table-panel{border-color:var(--line)!important;}.app-table-row{transition:.16s;background:linear-gradient(90deg,transparent,transparent);}.app-table-row:hover{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.app-row-icon,.app-row-fallback{width:42px;height:42px;border-radius:10px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 4px 14px color-mix(in srgb,var(--text) 18%,transparent);padding:2px;}.app-row-fallback{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);}.app-row-identity{grid-template-columns:46px minmax(0,1fr);}.app-row-identity strong{font-size:13.5px;}.nestra-toggle input:checked+span{background:var(--field);box-shadow:0 0 13px color-mix(in srgb,var(--text) 18%,transparent);}.apps-summary span{border-color:var(--line)!important;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important;}.apps-summary span:first-child{color:var(--text);border-color:var(--line)!important;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important;} .web-list-panel{border-color:var(--line);}.web-event-row.vivid-web{min-height:74px;padding:8px 10px;border:1px solid transparent;border-bottom-color:var(--line);border-radius:11px;transition:.16s;}.web-event-row.vivid-web:hover{border-color:var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));transform:translateX(2px);}.web-event-icon{border:0;background:transparent;}.site-mark{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--text);font-size:13px;font-weight:900;box-shadow:0 5px 13px color-mix(in srgb,var(--text) 18%,transparent);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.site-mark.youtube{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));font-size:15px;}.site-mark.google{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-size:17px;}.site-mark.openai{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);}.site-mark.github{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-size:9px;}.site-mark.wikipedia{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-family:Georgia,serif;font-size:19px;}.site-mark.microsoft{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));font-size:17px;}.site-mark.tennis{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);}.web-event-main>span{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}.web-date{color:var(--text);}.browser-inline{display:inline-flex;align-items:center;gap:6px;color:var(--text);}.browser-inline-icon{width:20px;height:20px;object-fit:contain;border-radius:5px;}.browser-inline-icon.icon-fallback{display:grid;place-items:center;background:var(--brand-soft);color:var(--text);font-size:9px;font-weight:900;}.search-source{color:var(--text);border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border-radius:999px;padding:2px 7px;}.search-engine-icon{box-shadow:0 5px 14px color-mix(in srgb,var(--text) 18%,transparent);}.browser-support span{border-color:var(--line)!important;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important;color:var(--text)!important;}.web-tab.active{color:var(--brand-ink);text-shadow:0 0 12px color-mix(in srgb,var(--brand) 24%,transparent);}.web-tab.active::after{height:3px;background:var(--brand);box-shadow:0 0 10px color-mix(in srgb,var(--brand) 24%,transparent);} .notification-preview{border-color:var(--line)!important;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important;box-shadow:0 18px 48px color-mix(in srgb,var(--text) 18%,transparent),0 0 0 1px color-mix(in srgb,var(--text) 18%,transparent)!important;}.preview-header{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important;}.preview-body-card{background:var(--panel)!important;border-color:var(--line)!important;}.preview-body{color:var(--text)!important;}.notification-copy h2{color:var(--text);}.preview-ok{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important;box-shadow:0 9px 23px color-mix(in srgb,var(--text) 18%,transparent)!important;} .empty{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important;border-color:var(--line)!important;}.gallery .shot{border-color:var(--line)!important;box-shadow:0 9px 26px color-mix(in srgb,var(--text) 18%,transparent);}.gallery .shot:hover{transform:translateY(-2px);border-color:var(--line)!important;}.shot{transition:.18s;} @media(max-width:1150px){.cards{grid-template-columns:repeat(2,1fr);}.history-bars{min-height:190px;}.history-bar-track{height:115px;}.history-bar-item{grid-template-rows:115px auto auto;}.usage-row.vivid{grid-template-columns:minmax(210px,1fr) minmax(90px,.55fr) 65px;}} @media(max-width:760px){.cards{grid-template-columns:1fr;}.usage-row.vivid{grid-template-columns:1fr auto;}.usage-bar{display:none;}.history-bars{overflow-x:auto;grid-template-columns:repeat(7,72px);}.web-event-main>span{gap:6px;}} .active-card-content{display:grid;grid-template-columns:54px minmax(0,1fr);gap:14px;align-items:center;margin-top:8px;}.active-card-icon{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:var(--panel);border:1px solid var(--brand);box-shadow:0 7px 20px color-mix(in srgb,var(--brand) 24%,transparent);}.active-app-icon-img{width:44px;height:44px;object-fit:contain;border-radius:10px;}.active-app-icon-img.icon-fallback{display:grid;place-items:center;background:var(--brand-soft);color:var(--brand-ink);font-weight:900;}.active-card-copy{min-width:0;}.active-card-copy .metric{margin:0 0 4px;} /* NESTRA v0.5 – Profiles & Multi-Device */ .topbar-selectors{display:flex;align-items:flex-end;gap:18px;}.topbar-profile-select,.topbar-device-select{min-width:0;}.topbar-profile-select select{min-width:175px!important;}.topbar-device-select select{min-width:250px!important;}.topbar-selectors .eyebrow{margin:0 0 3px 3px;}.devices-view{min-width:0;}.device-management-head{align-items:center;}.profile-strip{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 14px;margin-bottom:8px;scrollbar-width:thin;}.profile-chip{min-width:150px;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:15px;padding:12px 15px;text-align:left;display:flex;flex-direction:column;gap:4px;box-shadow:0 7px 22px color-mix(in srgb,var(--text) 18%,transparent);transition:.18s;}.profile-chip span{font-weight:850;font-size:14px;}.profile-chip small{color:var(--muted);font-size:10px;}.profile-chip:hover{border-color:var(--line);transform:translateY(-1px);}.profile-chip.active{border-color:var(--brand);background:var(--panel);box-shadow:0 0 0 1px color-mix(in srgb,var(--brand) 24%,transparent),0 10px 25px color-mix(in srgb,var(--brand) 24%,transparent);}.devices-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(330px,.55fr);gap:18px;align-items:start;}.devices-side-stack{display:grid;gap:18px;}.fleet-head h2,.pairing-panel h2,.server-panel h2,.profile-sync-panel h2{margin:4px 0 10px;}.device-fleet{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}.fleet-device-card{position:relative;border:1px solid var(--line);border-radius:16px;padding:17px;background:var(--panel);overflow:hidden;transition:.18s;}.fleet-device-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--panel);}.fleet-device-card.online::before{background:var(--ok);box-shadow:0 0 14px color-mix(in srgb,var(--ok) 24%,transparent);}.fleet-device-card:hover{border-color:var(--line);box-shadow:0 10px 28px color-mix(in srgb,var(--text) 18%,transparent);transform:translateY(-1px);}.fleet-status-line{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}.fleet-device-icon{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;background:var(--panel);color:var(--text);font-size:15px;}.fleet-online-dot{width:7px;height:7px;border-radius:50%;background:var(--danger);box-shadow:0 0 0 4px color-mix(in srgb,var(--danger) 18%,transparent);}.fleet-device-card.offline .fleet-status-line strong{color:var(--danger);}.fleet-device-card.online .fleet-online-dot{background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 24%,transparent);}.fleet-device-card.online .fleet-status-line strong{color:var(--ok);}.fleet-profile-badge{margin-left:auto;border:1px solid var(--line);border-radius:999px;padding:4px 7px;color:var(--muted);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.fleet-device-card h3{font-size:19px;margin:13px 0 2px;}.fleet-machine{font-size:11px;color:var(--muted);}.fleet-metrics{display:grid;grid-template-columns:.75fr 1.35fr 1fr;gap:8px;margin:16px 0;}.fleet-metrics>div{min-width:0;border:1px solid var(--line);border-radius:10px;padding:9px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.fleet-metrics span{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.05em;}.fleet-metrics strong{display:block;margin-top:4px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.fleet-actions{display:flex;gap:8px;}.fleet-actions button{flex:1;}.fleet-edit{display:grid;grid-template-columns:1.15fr 1fr auto;gap:7px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);}.fleet-edit input,.fleet-edit select{width:100%;min-width:0;padding:8px 9px;font-size:11px;}.fleet-edit button{padding:8px 10px;font-size:11px;}.pairing-panel,.server-panel{background:var(--panel);}.pairing-panel p{line-height:1.5;}.wide-button{width:100%;margin-top:12px;}.pair-code-box{margin-top:14px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border-radius:14px;padding:16px;text-align:center;}.pair-code-box.hidden{display:none;}.pair-code-label{font-size:9px;color:var(--muted);letter-spacing:.12em;font-weight:850;}.pair-code-box strong{display:block;font-size:23px;letter-spacing:.08em;margin:7px 0;}.pair-code-box .secondary{margin-top:10px;}.server-address-list{display:grid;gap:8px;}.server-address{display:flex;align-items:center;gap:8px;border:1px solid var(--line);padding:8px;border-radius:10px;}.server-address code{font-size:12px;color:var(--brand2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;}.server-address button{padding:7px 9px;font-size:10px;}.server-note{margin-top:12px;padding:10px;border-radius:10px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border:1px solid var(--line);color:var(--muted);font-size:11px;line-height:1.45;}.profile-sync-panel{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--panel);}.profile-sync-panel p{max-width:850px;line-height:1.5;}.profile-sync-panel button{flex:0 0 auto;}.fleet-empty{grid-column:1/-1;}.device-management-head .primary{min-width:150px;} @media(max-width:1150px){.devices-layout{grid-template-columns:1fr;}.devices-side-stack{grid-template-columns:1fr 1fr;}.device-fleet{grid-template-columns:1fr 1fr;}.topbar-selectors{gap:8px;}.topbar-profile-select select{min-width:135px!important;}.topbar-device-select select{min-width:180px!important;}} @media(max-width:820px){.device-fleet,.devices-side-stack{grid-template-columns:1fr;}.fleet-metrics{grid-template-columns:1fr;}.fleet-edit{grid-template-columns:1fr;}.profile-sync-panel{align-items:flex-start;flex-direction:column;}.topbar-profile-select{display:none;}.topbar-device-select select{min-width:150px!important;}} .profile-head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}.danger-outline{color:var(--danger)!important;border-color:var(--danger)!important;}.danger-outline:hover:not(:disabled){background:color-mix(in srgb,var(--danger) 11%,var(--panel))!important;border-color:var(--danger)!important;} .time-request-banner{margin:14px 0;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--text);}.time-request-banner span{display:flex;gap:8px;}.time-request-banner .primary,.time-request-banner .secondary{padding:8px 12px;} /* v0.5.3 Network Guard editor / richer request banners */ .editable-coverage .coverage-item{position:relative;cursor:pointer;padding-bottom:28px;}.editable-coverage .coverage-item input{position:absolute;right:10px;bottom:8px;width:17px;height:17px;accent-color:var(--brand);}.coverage-icon-slot{display:grid!important;place-items:center;width:34px;height:34px;}.coverage-icon-slot .browser-inline-icon{width:31px;height:31px;border-radius:8px;object-fit:contain;}.coverage-icon-slot .browser-inline-icon.icon-fallback{background:var(--brand-soft);}.coverage-system-icon{width:31px;height:31px;border-radius:9px;display:grid!important;place-items:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-size:14px;font-weight:900;}.coverage-help{margin:10px 2px 0;color:var(--muted);font-size:9.5px;line-height:1.45;}.network-domain-editor{display:flex;gap:9px;align-items:center;margin-top:16px;}.network-domain-editor input{flex:1;min-width:220px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--panel);color:var(--text);}.network-custom-domains{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;min-height:34px;}.network-derived-title{margin-top:18px;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;}.network-domain-chip{display:inline-flex!important;align-items:center;gap:7px!important;font-family:ui-monospace,SFMono-Regular,Consolas,monospace!important;font-size:9.5px!important;border:1px solid var(--line)!important;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important;color:var(--brand)!important;border-radius:999px!important;padding:5px 8px!important;}.network-domain-chip .site-mark{width:22px;height:22px;font-family:Inter,Segoe UI,sans-serif;font-size:8px;box-shadow:none;}.network-domain-chip .site-mark.youtube{font-size:9px;}.network-domain-chip.custom{padding-right:4px!important;}.remove-network-domain{width:22px;height:22px;border:0;border-radius:50%;background:color-mix(in srgb,var(--danger) 11%,var(--panel));color:var(--danger);font-size:15px;line-height:20px;cursor:pointer;}.remove-network-domain:hover{background:color-mix(in srgb,var(--danger) 11%,var(--panel));}.time-request-banner .time-request-copy{display:grid;gap:4px;}.time-request-copy small{font-weight:500;color:var(--muted);max-width:520px;}.time-request-banner>span{display:flex;gap:8px;flex:0 0 auto;} @media(max-width:760px){.network-domain-editor{align-items:stretch;flex-direction:column;}.network-domain-editor button{width:100%;}.time-request-banner{align-items:stretch;flex-direction:column;}.time-request-banner>span{justify-content:flex-end;}} /* ===== NESTRA GOLD SKIN ===== Third visual theme. Cycle: Jasny -> Ciemny -> GOLD -> Jasny. Functional rules and API behavior are unchanged. */ /* GOLD — Network Guard */ /* GOLD — Web, apps, devices, remote */ /* keep semantic states readable in GOLD */ /* GOLD — remaining editor/preview surfaces */ /* v0.5.3 GOLD ICONS: real service favicons with graceful fallback */ .site-mark.site-favicon{overflow:hidden;padding:4px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border:1px solid var(--line);box-sizing:border-box;} .site-mark.site-favicon img{display:block;width:100%;height:100%;object-fit:contain;border-radius:22%;background:transparent;} .site-mark.site-favicon .site-fallback{width:100%;height:100%;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);font-size:11px;font-weight:900;} .site-mark.site-favicon .site-fallback:not([hidden]){display:grid;} .network-domain-chip .site-mark.site-favicon{padding:2px;border-width:1px;} /* NESTRA v0.5.3 GOLD — Network Guard coverage cards visual polish */ .coverage-grid.editable-coverage{ gap:12px; } .editable-coverage .coverage-item{ min-height:118px; padding:16px 12px 30px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0; position:relative; overflow:hidden; } .coverage-icon-slot{ width:44px!important; height:44px!important; margin:0 0 9px!important; display:grid!important; place-items:center; flex:0 0 44px; } .coverage-icon-slot .browser-inline-icon{ width:36px!important; height:36px!important; max-width:36px!important; max-height:36px!important; border-radius:9px!important; object-fit:contain!important; display:block; } .coverage-icon-slot .browser-local-icon{ width:38px!important; height:38px!important; max-width:38px!important; max-height:38px!important; } .coverage-icon-slot .browser-inline-icon.icon-fallback{ display:grid; place-items:center; font-size:11px!important; } .coverage-system-icon{ width:40px!important; height:40px!important; margin:2px 0 11px!important; flex:0 0 40px; border-radius:11px!important; font-size:15px!important; } .coverage-item > span:nth-of-type(2){ display:block; width:100%; margin:0; font-size:12px!important; line-height:1.2!important; font-weight:800!important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .coverage-item > small{ display:block; margin-top:4px; min-height:11px; font-size:8.5px!important; line-height:1.25!important; } .editable-coverage .coverage-item input{ top:10px!important; right:10px!important; bottom:auto!important; width:16px!important; height:16px!important; margin:0; } .editable-coverage .coverage-item:hover .coverage-icon-slot .browser-inline-icon, .editable-coverage .coverage-item:hover .coverage-system-icon{ transform:translateY(-1px) scale(1.035); } .coverage-icon-slot .browser-inline-icon, .coverage-system-icon{ transition:transform .16s ease; } @media(max-width:760px){ .editable-coverage .coverage-item{min-height:112px;padding:14px 10px 28px;} .coverage-grid.editable-coverage{gap:9px;} } /* NESTRA v0.5.3 — Coverage Premium Layout FIX2 Fixes the visible fallback-letter badge under browser logos and replaces the cramped vertical cards with a clean compact two-column card layout. */ .coverage-grid.editable-coverage{ gap:12px!important; } .editable-coverage .coverage-item{ min-height:94px!important; padding:14px 40px 14px 14px!important; display:grid!important; grid-template-columns:48px minmax(0,1fr)!important; grid-template-rows:auto auto!important; column-gap:13px!important; row-gap:3px!important; align-items:center!important; align-content:center!important; justify-items:stretch!important; text-align:left!important; position:relative!important; overflow:hidden!important; background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important; transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease!important; } .editable-coverage .coverage-item:hover{ transform:translateY(-1px); border-color:var(--line)!important; background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important; } .editable-coverage .coverage-item:has(input:checked){ border-color:var(--line)!important; box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text) 18%,transparent),0 7px 20px color-mix(in srgb,var(--text) 18%,transparent); } .coverage-icon-slot, .coverage-system-icon{ grid-column:1!important; grid-row:1 / 3!important; width:46px!important; height:46px!important; min-width:46px!important; min-height:46px!important; margin:0!important; padding:0!important; display:grid!important; place-items:center!important; align-self:center!important; justify-self:center!important; border-radius:12px!important; background:transparent!important; box-shadow:none!important; color:var(--text)!important; font-size:0!important; } .coverage-icon-slot .browser-inline-icon{ width:40px!important; height:40px!important; max-width:40px!important; max-height:40px!important; margin:0!important; padding:0!important; display:block!important; object-fit:contain!important; border-radius:9px!important; background:transparent!important; box-shadow:none!important; } /* Critical: the old rule forced the hidden fallback badge to display. Keep it truly hidden while the real browser logo is available. */ .coverage-icon-slot .browser-inline-icon.icon-fallback[hidden]{ display:none!important; } .coverage-icon-slot .browser-inline-icon.icon-fallback:not([hidden]){ display:grid!important; place-items:center!important; width:38px!important; height:38px!important; border-radius:11px!important; background:var(--brand-soft)!important; color:var(--text)!important; font-size:12px!important; font-weight:900!important; } .coverage-system-icon svg{ width:27px!important; height:27px!important; display:block!important; } .coverage-system-icon{ background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))!important; color:var(--text)!important; box-shadow:0 7px 16px color-mix(in srgb,var(--text) 18%,transparent)!important; } .editable-coverage .coverage-item > span:nth-of-type(2){ grid-column:2!important; grid-row:1!important; align-self:end!important; width:100%!important; margin:0!important; padding:0!important; font-size:12.5px!important; line-height:1.2!important; font-weight:850!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; color:var(--text)!important; } .editable-coverage .coverage-item > small{ grid-column:2!important; grid-row:2!important; align-self:start!important; display:block!important; width:100%!important; margin:0!important; min-height:0!important; font-size:8.7px!important; line-height:1.3!important; color:var(--muted)!important; white-space:normal!important; } .editable-coverage .coverage-item input{ position:absolute!important; top:12px!important; right:12px!important; bottom:auto!important; left:auto!important; width:16px!important; height:16px!important; margin:0!important; accent-color:var(--brand)!important; cursor:pointer; } .editable-coverage .coverage-item:not(:has(input:checked)) .coverage-icon-slot, .editable-coverage .coverage-item:not(:has(input:checked)) .coverage-system-icon{ opacity:.62; filter:saturate(.72); } @media(max-width:760px){ .editable-coverage .coverage-item{ min-height:88px!important; padding:12px 36px 12px 12px!important; grid-template-columns:42px minmax(0,1fr)!important; column-gap:10px!important; } .coverage-icon-slot,.coverage-system-icon{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;} .coverage-icon-slot .browser-inline-icon{width:35px!important;height:35px!important;max-width:35px!important;max-height:35px!important;} } /* ===== v0.6 Parent account onboarding ===== */ .auth-shell{padding:24px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} .auth-stage{width:min(1080px,calc(100vw - 48px));min-height:650px;display:grid;grid-template-columns:1.05fr .95fr;border:1px solid var(--line);border-radius:26px;overflow:hidden;box-shadow:0 30px 90px color-mix(in srgb,var(--text) 18%,transparent);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));backdrop-filter:blur(22px);} .auth-hero{padding:58px 54px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;background:linear-gradient(135deg,var(--brand),var(--brand2));} .auth-hero::after{content:"";position:absolute;width:420px;height:420px;right:-155px;bottom:-180px;border:1px solid var(--brand);border-radius:50%;box-shadow:0 0 0 48px color-mix(in srgb,var(--brand) 24%,transparent),0 0 0 96px color-mix(in srgb,var(--brand) 24%,transparent);} .auth-hero-logo{width:188px;max-height:86px;object-fit:contain;object-position:left center;margin-bottom:38px;filter:drop-shadow(0 10px 24px color-mix(in srgb,var(--brand) 24%,transparent));} .auth-shield{width:82px;height:82px;border:1px solid var(--line);border-radius:24px;display:grid;place-items:center;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:inset 0 1px color-mix(in srgb,var(--text) 18%,transparent),0 18px 45px color-mix(in srgb,var(--text) 18%,transparent);margin-bottom:28px;} .auth-shield img{width:58px;height:58px;object-fit:contain;} .auth-hero h1{font-size:40px;line-height:1.05;letter-spacing:-.03em;margin:0 0 18px;color:var(--brand-ink);max-width:500px;} .auth-hero>p{font-size:15px;line-height:1.7;color:var(--brand-ink);max-width:500px;margin:0;} .auth-points{display:grid;gap:10px;margin-top:30px;color:var(--text);font-size:13px;}.auth-points span{display:flex;align-items:center;gap:8px;} .login-card.auth-card{width:auto;max-width:none;border-radius:0;border:0;box-shadow:none;padding:54px 48px;background:var(--panel);display:flex;flex-direction:column;justify-content:center;} .auth-card .login-logo{width:172px;margin:0 auto 26px;}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px;border:1px solid color-mix(in srgb,var(--brand) 46%,var(--line));border-radius:15px;background:color-mix(in srgb,var(--field) 88%,var(--panel) 12%);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 7%,transparent),0 10px 28px color-mix(in srgb,#000 18%,transparent);margin-bottom:28px;}.auth-tabs button{min-height:42px;border:0;border-radius:11px;background:transparent;color:color-mix(in srgb,var(--text) 72%,var(--muted) 28%);padding:10px 12px;font-weight:850;font-size:15px;cursor:pointer;transition:background .16s,color .16s,box-shadow .16s,transform .16s;}.auth-tabs button:hover{background:color-mix(in srgb,var(--brand) 8%,transparent);color:var(--text);}.auth-tabs button.active{background:linear-gradient(180deg,color-mix(in srgb,var(--brand) 76%,var(--panel) 24%),color-mix(in srgb,var(--brand) 58%,var(--panel) 42%));color:#fff;box-shadow:inset 0 0 0 1px color-mix(in srgb,#fff 16%,var(--brand) 84%),0 8px 22px color-mix(in srgb,var(--brand) 28%,transparent),0 0 16px color-mix(in srgb,var(--brand) 18%,transparent);}.auth-tabs button:focus-visible{outline:2px solid var(--brand2);outline-offset:2px;}html[data-theme="light"] .auth-tabs{background:#e8f1f8;border-color:#9fc2df;}html[data-theme="light"] .auth-tabs button{color:#385069;}html[data-theme="light"] .auth-tabs button.active{background:linear-gradient(180deg,#2f8fd8,#2672b0);color:#fff;}html[data-theme="gold"] .auth-tabs{background:#171107;border-color:#7c6330;}html[data-theme="gold"] .auth-tabs button{color:#d6c89f;}html[data-theme="gold"] .auth-tabs button.active{background:linear-gradient(180deg,#b8892d,#8b6720);color:#fff8df;} .auth-pane{display:grid;gap:9px;}.auth-pane.hidden{display:none;}.auth-pane h2{margin:0 0 3px;font-size:24px;color:var(--text);}.auth-pane>p{margin:0 0 14px;font-size:12.5px;line-height:1.55;color:var(--text);}.auth-pane label{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:800;margin-top:6px;}.auth-pane input{width:100%;box-sizing:border-box;padding:13px 14px;border-radius:11px;border:1px solid var(--line);background:var(--field);color:var(--text);outline:none;transition:.15s;}.auth-pane input:focus{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 24%,transparent);}.auth-primary{margin-top:10px;padding:13px 16px!important;font-size:13px!important;}.auth-error{min-height:20px;margin-top:14px;}.auth-security-note{margin-top:16px;padding:11px 12px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border-radius:10px;color:var(--muted);font-size:10px;line-height:1.5;} @media(max-width:850px){.auth-shell{padding:14px;}.auth-stage{width:min(560px,calc(100vw - 28px));grid-template-columns:1fr;}.auth-hero{display:none;}.login-card.auth-card{padding:40px 28px;border-radius:24px;}} /* v0.7 public beta locale switch */ /* FIX13 global language selector: stable in the top-right header, PL/EN only. */ .global-locale-switch{position:relative;display:inline-block;z-index:1000;} .global-locale-switch summary{list-style:none;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 11px;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--text);font-size:12px;font-weight:850;cursor:pointer;user-select:none;} .global-locale-switch summary::-webkit-details-marker{display:none;} .global-locale-switch[open] summary{border-color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--text) 18%,transparent);} .locale-menu{position:absolute;right:0;top:45px;min-width:150px;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--panel);box-shadow:0 16px 40px color-mix(in srgb,var(--text) 18%,transparent);} .locale-menu button{display:block;width:100%;border:0;background:transparent;color:var(--text);padding:9px 10px;border-radius:8px;text-align:left;font-size:12px;font-weight:750;cursor:pointer;}.locale-menu button:hover,.locale-menu button.active{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--brand2);} .login-locale-switch{position:fixed;right:20px;top:20px;z-index:10001;}.login-locale-switch .locale-menu{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} .auth-check{display:flex!important;gap:8px;align-items:flex-start;margin:10px 0!important;font-size:12px;color:var(--text);}.auth-check input{width:auto!important;height:auto!important;margin-top:3px;}.auth-check span{line-height:1.35;} .shot-storage-badge{display:inline-flex;align-items:center;height:36px;padding:0 11px;border:1px solid var(--warn);border-radius:10px;background:color-mix(in srgb,var(--warn) 11%,var(--panel));font-size:12px;font-weight:800;color:var(--warn);white-space:nowrap;} /* v0.8.3 profile avatars + editor */ .profile-chip{min-width:178px;display:flex!important;flex-direction:row!important;align-items:center!important;gap:11px!important;padding:10px 13px!important;} .profile-chip-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;flex:0 0 42px;background:var(--panel);border:1px solid var(--line);} .profile-chip-avatar.all{display:grid;place-items:center;font-weight:900;letter-spacing:-3px;color:var(--brand2);font-size:14px;} .profile-chip-copy{display:flex;flex-direction:column;gap:3px;min-width:0;} .profile-chip-copy strong{font-weight:850;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .profile-chip-copy small{color:var(--muted);font-size:10px;white-space:nowrap;} .profile-editor-overlay{position:fixed;inset:0;z-index:60;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));backdrop-filter:blur(8px);display:grid;place-items:center;padding:24px;} .profile-editor-overlay.hidden{display:none;} .profile-editor-card{width:min(570px,calc(100vw - 36px));border:1px solid var(--line);border-radius:22px;background:var(--panel);color:var(--text);box-shadow:0 28px 90px color-mix(in srgb,var(--text) 18%,transparent);padding:24px;} .profile-editor-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;} .profile-editor-head h2{margin:5px 0 5px;font-size:25px;}.profile-editor-head p{margin:0;} .icon-close{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:transparent;color:var(--text);font-size:25px;line-height:1;} .profile-avatar-choice{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:22px 0;} .profile-avatar-option{display:grid;grid-template-columns:72px 1fr;grid-template-rows:1fr 1fr;column-gap:13px;align-items:center;text-align:left;padding:14px;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--text);transition:.18s;} .profile-avatar-option:hover{transform:translateY(-1px);border-color:var(--line);} .profile-avatar-option.active{border-color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 24%,transparent);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} .profile-avatar-option img{grid-row:1/3;width:72px;height:72px;border-radius:50%;object-fit:cover;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} .profile-avatar-option strong{align-self:end;font-size:15px;}.profile-avatar-option span{align-self:start;color:var(--muted);font-size:10px;letter-spacing:.12em;font-weight:850;} .profile-editor-card .wide-input{width:100%;margin-top:7px;} .profile-editor-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px;} @media(max-width:760px){.profile-avatar-choice{grid-template-columns:1fr;}.profile-editor-card{padding:18px;}.profile-chip{min-width:160px;}} /* ========================================================================== v0.9 — destructive confirmation dialog + disconnect action (audit A-04/A-34) Reuses the existing design tokens (--panel, --line, --text, --muted, --danger) so it inherits every theme, including the dark and gold themes, with no per-theme overrides. ========================================================================== */ .modal.danger-modal{position:fixed;inset:0;z-index:70;background:color-mix(in srgb,var(--danger) 11%,var(--panel));backdrop-filter:blur(8px);display:grid;place-items:center;padding:24px;} .danger-modal .modal-card{width:min(560px,calc(100vw - 36px));border:1px solid var(--line);border-radius:22px;background:var(--panel);color:var(--text);box-shadow:0 28px 90px color-mix(in srgb,var(--danger) 26%,transparent);padding:26px;} .danger-modal h3{margin:0 0 10px;font-size:20px;line-height:1.25;} .danger-modal p{margin:0 0 14px;color:var(--muted);font-size:14px;line-height:1.55;} .danger-detail{border:1px solid var(--line);border-radius:14px;padding:14px 16px;font-size:13px;line-height:1.55;color:var(--text);background:color-mix(in srgb,var(--danger) 11%,var(--panel));max-height:230px;overflow:auto;} .danger-detail ul{margin:8px 0 12px;padding-left:20px;} .danger-detail li{margin:3px 0;font-weight:700;} .notification-delete-note{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;} .notification-delete-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,var(--danger) 18%,var(--panel));border:1px solid color-mix(in srgb,var(--danger) 55%,var(--line));color:var(--danger);font-size:22px;font-weight:900;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--danger) 10%,transparent);} .notification-delete-note strong{display:block;color:var(--text);font-size:13px;line-height:1.35;margin-bottom:4px;} .notification-delete-note span:not(.notification-delete-icon){display:block;color:var(--muted);font-size:12px;line-height:1.45;} .danger-modal .modal-card{animation:nestraDangerModalIn .16s ease-out;} @keyframes nestraDangerModalIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}} .danger-confirm{display:block;margin-top:16px;} .danger-confirm span{display:block;font-size:12px;font-weight:800;color:var(--muted);margin-bottom:6px;} .danger-confirm input{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 11px;background:var(--panel);color:var(--text);} .danger-modal .modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px;} .danger-modal button{border-radius:10px;padding:10px 15px;font-weight:800;} .danger-modal .secondary{background:transparent;color:var(--text);border:1px solid var(--line);} button.danger{background:var(--danger);color:#fff;border:1px solid var(--danger);box-shadow:0 8px 24px color-mix(in srgb,var(--danger) 24%,transparent);} button.danger:disabled{opacity:.42;cursor:not-allowed;} button.danger:not(:disabled):hover{filter:brightness(1.07);} /* Disconnect sits with Manage/Take control but must read as destructive, not primary. */ .fleet-actions .danger-action{background:transparent;color:var(--danger);border:1px solid var(--line);border-radius:10px;padding:10px 15px;font-weight:800;margin-left:auto;} .fleet-actions .danger-action:hover{border-color:var(--danger);background:color-mix(in srgb,var(--danger) 11%,var(--panel));} /* A detached device must be visually obvious, not silently shown under a child. */ .fleet-profile-badge.unassigned{color:var(--danger);border-color:var(--danger);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} .danger-modal :focus-visible,.fleet-actions .danger-action:focus-visible{outline:2px solid var(--danger);outline-offset:2px;} /* PROFILE RESET FIX7 ------------------------------------------------------- Detached devices stay visible in the aggregate "All devices" inventory, but they are not a child profile and cannot be silently re-assigned. */ .fleet-unassigned-note{ margin:0 0 14px; padding:14px 16px; border:1px solid var(--line); border-radius:14px; background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft)); display:grid; gap:5px; } .fleet-unassigned-note strong{font-size:14px;color:var(--text);} .fleet-unassigned-note span{font-size:13px;line-height:1.45;color:var(--muted);} .fleet-repair{ margin-top:12px; padding:12px 13px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:14px; } .fleet-repair>div{display:grid;gap:4px;min-width:0;} .fleet-repair strong{font-size:13px;color:var(--text);} .fleet-repair small{font-size:12px;line-height:1.35;color:var(--muted);} @media(max-width:760px){ .fleet-repair{align-items:stretch;flex-direction:column;} } /* FIX9 monitoring reliability */ .shot-image-wrap{position:relative;aspect-ratio:16/9;background:var(--panel);display:grid;place-items:center;overflow:hidden;} .shot-image-wrap>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;} .shot-image-error{padding:16px;text-align:center;color:var(--muted);font-size:12px;} .hidden{display:none!important;} /* FIX13 effective service-policy explanation */ .service-reason{margin:10px 0 12px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--muted);font-size:11px;line-height:1.45;} .service-reason.blocked{border-color:var(--danger);background:color-mix(in srgb,var(--danger) 11%,var(--panel));color:var(--danger);} .service-reason.allowed{border-color:var(--ok-line);background:var(--ok-soft);color:var(--ok);} /* FIX20 — server-managed category catalog + scalable Network Guard browser */ .network-category-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px;margin-top:12px;} .network-category-card{display:grid;grid-template-columns:42px minmax(0,1fr) auto auto;gap:11px;align-items:center;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);transition:opacity .16s,border-color .16s,background .16s;} .network-category-switch{justify-self:end;} .network-category-switch input:disabled+span{opacity:.55;cursor:wait;} .network-panel-hint{margin:5px 0 0;color:var(--muted);font-size:10px;line-height:1.45;} .network-auto-save{border:1px solid var(--ok-line);background:var(--ok-soft);color:var(--ok);border-radius:999px;padding:8px 12px;font-size:10px;font-weight:850;white-space:nowrap;} .network-auto-save.saving{color:var(--brand);border-color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,var(--panel));} .network-auto-save.error{color:var(--danger);border-color:var(--danger);background:color-mix(in srgb,var(--danger) 10%,var(--panel));} .network-category-card.inactive{opacity:.58;border-style:dashed;} .network-category-card.active .network-category-status{color:var(--ok);} .network-category-card.inactive .network-category-status{color:var(--muted);} .network-category-status{font-size:8px;font-weight:900;letter-spacing:.04em;} .network-category-icon{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-weight:950;font-size:11px;color:var(--text);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 6px 16px color-mix(in srgb,var(--text) 18%,transparent);} .network-category-copy{display:grid;gap:3px;min-width:0;}.network-category-copy strong{font-size:11.5px;color:var(--text);}.network-category-copy span{font-size:9.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .network-category-card .open-category-list{padding:7px 11px;font-size:9.5px;} .network-rules-total{display:flex;align-items:center;gap:10px;padding:9px 0;color:var(--muted);}.network-rules-total strong{font-size:20px;color:var(--brand);}.network-rules-total span{font-size:10px;} .category-catalog-overlay{position:fixed;inset:0;z-index:85;background:var(--panel);backdrop-filter:blur(9px);display:grid;place-items:center;padding:22px;} .category-catalog-card{width:min(980px,calc(100vw - 32px));max-height:min(820px,calc(100vh - 42px));display:grid;grid-template-rows:auto auto auto minmax(220px,1fr) auto;border:1px solid var(--line);border-radius:22px;background:var(--panel);box-shadow:0 30px 100px color-mix(in srgb,var(--text) 18%,transparent);overflow:hidden;} .category-catalog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 22px 14px;}.category-catalog-head h2{margin:5px 0 4px;font-size:22px;}.category-catalog-head p{margin:0;font-size:10px;} .category-catalog-toolbar{display:flex;align-items:center;gap:14px;padding:0 22px 14px;}.category-search{flex:1;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));padding:0 11px;}.category-search span{color:var(--muted);font-size:18px;}.category-search input{width:100%;border:0;outline:none;background:transparent;color:var(--text);padding:11px 0;}.category-catalog-hint{font-size:9.5px;color:var(--muted);max-width:330px;line-height:1.4;} .category-domain-header,.category-domain-row{display:grid;grid-template-columns:48px 34px minmax(0,1fr) 170px 154px;gap:10px;align-items:center;}.category-domain-header{padding:8px 22px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));font-size:9px;font-weight:850;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;}.category-domain-list{overflow:auto;min-height:220px;}.category-domain-row{padding:8px 22px;border-bottom:1px solid var(--line);min-height:45px;}.category-domain-row:hover{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));}.category-domain-index{font-size:9px;color:var(--muted);}.category-domain-row .site-mark{width:27px;height:27px;font-size:8px;}.category-domain-row code{font-size:11px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.category-domain-status{justify-self:start;border:1px solid;border-radius:999px;padding:5px 8px;font-size:8.5px;font-weight:900;letter-spacing:.04em;}.category-domain-status.blocked{color:var(--danger);border-color:var(--danger);background:color-mix(in srgb,var(--danger) 11%,var(--panel));}.category-domain-status.allowed{color:var(--ok);border-color:var(--ok-line);background:var(--ok-soft);}.category-domain-toggle{justify-self:stretch;min-height:31px;padding:5px 10px;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:9px;font-weight:850;cursor:pointer;}.category-domain-toggle:hover{border-color:var(--brand);color:var(--brand);}.category-domain-toggle.allow{border-color:var(--ok-line);background:var(--ok-soft);color:var(--ok);}.category-domain-toggle.reblock{border-color:color-mix(in srgb,var(--danger) 55%,var(--line));color:var(--danger);}.category-domain-toggle:disabled{opacity:.55;cursor:wait;}.category-browser-empty{padding:36px;text-align:center;color:var(--muted);} .category-catalog-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 22px;border-top:1px solid var(--line);font-size:10px;color:var(--muted);}.category-catalog-footer>div{display:flex;gap:8px;}.category-catalog-footer button{font-size:9.5px;padding:7px 10px;} @media(max-width:760px){.category-catalog-overlay{padding:10px;}.category-catalog-card{width:calc(100vw - 20px);max-height:calc(100vh - 20px);}.category-catalog-toolbar{align-items:stretch;flex-direction:column;}.category-domain-header,.category-domain-row{grid-template-columns:36px 30px minmax(0,1fr) 118px;}.category-domain-header span:nth-child(4),.category-domain-status{display:none;}.category-catalog-footer{align-items:stretch;flex-direction:column;}.category-catalog-footer>div{justify-content:flex-end;}} /* ========================================================================== FIX22 — Smart Screenshots Adaptive capture controls + fast thumbnail browser + time/app filters. ========================================================================== */ .screenshot-head{align-items:center;}.screenshot-head p{max-width:780px;} .screenshot-settings-panel,.screenshot-browser-panel{margin-bottom:18px;} .screenshot-settings-grid{display:grid;grid-template-columns:minmax(180px,.8fr) minmax(220px,1fr) minmax(260px,1.25fr) minmax(260px,1.25fr) auto;gap:14px;align-items:end;} .shot-control{display:grid;gap:7px;}.shot-control>span,.shot-filter-grid label>span{font-size:10px;color:var(--muted);font-weight:900;text-transform:uppercase;letter-spacing:.08em;} .shot-control select{width:100%;} .shot-toggle{min-height:70px;display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);cursor:pointer;} .shot-toggle input{margin-top:3px;width:17px;height:17px;accent-color:var(--brand);flex:0 0 auto;}.shot-toggle span{display:grid;gap:3px;}.shot-toggle strong{font-size:12px;}.shot-toggle small{font-size:10px;line-height:1.38;color:var(--muted);} .shot-save{height:42px;white-space:nowrap;} .shot-quick-ranges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}.shot-range{padding:8px 12px;font-size:12px;}.shot-range.active{background:var(--panel);border-color:var(--brand);color:var(--brand2);} .shot-filter-grid{display:grid;grid-template-columns:minmax(200px,.9fr) minmax(200px,.9fr) minmax(230px,1.2fr) auto;gap:12px;align-items:end;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--panel);} .shot-filter-grid label{display:grid;gap:6px;}.shot-filter-grid input,.shot-filter-grid select{width:100%;}.shot-filter-grid>button{height:42px;white-space:nowrap;} .shot-results-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:18px 0 12px;}.shot-results-head>div:first-child{display:grid;gap:3px;}.shot-results-head strong{font-size:14px;}.shot-results-head #shotResultHint{font-size:11px;color:var(--muted);} .shot-pagination{display:flex;gap:9px;align-items:center;}.shot-pagination span{min-width:62px;text-align:center;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;}.shot-pagination-bottom{justify-content:center;margin-top:16px;} .screenshot-gallery{grid-template-columns:repeat(4,minmax(0,1fr));}.screenshot-gallery .shot{cursor:pointer;position:relative;}.screenshot-gallery .shot:focus-visible{outline:2px solid var(--brand);outline-offset:2px;}.screenshot-gallery .shot-image-wrap{background:var(--panel);}.screenshot-gallery .shot-image-wrap::after{content:"Otwórz";position:absolute;right:8px;top:8px;padding:4px 7px;border-radius:999px;background:var(--panel);color:var(--text);font-size:9px;font-weight:800;opacity:0;transform:translateY(-2px);transition:.15s;}.screenshot-gallery .shot:hover .shot-image-wrap::after{opacity:1;transform:none;} .shot-meta{display:grid!important;grid-template-columns:1fr auto!important;gap:4px 10px!important;}.shot-meta .shot-app{font-weight:800;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.shot-meta .shot-time{color:var(--muted);}.shot-meta .shot-tech{grid-column:1/-1;color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .screenshot-modal{position:fixed;inset:0;z-index:90;background:var(--panel);backdrop-filter:blur(8px);display:grid;place-items:center;padding:20px;}.screenshot-modal.hidden{display:none;}.screenshot-modal-card{width:min(1500px,calc(100vw - 36px));max-height:calc(100vh - 36px);display:grid;grid-template-rows:auto minmax(0,1fr);background:var(--panel);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 30px 100px color-mix(in srgb,var(--text) 18%,transparent);}.screenshot-modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:16px 18px;border-bottom:1px solid var(--line);}.screenshot-modal-head h2{margin:4px 0 3px;font-size:18px;}.screenshot-modal-image-wrap{min-height:280px;position:relative;display:grid;place-items:center;background:var(--panel);overflow:auto;}.screenshot-modal-image-wrap img{display:block;max-width:100%;max-height:calc(100vh - 150px);width:auto;height:auto;}.screenshot-modal-image-wrap .remote-placeholder{position:absolute;inset:0;} @media(max-width:1350px){.screenshot-settings-grid{grid-template-columns:1fr 1fr;}.shot-save{grid-column:1/-1;}.screenshot-gallery{grid-template-columns:repeat(3,minmax(0,1fr));}} @media(max-width:980px){.shot-filter-grid{grid-template-columns:1fr 1fr;}.shot-app-filter{grid-column:1/2;}.screenshot-gallery{grid-template-columns:repeat(2,minmax(0,1fr));}} @media(max-width:680px){.screenshot-settings-grid,.shot-filter-grid{grid-template-columns:1fr;}.shot-app-filter{grid-column:auto;}.shot-results-head{align-items:flex-start;flex-direction:column;}.screenshot-gallery{grid-template-columns:1fr;}.shot-pagination{width:100%;justify-content:space-between;}.screenshot-modal{padding:8px;}.screenshot-modal-card{width:100%;max-height:calc(100vh - 16px);}} /* ========================================================================== FIX23 — Screenshot Reliability + proper live/history separation ========================================================================== */ .shot-mode-switch{display:inline-flex;gap:8px;padding:5px;margin:0 0 14px;border:1px solid var(--line);border-radius:14px;background:var(--panel);} .shot-mode-tab{border:1px solid transparent;background:transparent;color:var(--muted);border-radius:10px;padding:10px 15px;font-weight:900;cursor:pointer;} .shot-mode-tab.active{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);box-shadow:0 7px 18px color-mix(in srgb,var(--brand) 24%,transparent);} .shot-live-head,.shot-history-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:16px;}.shot-live-head h2,.shot-history-toolbar h2{margin:4px 0 4px;}.shot-live-head p,.shot-history-toolbar p{margin:0;} .shot-live-status{display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:11px;font-weight:800;white-space:nowrap;}.live-dot{width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 0 0 4px color-mix(in srgb,var(--text) 18%,transparent);} .shot-history-actions,.shot-history-search-actions,.shot-results-tools,.screenshot-modal-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}.danger-outline{border-color:var(--danger)!important;color:var(--danger)!important;background:color-mix(in srgb,var(--danger) 11%,var(--panel))!important;}.danger-outline:hover{border-color:var(--danger)!important;background:color-mix(in srgb,var(--danger) 11%,var(--panel))!important;} .shot-history-layout{display:grid;grid-template-columns:minmax(300px,390px) minmax(0,1fr);gap:18px;align-items:stretch;}.shot-calendar-card,.shot-history-search-card{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:16px;}.shot-calendar-head{display:grid;grid-template-columns:38px 1fr 38px;align-items:center;gap:10px;margin-bottom:12px;}.shot-calendar-head strong{text-align:center;text-transform:capitalize;}.shot-calendar-week,.shot-calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}.shot-calendar-week{margin-bottom:6px;}.shot-calendar-week span{text-align:center;font-size:9px;font-weight:900;color:var(--muted);text-transform:uppercase;}.shot-calendar-empty{min-height:45px;}.shot-calendar-day{position:relative;min-height:46px;border:1px solid transparent;border-radius:11px;background:var(--panel);color:var(--text);display:grid;place-items:center;cursor:pointer;font-weight:850;}.shot-calendar-day:hover{border-color:var(--brand);background:var(--panel);}.shot-calendar-day.today{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text) 18%,transparent);}.shot-calendar-day.selected{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);}.shot-calendar-day small{position:absolute;right:4px;bottom:3px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;display:grid;place-items:center;background:var(--panel);color:var(--muted);font-size:7px;font-weight:900;}.shot-calendar-day.has-shots:not(.selected)::after{content:"";position:absolute;left:50%;bottom:5px;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--brand);}.shot-calendar-legend{display:flex;align-items:center;gap:7px;margin-top:12px;color:var(--muted);font-size:10px;}.calendar-dot{width:6px;height:6px;border-radius:50%;background:var(--brand);} .shot-history-search-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,.7fr);gap:14px;align-content:start;}.shot-selected-date{grid-column:1/-1;display:grid;gap:4px;padding:13px 14px;border:1px solid var(--line);border-radius:13px;background:var(--field);}.shot-selected-date span,.shot-history-search-card label>span{font-size:9px;color:var(--muted);font-weight:900;text-transform:uppercase;letter-spacing:.08em;}.shot-selected-date strong{font-size:17px;text-transform:capitalize;}.shot-time-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}.shot-time-grid label,.shot-history-search-card>.shot-app-filter{display:grid;gap:6px;}.shot-time-grid input,.shot-history-search-card select{width:100%;}.shot-history-search-actions{grid-column:1/-1;}.shot-history-search-actions .primary{min-width:140px;} .shot-select-all{display:flex!important;align-items:center;gap:7px;color:var(--muted);font-size:11px;font-weight:800;}.shot-select-all input{width:16px;height:16px;accent-color:var(--brand);} .screenshot-gallery .shot-select{position:absolute;z-index:3;left:9px;top:9px;width:28px;height:28px;border-radius:9px;background:var(--field);border:1px solid var(--line);display:grid;place-items:center;cursor:pointer;}.screenshot-gallery .shot-select input{width:16px;height:16px;accent-color:var(--brand);cursor:pointer;}.screenshot-gallery .shot:has(.shot-select input:checked){outline:2px solid var(--brand);outline-offset:1px;}.shot-history-panel .screenshot-gallery .shot-image-wrap::after{right:8px;}.screenshot-live-gallery .shot-image-wrap::after{content:"Podgląd";} .screenshot-modal-actions .icon-close{margin-left:4px;} @media(max-width:1100px){.shot-history-layout{grid-template-columns:1fr;}.shot-calendar-card{max-width:520px;}.shot-history-search-card{grid-template-columns:1fr 1fr;}.shot-results-tools{width:100%;justify-content:flex-end;}} @media(max-width:720px){.shot-live-head,.shot-history-toolbar{flex-direction:column;}.shot-history-actions{width:100%;}.shot-history-search-card{grid-template-columns:1fr;}.shot-selected-date,.shot-history-search-actions{grid-column:auto;}.shot-time-grid{grid-template-columns:1fr 1fr;}.shot-results-tools{justify-content:flex-start;}.shot-calendar-grid,.shot-calendar-week{gap:3px;}.shot-calendar-day{min-height:40px;}.shot-mode-switch{display:flex;}.shot-mode-tab{flex:1;}} /* FIX23.1 sidebar mark: shield only, brighter asset, no caption below. */ .sidebar>.sidebar-logo{width:132px;height:132px;max-height:132px;object-fit:contain;border-radius:0;margin:0 auto 8px;filter:drop-shadow(0 12px 28px color-mix(in srgb,var(--text) 18%,transparent));} .sidebar>nav{margin-top:20px;} @media(max-width:1050px){.sidebar>.sidebar-logo{width:58px;height:58px;margin:0 auto 10px;}} /* ========================================================== FIX23.4 — UI CONSISTENCY PASS language control · segmented themes · light contrast · restrained gold · sidebar polish · hierarchy · danger UI ========================================================== */ /* Shared control rhythm */ .topbar-actions{gap:8px;} .topbar-actions>.secondary,.topbar-actions>.takeover-btn,.global-locale-switch summary,.theme-segment{height:38px;} .topbar-actions>.secondary,.topbar-actions>.takeover-btn{border-radius:10px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;} /* Theme selector: one coherent segmented control instead of cycling button */ .theme-segment{display:inline-flex;align-items:center;padding:3px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--panel) 92%,var(--bg));box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 18%,transparent);} .theme-segment button{height:30px;border:0;border-radius:8px;padding:0 9px;background:transparent;color:var(--muted);font-size:11px;font-weight:850;display:inline-flex;align-items:center;gap:5px;transition:background .16s,color .16s,box-shadow .16s,transform .16s;} .theme-segment button:hover{color:var(--text);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} .theme-segment button.active{color:var(--brand-ink);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));box-shadow:0 3px 10px color-mix(in srgb,var(--brand) 24%,transparent);} .theme-segment button:focus-visible{outline:2px solid var(--brand);outline-offset:2px;} .theme-choice-icon{width:14px;height:14px;display:grid;place-items:center;flex:0 0 auto;}.theme-choice-icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;} .login-theme-segment{position:fixed;top:20px;right:92px;z-index:10001;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));backdrop-filter:blur(12px);} /* Language picker: neutral branded icon rather than emoji/turquoise dot */ .global-locale-switch summary{min-width:66px;justify-content:center;gap:6px;padding:0 9px;background:color-mix(in srgb,var(--panel) 94%,var(--bg));border-color:var(--line);transition:.16s;} .global-locale-switch summary:hover{border-color:color-mix(in srgb,var(--brand) 48%,var(--line));background:color-mix(in srgb,var(--brand-soft) 38%,var(--panel));color:var(--brand);} .global-locale-switch[open] summary{border-color:color-mix(in srgb,var(--brand) 60%,var(--line));box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 10%,transparent);} .locale-globe{width:17px;height:17px;display:grid;place-items:center;color:var(--brand);} .locale-globe svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;} .locale-current{font-size:11px;letter-spacing:.06em;font-weight:900;color:var(--text);} .locale-chevron{font-size:12px;line-height:1;color:var(--muted);transform:translateY(-1px);transition:transform .16s;} .global-locale-switch[open] .locale-chevron{transform:rotate(180deg) translateY(1px);} .locale-menu{min-width:154px;padding:7px;border-radius:12px;background:var(--panel);border-color:var(--line);box-shadow:0 18px 44px color-mix(in srgb,var(--text) 18%,transparent);} .locale-menu button{display:flex;align-items:center;gap:9px;} .locale-dot{width:16px;height:16px;border-radius:50%;border:1px solid color-mix(in srgb,var(--line) 82%,transparent);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--text) 18%,transparent);} .locale-dot.pl{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} .locale-dot.en{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));} .locale-menu button.active{background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--brand);} /* Light theme: stronger layer separation and more legible secondary text */ /* Section typography / hierarchy */ .section-head{align-items:center;margin-bottom:25px;} .section-head .eyebrow,.network-head .eyebrow,.panel .eyebrow{font-size:9px;letter-spacing:.16em;font-weight:900;opacity:.88;} .section-head h1{font-size:31px;line-height:1.08;letter-spacing:-.025em;margin:7px 0 6px;} .section-head p{font-size:14px;line-height:1.5;max-width:900px;} .panel h2{font-size:18px;letter-spacing:-.012em;} .label{font-size:10px;letter-spacing:.09em;} /* Sidebar: quieter NEW badges, clearer active rail, consistent icon weight */ .nav{border-radius:11px;min-height:44px;} .nav-icon svg{stroke-width:1.75;} .nav-new{font-size:6.5px;letter-spacing:.05em;padding:2px 4px;opacity:.78;border-color:var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--brand2);} .nav:hover .nav-new,.nav.active .nav-new{opacity:1;} .nav.active{box-shadow:inset 3px 0 0 var(--brand),0 7px 20px color-mix(in srgb,var(--brand) 24%,transparent);} .nav.active::after{width:4px;height:4px;box-shadow:none;} .sidebar-logo{filter:drop-shadow(0 8px 20px color-mix(in srgb,var(--text) 18%,transparent));} .sidebar-logo:hover{filter:drop-shadow(0 10px 22px color-mix(in srgb,var(--text) 18%,transparent));} /* Destructive actions: one restrained system */ .danger-outline,.fleet-actions .danger-action{color:var(--danger)!important;border:1px solid color-mix(in srgb,var(--danger) 38%,var(--line))!important;background:color-mix(in srgb,var(--danger) 4%,transparent)!important;box-shadow:none!important;} .danger-outline:hover:not(:disabled),.fleet-actions .danger-action:hover:not(:disabled){color:var(--danger)!important;border-color:color-mix(in srgb,var(--danger) 68%,var(--line))!important;background:color-mix(in srgb,var(--danger) 9%,transparent)!important;} button.danger{background:color-mix(in srgb,var(--danger) 11%,var(--panel));border-color:var(--danger);box-shadow:none;} button.danger:not(:disabled):hover{filter:brightness(1.04);box-shadow:0 6px 16px color-mix(in srgb,var(--danger) 14%,transparent);} /* GOLD: use gold as an accent, not a glow field */ /* DARK control consistency */ @media(max-width:1180px){ .theme-segment button span:last-child{display:none;} .theme-segment button{width:31px;padding:0;justify-content:center;} .theme-segment{padding:3px;} } @media(max-width:900px){ .login-theme-segment{right:18px;top:66px;} .topbar-actions{gap:6px;} .global-locale-switch summary{min-width:56px;} } /* ========================================================== FIX23.5 — PROFILE / DEVICE PICKERS + LANGUAGE FLAGS + AVATARS ========================================================== */ .native-select-proxy{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;} .topbar-profile-select,.topbar-device-select{position:relative;} .topbar-smart-picker{position:relative;z-index:1010;} .topbar-smart-picker summary{list-style:none;} .topbar-smart-picker summary::-webkit-details-marker{display:none;} .smart-picker-summary{height:43px;display:flex;align-items:center;gap:10px;padding:0 11px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--panel) 95%,var(--bg));color:var(--text);cursor:pointer;user-select:none;box-shadow:0 5px 16px color-mix(in srgb,var(--text) 18%,transparent);transition:border-color .16s,background .16s,box-shadow .16s;} .profile-smart-picker{width:205px;}.device-smart-picker{width:282px;} .smart-picker-summary:hover{border-color:color-mix(in srgb,var(--brand) 48%,var(--line));background:color-mix(in srgb,var(--brand-soft) 24%,var(--panel));} .topbar-smart-picker[open] .smart-picker-summary{border-color:color-mix(in srgb,var(--brand) 72%,var(--line));box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 10%,transparent),0 10px 26px color-mix(in srgb,var(--text) 18%,transparent);} .smart-picker-avatar{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:0 0 30px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border:1px solid color-mix(in srgb,var(--brand) 22%,var(--line));} .smart-picker-avatar.all{display:grid;place-items:center;overflow:hidden;}.smart-picker-avatar.all img{width:26px;height:26px;object-fit:contain;} .smart-picker-copy,.smart-picker-row-copy{display:flex;flex-direction:column;min-width:0;gap:2px;flex:1;} .smart-picker-copy strong,.smart-picker-row-copy strong{font-size:12px;line-height:1.1;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .smart-picker-copy small,.smart-picker-row-copy small{font-size:9px;color:var(--muted);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .smart-picker-chevron{margin-left:auto;color:var(--muted);font-size:14px;transition:transform .16s;transform:translateY(-1px);} .topbar-smart-picker[open] .smart-picker-chevron{transform:rotate(180deg) translateY(1px);} .smart-picker-menu{position:absolute;top:49px;left:0;width:max(100%,230px);padding:7px;border:1px solid var(--line);border-radius:13px;background:var(--panel);box-shadow:0 18px 46px color-mix(in srgb,var(--text) 18%,transparent);max-height:330px;overflow:auto;} .device-smart-picker .smart-picker-menu{width:max(100%,282px);} .smart-picker-row{width:100%;display:flex;align-items:center;gap:10px;padding:9px 9px;border:0;border-radius:9px;background:transparent;color:var(--text);text-align:left;cursor:pointer;transition:background .14s,color .14s,transform .14s;} .smart-picker-row:hover{background:color-mix(in srgb,var(--brand) 8%,transparent);transform:translateX(1px);} .smart-picker-row.active{background:linear-gradient(90deg,color-mix(in srgb,var(--brand) 16%,transparent),color-mix(in srgb,var(--brand) 5%,transparent));color:var(--text);} .smart-picker-row.active::before{content:"";width:3px;height:30px;border-radius:3px;background:var(--brand);margin-left:-6px;box-shadow:none;} .smart-active-mark{margin-left:auto;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--brand) 14%,transparent);color:var(--brand);font-size:11px;font-weight:950;} .smart-picker-empty{padding:16px;color:var(--muted);font-size:11px;text-align:center;} .smart-device-icon{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:0 0 30px;background:color-mix(in srgb,var(--brand) 9%,transparent);color:var(--brand);} .smart-device-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;} .smart-device-status{display:inline-flex!important;align-items:center;gap:5px;text-transform:none!important;letter-spacing:0!important;}.smart-device-status i{width:6px;height:6px;border-radius:50%;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));flex:0 0 6px;}.smart-device-status.online{color:var(--ok)!important;}.smart-device-status.online i{background:var(--ok-soft);box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 24%,transparent);}.smart-device-status.offline{color:var(--text)!important;} /* Real flag artwork, equal geometry for PL / English. */ .locale-flag{width:21px;height:14px;display:inline-grid;place-items:center;flex:0 0 21px;border-radius:3px;overflow:hidden;box-shadow:0 0 0 1px color-mix(in srgb,var(--line) 78%,transparent),0 1px 2px color-mix(in srgb,var(--text) 18%,transparent);} .locale-flag svg{display:block;width:21px;height:14px;} .locale-menu button{min-height:36px;padding:8px 10px;gap:10px;} .locale-menu button>span:last-child{line-height:1;font-weight:800;} /* New semi-realistic avatars: clearer frame at small sizes, no clip-art halo. */ .profile-chip-avatar,.profile-avatar-option img,.smart-picker-avatar{background:var(--panel);border-color:color-mix(in srgb,var(--brand) 25%,var(--line));box-shadow:0 2px 7px color-mix(in srgb,var(--text) 18%,transparent);} .profile-avatar-option img{width:82px;height:82px;} .profile-avatar-option{grid-template-columns:82px 1fr;min-height:112px;} .profile-avatar-option strong{font-size:16px;}.profile-avatar-option span{font-size:9px;opacity:.74;} @media(max-width:1250px){.profile-smart-picker{width:180px;}.device-smart-picker{width:230px;}} @media(max-width:1000px){.profile-smart-picker{width:160px;}.device-smart-picker{width:190px;}.smart-picker-copy small{display:none;}} @media(max-width:820px){.topbar-profile-select{display:none;}.device-smart-picker{width:175px;}} /* ========================================================== FIX23.6 — DROPDOWN POLISH + LAYERING opaque menu surfaces · reliable header stacking · no bleed-through ========================================================== */ /* The topbar uses backdrop-filter, which creates its own stacking context. Without an explicit z-index, later page content can paint above open dropdowns even when the dropdown itself has a large local z-index. Keep the header above normal views, but below application modals. */ .topbar{position:relative;z-index:15;overflow:visible;} .view{position:relative;z-index:1;} .device-brand-row,.topbar-selectors,.topbar-actions,.topbar-profile-select,.topbar-device-select{overflow:visible;} .topbar-smart-picker[open],.global-locale-switch[open]{z-index:18;} .smart-picker-menu,.global-locale-switch .locale-menu{z-index:19;opacity:1;backdrop-filter:none;-webkit-backdrop-filter:none;} /* Solid dropdown surfaces: underlying page text must never bleed through. */ /* Keep rows clean and opaque-looking even over bright hero/cards. */ .smart-picker-row,.global-locale-switch .locale-menu button{position:relative;z-index:1;} /* Do not let normal dashboard/card stacking compete with the header menus. */ .hero,.cards,.panel,.card,.devices-layout,.profile-strip{z-index:auto;} /* ========================================================================== FIX23.7 — ACCESS TIME UX + AUTOSAVE Current-day focus, immediate persistence and a precise 15-minute timeline. ========================================================================== */ .access-head{align-items:flex-start;}.access-autosave-head{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:var(--ok-soft);color:var(--muted);font-size:11px;font-weight:800;white-space:nowrap;transition:.16s ease;}.access-autosave-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 24%,transparent);}.access-autosave-head.saving{color:var(--brand);border-color:color-mix(in srgb,var(--brand) 45%,var(--line));}.access-autosave-head.saving .access-autosave-dot{background:var(--brand);animation:access-save-pulse 1s ease-in-out infinite;}.access-autosave-head.saved{color:var(--ok);border-color:var(--ok-line);}.access-autosave-head.saved .access-autosave-dot{background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 24%,transparent);}.access-autosave-head.error{color:var(--danger);border-color:var(--danger);}.access-autosave-head.error .access-autosave-dot{background:color-mix(in srgb,var(--danger) 11%,var(--panel));box-shadow:0 0 0 4px color-mix(in srgb,var(--danger) 26%,transparent);} @keyframes access-save-pulse{50%{opacity:.38;transform:scale(.82);}} .access-limit-panel{padding:24px 28px 22px;}.access-days{gap:12px;margin-bottom:22px;}.access-day{position:relative;width:64px;height:64px;border-radius:18px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border:1px solid var(--line);box-shadow:0 2px 8px color-mix(in srgb,var(--text) 18%,transparent);transition:transform .14s ease,border-color .14s ease,background .14s ease,box-shadow .14s ease;}.access-day span{font-size:13px;}.access-day small{font-size:9.5px;}.access-day:hover{transform:translateY(-2px);box-shadow:0 6px 16px color-mix(in srgb,var(--text) 18%,transparent);}.access-day.today{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--brand) 34%,transparent);}.access-day.today::after{content:"";position:absolute;top:-5px;left:50%;transform:translateX(-50%);width:8px;height:8px;border-radius:50%;background:var(--brand);border:2px solid var(--line);box-shadow:0 0 0 1px color-mix(in srgb,var(--brand) 38%,transparent);}.access-day.selected{background:var(--field);border-color:var(--brand);color:var(--brand-ink);box-shadow:0 8px 22px color-mix(in srgb,var(--brand) 24%,transparent);}.access-day.selected.today::after{background:var(--field);border-color:var(--brand);box-shadow:0 0 0 1px color-mix(in srgb,var(--brand) 24%,transparent);} .access-limit-editor{width:min(1080px,100%);margin:0 auto;}.access-limit-main{max-width:none;margin:0 0 12px;align-items:center;}.access-selected-label{font-size:22px;}.access-limit-actions{display:flex;align-items:center;gap:12px;}.access-today-usage{padding:7px 10px;border-radius:9px;background:color-mix(in srgb,var(--brand) 7%,transparent);}.access-unlimited-toggle{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:7px 13px;border-radius:11px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));color:var(--muted);font-weight:850;transition:.14s ease;}.access-unlimited-toggle:hover{border-color:var(--brand);color:var(--text);}.access-unlimited-toggle.active{background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));border-color:color-mix(in srgb,var(--brand) 52%,var(--line));color:var(--brand);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 14%,transparent);}.access-unlimited-symbol{font-size:20px;line-height:1;} .access-slider-card{padding:16px 18px 13px;border:1px solid var(--line);border-radius:15px;background:var(--panel);}.access-slider-value-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;}.access-slider-caption{display:block;color:var(--muted);font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.07em;}.access-slider-value-row strong{display:block;margin-top:3px;font-size:20px;color:var(--text);}.access-slider-hint{color:var(--muted);font-size:11px;font-weight:700;}.access-slider-shell{--access-progress:28.571%;position:relative;padding-top:24px;}.access-slider-bubble{position:absolute;top:0;left:clamp(25px,var(--access-progress),calc(100% - 25px));transform:translateX(-50%);min-width:48px;padding:4px 8px;border-radius:8px;background:var(--text);color:var(--bg);font-size:10px;font-weight:900;text-align:center;white-space:nowrap;box-shadow:0 5px 14px color-mix(in srgb,var(--text) 18%,transparent);transition:opacity .14s ease;}.access-slider-card.unlimited .access-slider-bubble{opacity:.28;}.access-slider{--access-progress:28.571%;width:100%;height:10px;margin:4px 0 9px;border:0;border-radius:999px;background:linear-gradient(to right,var(--brand) 0 var(--access-progress),color-mix(in srgb,var(--line) 82%,transparent) var(--access-progress) 100%);box-shadow:inset 0 1px 2px color-mix(in srgb,var(--text) 18%,transparent);}.access-slider::-webkit-slider-thumb{width:26px;height:26px;border:4px solid var(--line);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 24%,transparent),0 5px 14px color-mix(in srgb,var(--text) 18%,transparent);}.access-slider::-moz-range-thumb{width:18px;height:18px;border:4px solid var(--line);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 24%,transparent),0 5px 14px color-mix(in srgb,var(--text) 18%,transparent);}.access-slider-marks{display:grid;grid-template-columns:repeat(8,1fr);width:100%;margin:0;color:var(--muted);font-size:10px;font-weight:850;text-align:center;}.access-slider-marks span:first-child{text-align:left;}.access-slider-marks span:last-child{text-align:right;}.access-slider-card.unlimited .access-slider{opacity:.45;}.access-slider-card.unlimited .access-slider-marks{opacity:.55;} .access-status-row{margin-top:16px;}.access-status-card,.access-bonus-card{background:color-mix(in srgb,var(--warn) 11%,var(--panel));} .access-schedule-panel{position:relative;}.access-schedule-head .muted{max-width:720px;}.access-grid-wrap{padding:10px 4px 5px;}.access-grid{grid-template-columns:50px repeat(24,31px);grid-auto-rows:31px;gap:3px;min-width:866px;}.access-grid-corner{width:50px;}.access-hour{font-variant-numeric:tabular-nums;}.access-row-label{position:relative;height:31px;padding-right:10px;border-radius:7px;}.access-row-label.selected{background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--brand);}.access-row-label.today::before{content:"";position:absolute;left:3px;top:50%;width:5px;height:5px;border-radius:50%;background:var(--brand);transform:translateY(-50%);}.access-cell{width:31px;height:31px;border-radius:7px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text) 18%,transparent);}.access-cell.allowed{background:var(--ok-soft);}.access-cell.blocked{background:color-mix(in srgb,var(--danger) 11%,var(--panel));}.access-cell:hover{transform:scale(1.07);box-shadow:0 4px 10px color-mix(in srgb,var(--text) 18%,transparent);z-index:2;} @media(max-width:900px){.access-autosave-head{align-self:flex-start;}.access-limit-main,.access-slider-value-row{align-items:flex-start;flex-direction:column;}.access-limit-actions{width:100%;justify-content:space-between;}.access-days{gap:8px;}.access-day{width:54px;height:54px;border-radius:15px;}.access-grid{justify-content:start;}} @media(max-width:560px){.access-limit-actions{align-items:flex-start;flex-direction:column;}.access-unlimited-toggle{width:100%;justify-content:center;}.access-slider-hint{display:none;}.access-slider-card{padding:14px 12px 11px;}} /* ========================================================================== FIX23.8 — ACCESS SLIDER QUARTER MARKERS + STRONGER AUTOSAVE STATUS Three mathematically aligned 15/30/45-minute markers per hour. ========================================================================== */ .access-autosave-head{ min-height:44px; padding:10px 17px; gap:11px; border-width:1px; border-color:var(--ok-line); background:var(--ok-soft); color:var(--text); font-size:12.5px; font-weight:900; letter-spacing:.005em; box-shadow:0 6px 18px color-mix(in srgb,var(--ok) 24%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--ok) 24%,transparent);} .access-autosave-dot{ width:11px;height:11px;flex:0 0 11px; background:var(--ok); box-shadow:0 0 0 5px color-mix(in srgb,var(--ok) 24%,transparent),0 0 14px color-mix(in srgb,var(--ok) 24%,transparent);} .access-autosave-head.saving{background:var(--ok-soft);box-shadow:0 6px 18px color-mix(in srgb,var(--brand) 10%,transparent);} .access-autosave-head.saved{background:var(--ok-soft);box-shadow:0 6px 18px color-mix(in srgb,var(--ok) 24%,transparent);} .access-slider-card{padding:18px 20px 17px;border-radius:17px;} .access-slider-value-row{margin-bottom:18px;} .access-slider-shell{--access-thumb-left:calc(28.571429% + 6px);position:relative;padding-top:36px;padding-bottom:34px;} .access-slider-bubble{ top:0;left:var(--access-thumb-left);min-width:68px;padding:6px 10px;border-radius:10px; font-size:11px;line-height:1;font-weight:950; box-shadow:0 7px 18px color-mix(in srgb,var(--text) 18%,transparent);} .access-slider-bubble::after{ content:"";position:absolute;left:50%;bottom:-6px;transform:translateX(-50%); width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:7px solid var(--text);} .access-slider{ --access-progress-pos:calc(28.571429% + 6px); position:relative;z-index:6;width:100%;height:12px;margin:6px 0 0; background:linear-gradient(to right,var(--brand) 0 var(--access-progress-pos),color-mix(in srgb,var(--line) 82%,transparent) var(--access-progress-pos) 100%); box-shadow:inset 0 1px 3px color-mix(in srgb,var(--text) 18%,transparent);} .access-slider::-webkit-slider-thumb{ box-sizing:border-box;width:28px;height:28px;border:4px solid var(--line); box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 28%,transparent),0 6px 16px color-mix(in srgb,var(--text) 18%,transparent);} .access-slider::-moz-range-thumb{ box-sizing:border-box;width:28px;height:28px;border:4px solid var(--line); box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 28%,transparent),0 6px 16px color-mix(in srgb,var(--text) 18%,transparent);} .access-slider-ticks{position:absolute;left:0;right:0;top:42px;height:12px;z-index:10;display:block!important;overflow:visible!important;pointer-events:none;} .access-slider-tick{position:absolute;display:block!important;visibility:visible!important;opacity:1!important;transform:translateX(-50%);pointer-events:none;} .access-slider-tick.major{ top:-1px;width:3px;height:14px;border-radius:2px;background:var(--text);box-shadow:0 0 0 1px color-mix(in srgb,var(--panel) 90%,transparent),0 1px 4px color-mix(in srgb,var(--text) 34%,transparent);} .access-slider-tick.quarter{ top:2px;width:8px;height:8px;border:1px solid var(--panel);border-radius:50%; background:var(--text);box-shadow:0 0 0 1px color-mix(in srgb,var(--brand) 72%,transparent),0 1px 5px color-mix(in srgb,var(--text) 34%,transparent);} .access-slider-labels{position:absolute;left:0;right:0;bottom:0;height:20px;z-index:9;display:block!important;overflow:visible!important;color:var(--muted);font-size:10px;font-weight:900;pointer-events:none;} .access-slider-labels span{position:absolute;display:block!important;top:0;transform:translateX(-50%);white-space:nowrap;font-variant-numeric:tabular-nums;} .access-slider-labels span:first-child{transform:none;} .access-slider-labels span:last-child{transform:translateX(-100%);} .access-slider-card.unlimited .access-slider-ticks,.access-slider-card.unlimited .access-slider-labels{opacity:.52;} @media(max-width:560px){.access-autosave-head{min-height:40px;padding:9px 13px;font-size:11.5px;}.access-slider-card{padding:16px 13px;}.access-slider-shell{padding-bottom:32px;}.access-slider-tick.quarter{width:5px;height:5px;}} /* FIX23.9 — parent-friendly block-message editor */ .message-template-box,.message-insert-box{margin-top:16px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel) 94%,var(--brand) 6%);} .message-template-copy,.message-insert-copy{display:grid;gap:3px;margin-bottom:10px;}.message-template-copy strong,.message-insert-copy strong{font-size:13px;}.message-template-copy span,.message-insert-copy span{font-size:12px;color:var(--muted);} .message-template-buttons{display:flex;gap:8px;flex-wrap:wrap;}.message-template-btn.active{border-color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 18%,transparent);} .message-friendly-tokens{margin-top:0;}.friendly-token{font-family:inherit;font-weight:800;display:inline-flex;align-items:center;gap:6px;padding:8px 10px;}.friendly-token>span:first-child{font-size:15px;line-height:1;color:var(--brand);} .message-advanced{margin-top:12px;border-top:1px solid var(--line);padding-top:10px;}.message-advanced summary{cursor:pointer;color:var(--muted);font-size:12px;font-weight:800;}.message-advanced-content{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;}.message-advanced-content code{font-size:11px;color:var(--muted);} /* ============================================================================ FIX23.10 — DEVICE EDITING STABILITY + LOCALE DEFAULTS + STORAGE + SLIDER FILL ========================================================================== */ .fleet-edit{ grid-template-columns:minmax(190px,1.2fr) minmax(170px,1fr) auto; gap:10px 9px;padding:14px 0 0;margin-top:14px;align-items:end;} .fleet-edit-field{display:grid;gap:6px;min-width:0;} .fleet-edit-field>span{font-size:9px;font-weight:900;letter-spacing:.075em;text-transform:uppercase;color:var(--muted);} .fleet-edit input,.fleet-edit select{ min-height:40px;padding:9px 11px;border-radius:10px;border:1px solid var(--line); background:color-mix(in srgb,var(--panel) 97%,var(--brand) 3%);color:var(--text);font-size:12px;font-weight:700; transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;} .fleet-edit input:focus,.fleet-edit select:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 15%,transparent);} .fleet-edit .save-device-assignment{min-height:40px;padding:9px 16px;font-size:12px;font-weight:900;} .fleet-edit-note{grid-column:1/-1;display:block;min-height:16px;color:var(--muted);font-size:10px;line-height:1.45;} .fleet-edit.dirty{padding:13px 12px 10px;border:1px solid color-mix(in srgb,var(--brand) 36%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--brand) 5%,transparent);} .fleet-edit.dirty .fleet-edit-note{color:var(--brand2);font-weight:750;} .shot-storage-badge{ min-height:46px;height:46px;padding:0 17px;border-radius:13px; border:1px solid var(--warn);background:color-mix(in srgb,var(--warn) 11%,var(--panel)); color:var(--warn);font-size:14px;font-weight:950;letter-spacing:.01em; box-shadow:0 7px 20px color-mix(in srgb,var(--warn) 24%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--warn) 24%,transparent);} /* The early dark-theme rule uses --access-progress. Keep the final theme rules explicitly tied to the live variable so the coloured track follows the thumb. */ @media(max-width:820px){.fleet-edit{grid-template-columns:1fr;}.fleet-edit-note{grid-column:1;}} /* ===== NESTRA SEMANTIC SURFACE LAYER ===== */ body{background:var(--bg);color:var(--text)} main,.view{background:var(--bg);color:var(--text)} .sidebar{background:var(--sidebar);border-right:1px solid var(--line);box-shadow:var(--shadow)} .sidebar .nav,.sidebar-bottom,.version{color:var(--brand2)} .nav:hover,.nav.active{background:color-mix(in srgb,var(--brand) 16%,var(--sidebar));color:var(--brand2);border-color:var(--brand)} .nav-new{color:var(--brand2);border-color:var(--brand);background:color-mix(in srgb,var(--brand) 12%,var(--sidebar))} .topbar{background:var(--panel);border-bottom:1px solid var(--line);box-shadow:var(--shadow)} .topbar select,.topbar input{background:var(--field);color:var(--text)} /* Surface hierarchy: page -> panel/card -> field. */ .card,.panel,.app-card,.shot,.empty,.login-card,.notification-preview,.preview-body-card, .access-slider-card,.access-status-card,.access-bonus-card,.access-schedule-panel,.access-limit-panel, .app-stats-chart-panel,.app-stats-list-panel,.app-table-panel,.network-rules-panel,.pairing-panel, .preview-panel,.profile-sync-panel,.remote-panel,.screenshot-browser-panel,.screenshot-settings-panel, .server-panel,.shot-history-panel,.web-list-panel,.web-settings-panel,.category-catalog-card,.coverage-card, .fleet-device-card,.modal-card,.network-category-card,.network-master-card,.network-settings-card, .profile-editor-card,.screenshot-modal-card,.service-card,.shot-calendar-card,.shot-history-search-card, .smart-picker-menu,.profile-chip,.apps-summary span{ background:var(--panel);border-color:var(--line);box-shadow:var(--shadow); } input,select,textarea,.wide-input,.message-textarea,.shot-select,.short-input{ background:var(--field);color:var(--text);border-color:var(--line); } input::placeholder,textarea::placeholder{color:var(--muted)} input:focus,select:focus,textarea:focus,.wide-input:focus,.message-textarea:focus{border-color:var(--brand);outline-color:color-mix(in srgb,var(--brand) 24%,transparent)} /* Typography and separators. */ .muted,.eyebrow,.label,.mini-process,.app-process,.app-path,.system-note,.coverage-help,.service-description, .usage-time,.shot-meta,.fleet-machine,.control-title,.access-hour,.history-caption,.category-domain-index{color:var(--muted)} .usage-row,.history-row,.app-controls,.control-box,.app-card-footer,.sidebar-bottom,.fleet-edit,.category-domain-row{border-color:var(--line-soft)} /* Brand actions. */ .primary,.takeover-btn,.preview-ok{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)} .primary:hover:not(:disabled),.takeover-btn:hover:not(:disabled){background:var(--brand2);color:var(--brand-ink);border-color:var(--brand2)} .secondary,.theme-toggle{background:var(--field);color:var(--text);border-color:var(--line)} .secondary:hover:not(:disabled),.theme-toggle:hover{border-color:var(--brand);background:var(--brand-soft)} .hero{background:linear-gradient(135deg,var(--brand),var(--brand2));color:var(--brand-ink);box-shadow:var(--shadow)} .hero .eyebrow{color:var(--brand-ink)} /* Semantic states. */ .dot.online,.status-dot.online,.network-guard-badge.on::before,.remote-status-badge.online::before{background:var(--ok)} .status-badge.allowed,.service-status.allowed,.category-domain-status.allowed,.service-reason.allowed{background:var(--ok-soft);color:var(--ok);border-color:var(--ok-line)} .status-badge.blocked,.service-status.blocked,.category-domain-status.blocked,.service-reason.blocked,.danger,.danger-outline{background:color-mix(in srgb,var(--danger) 10%,var(--panel));color:var(--danger);border-color:var(--danger)} .status-badge.scheduled,.remote-status-badge.waiting,.server-note{background:color-mix(in srgb,var(--warn) 10%,var(--panel));color:var(--warn);border-color:var(--warn)} .status-badge.system{background:var(--cell-off);color:var(--muted)} /* Schedule cells: distinction is carried by the outline, not a loud fill. */ .access-cell.allowed,.access-legend i.allowed{background:var(--ok-soft);box-shadow:inset 0 0 0 1px var(--ok-line)} .access-cell.blocked,.access-legend i.blocked{background:var(--cell-off);box-shadow:inset 0 0 0 1px var(--line-soft)} .access-row-label.selected{color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,transparent)} .access-day,.access-unlimited-toggle,.access-autosave-head{background:var(--field);border-color:var(--line);color:var(--text)} .access-day.selected{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)} /* Small decorative surfaces use the same token contract. */ .progress,.history-bar-track{background:var(--cell-off)} .progress span,.history-bar-fill{background:var(--brand)} .app-icon-img,.stats-app-icon,.app-row-icon,.shot img{background:var(--field)} .app-icon-fallback,.stats-app-fallback,.app-row-fallback,.coverage-system-icon{background:var(--brand-soft);color:var(--brand)} .token,.network-domain-chip,.service-domain-chips span,.network-rule-chips>span:not(.muted){background:var(--brand-soft);color:var(--brand);border-color:var(--line)} .toast{background:var(--text);color:var(--bg);box-shadow:var(--shadow)} .login-overlay{background:color-mix(in srgb,var(--sidebar) 80%,transparent)} ::selection{background:var(--brand);color:var(--brand-ink)} *{scrollbar-color:var(--line) var(--bg)} /* Brand artwork is never recolored by CSS. */ .sidebar-logo,.login-logo,.topbar-mark,.network-title-mark,.network-shield-wrap img{filter:none} /* ===== NESTRA VISUAL SEPARATION PASS v2 ===== */ /* Stronger page/card hierarchy without changing layout or JS hooks. */ .card,.panel,.app-card,.shot,.login-card,.notification-preview,.preview-body-card, .access-slider-card,.access-status-card,.access-bonus-card,.access-schedule-panel,.access-limit-panel, .app-stats-chart-panel,.app-stats-list-panel,.app-table-panel,.network-rules-panel,.pairing-panel, .preview-panel,.profile-sync-panel,.remote-panel,.screenshot-browser-panel,.screenshot-settings-panel, .server-panel,.shot-history-panel,.web-list-panel,.web-settings-panel,.category-catalog-card,.coverage-card, .fleet-device-card,.modal-card,.network-category-card,.network-master-card,.network-settings-card, .profile-editor-card,.screenshot-modal-card,.service-card,.shot-calendar-card,.shot-history-search-card{ background:var(--panel); border:1px solid var(--line); box-shadow:var(--shadow), inset 0 1px 0 color-mix(in srgb,var(--text) 5%,transparent); } /* Nested areas must read as a second level, not disappear into the card. */ .message-template-box,.placeholder-insert,.preview-body-card,.coverage-card,.service-reason, .network-category-card,.shot-history-search-card,.shot-calendar-card,.access-slider-card, .access-status-card,.access-bonus-card,.fleet-edit,.server-note,.apps-summary span, .smart-picker-menu,.locale-menu{ background:var(--panel-2); } /* Fields stay visually separate from both page and cards. */ input,select,textarea,.wide-input,.message-textarea,.shot-select,.short-input{ background:var(--field); border-color:var(--line); box-shadow:inset 0 1px 2px color-mix(in srgb,var(--text) 7%,transparent); } /* Stronger card edges and active navigation. */ .nav.active{ background:color-mix(in srgb,var(--brand) 22%,var(--sidebar)); border-color:color-mix(in srgb,var(--brand) 72%,var(--line)); box-shadow:inset 3px 0 0 var(--brand),0 8px 20px -16px color-mix(in srgb,var(--brand) 60%,transparent); } .profile-chip.active,.access-day.selected{ box-shadow:0 0 0 1px var(--brand),0 8px 22px -16px color-mix(in srgb,var(--brand) 70%,transparent); } /* Keep cards readable on large empty pages. */ .dashboard-grid>.panel,.fleet-grid,.access-schedule-panel,.network-rules-panel,.message-editor,.preview-panel{ border-color:color-mix(in srgb,var(--line) 88%,var(--text)); } /* Brand artwork gets a neutral plate so the blue shield never disappears. */ .topbar-mark,.network-title-mark{ background:var(--logo-surface); border:1px solid var(--logo-line); border-radius:12px; padding:4px; box-shadow:0 8px 22px -14px color-mix(in srgb,var(--text) 35%,transparent); } .network-shield-wrap{ background:var(--logo-surface); border-color:var(--logo-line); box-shadow:0 12px 28px -18px color-mix(in srgb,var(--text) 45%,transparent); } .preview-header>img,.notification-preview>img{ background:var(--logo-surface); border:1px solid var(--logo-line); border-radius:16px; padding:8px; box-shadow:0 10px 24px -16px color-mix(in srgb,var(--text) 45%,transparent); } .sidebar-logo{ filter:drop-shadow(0 10px 22px color-mix(in srgb,var(--brand2) 32%,transparent))!important; } /* Preview header also needs separation from the preview body. */ .preview-header{ background:var(--panel-2)!important; border-bottom:1px solid var(--line); } .notification-preview{background:var(--panel)!important;} /* Schedule: allowed/blocked cells must remain clearly distinguishable. */ .access-cell.allowed,.access-legend i.allowed{ background:var(--ok-soft); box-shadow:inset 0 0 0 1px var(--ok-line),0 2px 4px color-mix(in srgb,var(--text) 8%,transparent); } .access-cell.blocked,.access-legend i.blocked{ background:var(--cell-off); box-shadow:inset 0 0 0 1px var(--line); } /* Dark and gold need a little more local contrast in the top bar and large panels. */ html[data-theme="dark"] .topbar,html[data-theme="gold"] .topbar{ background:color-mix(in srgb,var(--panel) 88%,var(--bg)); } html[data-theme="dark"] .hero,html[data-theme="gold"] .hero{ box-shadow:0 18px 46px -20px color-mix(in srgb,var(--brand) 46%,transparent); } /* Light theme: avoid white-on-white cards. */ html[data-theme="light"] .panel,html[data-theme="light"] .card,html[data-theme="light"] .fleet-device-card, html[data-theme="light"] .network-master-card,html[data-theme="light"] .network-settings-card, html[data-theme="light"] .notification-preview{ box-shadow:0 12px 30px -18px rgba(30,58,90,.32), inset 0 1px 0 rgba(255,255,255,.9); } /* THEME SEPARATION V3 — sidebar active item readability */ /* Keep the decorative overlay below the actual navigation content. */ .nav::before{z-index:0;pointer-events:none;} .nav>*{position:relative;z-index:1;} /* Active navigation must be unmistakable and readable in every theme. */ .nav.active, .nav.active:hover{ background:var(--brand)!important; color:var(--brand-ink)!important; border-color:var(--brand)!important; box-shadow:inset 3px 0 0 color-mix(in srgb,var(--brand-ink) 34%,transparent),0 8px 22px -14px color-mix(in srgb,var(--brand) 75%,transparent)!important; } .nav.active::before{opacity:0!important;} .nav.active .nav-icon, .nav.active>span, .nav.active strong, .nav.active .nav-label{ color:var(--brand-ink)!important; } .nav.active::after{ background:var(--brand-ink)!important; box-shadow:none!important; } .nav.active .nav-new{ color:var(--brand-ink)!important; border-color:color-mix(in srgb,var(--brand-ink) 42%,transparent)!important; background:color-mix(in srgb,var(--brand-ink) 12%,transparent)!important; } /* Hover remains visible but clearly weaker than the selected page. */ .nav:not(.active):hover{ background:color-mix(in srgb,var(--brand) 18%,var(--sidebar))!important; color:var(--brand2)!important; } /* ===== NESTRA THEME SEPARATION V4: dashboard activity + Network Guard service icons ===== */ /* Dashboard / Ostatnie 7 dni: keep the track neutral and give actual usage a controlled themed palette. */ .history-bar-item{--history-accent:var(--chart-a)} .history-bar-item:nth-child(4n+2){--history-accent:var(--chart-b)} .history-bar-item:nth-child(4n+3){--history-accent:var(--chart-c)} .history-bar-item:nth-child(4n+4){--history-accent:var(--chart-d)} .history-bar-track{ background:var(--cell-off); border-color:color-mix(in srgb,var(--line) 84%,var(--history-accent)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--history-accent) 7%,transparent); } .history-bar-track>span{ background:linear-gradient(180deg,var(--history-accent),color-mix(in srgb,var(--history-accent) 72%,var(--bg))); box-shadow:0 0 18px color-mix(in srgb,var(--history-accent) 32%,transparent); } .history-bar-item:first-child .history-bar-track{ border-color:color-mix(in srgb,var(--chart-a) 68%,var(--line)); box-shadow:0 0 0 1px color-mix(in srgb,var(--chart-a) 14%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--chart-a) 10%,transparent); } .history-bar-item strong{color:var(--text);font-weight:900} .history-bar-item small{color:var(--muted);font-weight:750} /* Network Guard: make YouTube immediately recognisable as a service, not a generic play glyph. */ .youtube-mark{ position:relative; isolation:isolate; overflow:hidden; width:52px; height:38px; border-radius:12px; background:var(--youtube); color:transparent; font-size:0; border:1px solid color-mix(in srgb,var(--youtube) 72%,var(--field)); box-shadow:0 8px 20px color-mix(in srgb,var(--youtube) 30%,transparent); } .youtube-mark::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,color-mix(in srgb,var(--youtube-ink) 14%,transparent),transparent 58%); pointer-events:none; } .youtube-mark::after{ content:""; position:absolute; left:50%; top:50%; transform:translate(-42%,-50%); width:0; height:0; border-top:8px solid transparent; border-bottom:8px solid transparent; border-left:13px solid var(--youtube-ink); filter:drop-shadow(0 1px 1px color-mix(in srgb,var(--sidebar) 28%,transparent)); } .service-card-head{align-items:center} .youtube-card .service-card-head h2{font-weight:900} .youtube-card .label{color:color-mix(in srgb,var(--youtube) 58%,var(--text))} /* Keep the small service/favicon treatment readable in all three themes. */ .site-mark.youtube, .network-domain-chip .site-mark.youtube{ background:var(--youtube)!important; color:var(--youtube-ink)!important; border-color:color-mix(in srgb,var(--youtube) 72%,var(--field))!important; } /* ===== NESTRA THEME SEPARATION V5 ===== 1) Selected theme button: high-contrast in Light / Dark / Gold. 2) Canonical Network Guard browser icon cards: same artwork for every profile. */ .theme-segment button.active, .theme-segment button[aria-pressed="true"]{ background:var(--brand)!important; color:var(--brand-ink)!important; box-shadow: 0 0 0 1px color-mix(in srgb,var(--brand) 78%,var(--text)), 0 6px 16px -7px color-mix(in srgb,var(--brand) 82%,transparent), inset 0 1px 0 color-mix(in srgb,var(--brand-ink) 26%,transparent)!important; text-shadow:none!important; opacity:1!important; } .theme-segment button.active .theme-choice-icon, .theme-segment button[aria-pressed="true"] .theme-choice-icon{ color:var(--brand-ink)!important; } .theme-segment button.active:hover, .theme-segment button[aria-pressed="true"]:hover{ background:color-mix(in srgb,var(--brand) 88%,var(--brand2))!important; color:var(--brand-ink)!important; transform:none!important; } /* Unselected choices stay readable, but clearly secondary. */ .theme-segment button:not(.active):not([aria-pressed="true"]){ color:var(--text)!important; opacity:.78; } .theme-segment button:not(.active):not([aria-pressed="true"]):hover{ opacity:1; background:var(--brand-soft)!important; color:var(--text)!important; } /* Coverage icons are deliberately neutral and untinted. app-v0.5.js now supplies one canonical brand icon per browser, independent of the currently selected child/profile/device. */ .coverage-icon-slot .browser-canonical-icon{ filter:none!important; opacity:1!important; background:transparent!important; mix-blend-mode:normal!important; } html[data-theme="gold"] .coverage-icon-slot .browser-canonical-icon, html[data-theme="dark"] .coverage-icon-slot .browser-canonical-icon, html[data-theme="light"] .coverage-icon-slot .browser-canonical-icon{ filter:none!important; } /* ===== NESTRA THEME V7 — canonical Edge + Games/WebView icons ===== */ /* Edge no longer depends on a remote CDN, so a broken-image/fallback E cannot appear. */ .coverage-icon-slot .browser-edge-canonical{ width:42px!important; height:42px!important; max-width:42px!important; max-height:42px!important; display:grid!important; place-items:center!important; overflow:visible!important; background:transparent!important; border:0!important; box-shadow:none!important; } .coverage-icon-slot .browser-edge-canonical svg{ width:40px!important; height:40px!important; display:block!important; overflow:visible!important; } /* Stable blue game tile in every theme/profile — modeled on the clearest Dominika card. */ .coverage-system-icon.coverage-games-canonical{ width:44px!important; height:44px!important; min-width:44px!important; min-height:44px!important; border-radius:12px!important; background:#0b79d0!important; color:#ffffff!important; border:1px solid #2fa5ff!important; box-shadow:0 7px 18px rgba(0,92,170,.28)!important; } .coverage-system-icon.coverage-games-canonical svg{ width:35px!important; height:35px!important; display:block!important; } html[data-theme="light"] .coverage-system-icon.coverage-games-canonical, html[data-theme="dark"] .coverage-system-icon.coverage-games-canonical, html[data-theme="gold"] .coverage-system-icon.coverage-games-canonical{ background:#0b79d0!important; color:#ffffff!important; border-color:#2fa5ff!important; } .editable-coverage .coverage-item:not(:has(input:checked)) .coverage-system-icon.coverage-games-canonical{ opacity:.62!important; filter:saturate(.72)!important; } .notification-toggle.notification-enabled{border-color:var(--ok-line);background:var(--ok-soft);color:var(--ok)} .notification-toggle[disabled]{opacity:.6;cursor:not-allowed} /* ===== ETAP 9 — parent notification centre =============================== */ .topbar{position:relative;z-index:20;} .notification-menu-wrap{position:relative;display:flex;z-index:12;} .notification-toggle{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:154px;} .notification-bell-icon{width:18px;height:18px;display:inline-grid;place-items:center;flex:0 0 auto;} .notification-bell-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;} .notification-badge{position:absolute;top:-7px;right:-7px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;display:grid;place-items:center;background:var(--danger);color:#fff;border:2px solid var(--panel);font-size:10px;line-height:1;font-weight:900;box-shadow:0 5px 14px color-mix(in srgb,var(--danger) 35%,transparent);} .notification-badge[hidden]{display:none;} .notification-toggle.has-unread{border-color:var(--brand);color:var(--brand);box-shadow:0 0 0 1px color-mix(in srgb,var(--brand) 24%,transparent),0 8px 22px color-mix(in srgb,var(--brand) 24%,transparent);} .notification-toggle.has-unread .notification-bell-icon{animation:nestra-bell-bounce 1.2s ease-in-out infinite;transform-origin:50% 8%;} @keyframes nestra-bell-bounce{ 0%,100%{transform:translateY(0) rotate(0deg)} 10%{transform:translateY(-3px) rotate(13deg)} 20%{transform:translateY(0) rotate(-11deg)} 30%{transform:translateY(-2px) rotate(8deg)} 40%{transform:translateY(0) rotate(-5deg)} 52%,100%{transform:translateY(0) rotate(0deg)} } .notification-center{position:absolute;right:0;top:calc(100% + 11px);z-index:20;width:min(430px,calc(100vw - 28px));padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 55px color-mix(in srgb,var(--text) 26%,transparent);color:var(--text);} .notification-center.hidden{display:none;} .notification-center::before{content:"";position:absolute;right:27px;top:-7px;width:13px;height:13px;background:var(--panel);border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg);} .notification-center-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 2px 13px;border-bottom:1px solid var(--line);} .notification-center-head>div{display:grid;gap:4px;min-width:0;} .notification-center-head strong{font-size:15px;} .notification-center-head small{font-size:10px;color:var(--muted);} .notification-center-head button{font-size:10px;white-space:nowrap;} .notification-list{display:grid;gap:9px;max-height:min(480px,calc(100vh - 180px));overflow:auto;padding:11px 2px 2px;scrollbar-width:thin;} .notification-item{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;padding:12px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft));transition:border-color .18s,background .18s,transform .18s;} .notification-item:hover{border-color:var(--brand);transform:translateY(-1px);} .notification-item.is-unread{border-color:color-mix(in srgb,var(--brand) 72%,var(--line));box-shadow:inset 3px 0 0 var(--brand);} .notification-item-icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);} .notification-item-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;} .notification-item-copy{min-width:0;display:grid;gap:6px;} .notification-item-top{display:flex;align-items:center;justify-content:space-between;gap:8px;} .notification-item-top strong{font-size:12px;} .notification-new-label{border:1px solid var(--brand);border-radius:999px;padding:3px 6px;color:var(--brand);font-size:8px;font-weight:900;letter-spacing:.06em;} .notification-item-child{display:flex;align-items:center;gap:8px;min-width:0;} .notification-item-child strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .notification-item-child span{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .notification-item-request{margin:0;color:var(--brand);font-size:18px;font-weight:900;} .notification-item-message{margin:0;color:var(--muted);font-size:11px;line-height:1.4;overflow-wrap:anywhere;} .notification-item-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:1px;} .notification-item-meta time{color:var(--muted);font-size:10px;} .notification-item-meta button,.notification-item-actions button{font-size:10px;} .notification-item-actions{display:flex;justify-content:flex-end;gap:7px;padding-top:5px;border-top:1px solid var(--line);} .notification-empty{display:grid;justify-items:center;gap:7px;padding:24px 12px;text-align:center;color:var(--muted);} .notification-empty-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--ok-line);background:var(--ok-soft);color:var(--ok);font-weight:900;} .notification-empty strong{color:var(--text);font-size:13px;} .notification-empty small{font-size:11px;line-height:1.45;max-width:290px;} @media(prefers-reduced-motion:reduce){.notification-toggle.has-unread .notification-bell-icon{animation:none;}.notification-item{transition:none;}} @media(max-width:760px){ .notification-toggle{min-width:auto;padding-left:10px;padding-right:10px;} .notification-toggle>span:nth-child(2){display:none;} .notification-center{right:-7px;width:min(390px,calc(100vw - 22px));} .notification-center-head{align-items:flex-start;flex-direction:column;} .notification-center-head button{width:100%;} } .account-settings-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:18px;max-width:980px}.account-password-panel,.account-details-panel{padding:24px}.account-password-form{display:grid;gap:9px;max-width:520px;margin-top:20px}.account-password-form .primary{justify-self:start;margin-top:8px}.password-requirement{color:var(--muted);font-size:12px;margin:2px 0 8px}.account-detail-row{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--line-soft);font-size:13px}.account-detail-row span{color:var(--muted)}.account-detail-row strong{text-align:right;overflow-wrap:anywhere}.account-security-note{margin-top:22px;padding:13px 14px;border:1px solid var(--line);border-radius:10px;color:var(--muted);font-size:12px;line-height:1.5;background:color-mix(in srgb,var(--panel) 92%,var(--brand-soft))} @media(max-width:800px){.account-settings-grid{grid-template-columns:1fr}.account-detail-row{display:grid;gap:4px}.account-detail-row strong{text-align:left}} /* ETAP 6 account security */ .security-stack{display:grid;gap:12px;margin-top:14px} .security-secret-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap} .security-secret-row code{display:block;max-width:100%;overflow-wrap:anywhere;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2,rgba(127,127,127,.08));font-size:13px} .security-list{display:grid;gap:10px;margin-top:14px} .security-list-row{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2,rgba(127,127,127,.05))} .security-list-row>div{min-width:0;display:grid;gap:4px} .security-list-row small{display:block;color:var(--muted);overflow-wrap:anywhere} .security-agent{max-width:680px} .security-ok{color:#2d9d63} .security-warn{color:#d88a1d} .danger-soft{border-color:rgba(210,70,70,.45)} #mfaRecoveryCodeList{white-space:pre-wrap;word-break:break-word;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2,rgba(127,127,127,.08));font-size:14px;line-height:1.6} @media(max-width:720px){.security-list-row{flex-direction:column}.security-list-row button{width:100%}} .screenshot-modal-nav{position:absolute;top:50%;z-index:4;transform:translateY(-50%);width:58px;height:76px;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,var(--panel) 82%,transparent);color:var(--text);font-size:52px;line-height:1;display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 28px color-mix(in srgb,var(--text) 16%,transparent);backdrop-filter:blur(6px)} .screenshot-modal-nav:hover{background:var(--accent);color:#fff}.screenshot-modal-nav:disabled{opacity:.25;cursor:default}.screenshot-modal-prev{left:16px}.screenshot-modal-next{right:16px} @media(max-width:680px){.screenshot-modal-nav{width:44px;height:60px;font-size:40px}.screenshot-modal-prev{left:6px}.screenshot-modal-next{right:6px}} /* Keep the hourly application SVG inside its chart column. */ .hour-column{min-width:0;min-height:0;overflow:hidden} .hour-stack{position:relative;min-width:0;min-height:0;overflow:hidden} .hour-stack-svg{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:100%;max-height:100%;min-width:0;min-height:0;overflow:hidden} .mfa-qr-block{display:grid;gap:10px;justify-items:start}.mfa-qr-title{font-weight:700}.mfa-qr-code{display:block;width:220px;height:220px;max-width:100%;padding:12px;border-radius:14px;background:#fff;border:1px solid var(--line);image-rendering:pixelated} /* Standalone authentication screen after logout. */ body.auth-logged-out{overflow:auto;} /* Hide the protected shell only while the logged-out screen is actually visible. This also makes login robust against an older cached JS bundle which may hide #login successfully before removing auth-logged-out from . */ body.auth-logged-out:has(>#login:not(.hidden))>.sidebar, body.auth-logged-out:has(>#login:not(.hidden))>main{ display:none!important; } body.auth-logged-out:has(>#login:not(.hidden)) .login-overlay.auth-shell{ position:fixed!important; inset:0!important; width:100vw!important; min-height:100vh!important; z-index:10000!important; background:var(--bg); backdrop-filter:none; } /* ===== FIX25.9 VISIBILITY PASS: LOGOUT + TOGGLES ===== */ .logout-danger{ color:#fff!important; border-color:color-mix(in srgb,var(--danger) 78%,#000 0%)!important; background:linear-gradient(180deg,color-mix(in srgb,var(--danger) 84%,#000 0%),color-mix(in srgb,var(--danger) 68%,#000 18%))!important; box-shadow:0 7px 18px color-mix(in srgb,var(--danger) 24%,transparent)!important; } .logout-danger:hover:not(:disabled){ color:#fff!important; border-color:color-mix(in srgb,var(--danger) 92%,#fff 8%)!important; background:linear-gradient(180deg,color-mix(in srgb,var(--danger) 94%,#fff 6%),var(--danger))!important; box-shadow:0 9px 24px color-mix(in srgb,var(--danger) 34%,transparent)!important; transform:translateY(-1px); } .logout-danger:active:not(:disabled){transform:translateY(0);filter:brightness(.92);} /* Shared high-contrast switch language across light / dark / gold */ .nestra-toggle{min-width:48px;justify-content:center;} .nestra-toggle span{ width:46px; height:24px; border:1px solid color-mix(in srgb,var(--line) 82%,var(--text) 18%); background:color-mix(in srgb,var(--field) 84%,var(--panel) 16%); box-shadow:inset 0 2px 5px color-mix(in srgb,#000 18%,transparent),0 0 0 1px color-mix(in srgb,var(--text) 4%,transparent); } .nestra-toggle span::after{ width:18px; height:18px; top:2px; left:3px; background:color-mix(in srgb,var(--text) 92%,#fff 8%); box-shadow:0 2px 7px color-mix(in srgb,#000 30%,transparent); } .nestra-toggle input:checked+span{ background:linear-gradient(135deg,color-mix(in srgb,var(--ok) 82%,var(--brand) 18%),var(--ok)); border-color:color-mix(in srgb,var(--ok) 78%,#fff 22%); box-shadow:0 0 0 1px color-mix(in srgb,var(--ok) 20%,transparent),0 0 15px color-mix(in srgb,var(--ok) 28%,transparent); } .nestra-toggle input:checked+span::after{left:24px;background:#fff;} .nestra-toggle input:focus-visible+span{outline:2px solid var(--brand);outline-offset:3px;} .nestra-toggle input:disabled+span{opacity:.36;filter:saturate(.45);cursor:not-allowed;} /* Semantic app controls */ .app-toggle-schedule input:checked+span{ background:linear-gradient(135deg,color-mix(in srgb,var(--brand) 82%,#fff 4%),var(--brand2)); border-color:color-mix(in srgb,var(--brand) 76%,#fff 24%); box-shadow:0 0 14px color-mix(in srgb,var(--brand) 30%,transparent); } .app-toggle-limit input:checked+span{ background:linear-gradient(135deg,color-mix(in srgb,var(--warn) 88%,#fff 4%),var(--warn)); border-color:color-mix(in srgb,var(--warn) 74%,#fff 26%); box-shadow:0 0 14px color-mix(in srgb,var(--warn) 28%,transparent); } .app-table-row:hover .nestra-toggle span{border-color:color-mix(in srgb,var(--line) 60%,var(--text) 40%);} /* Network Guard gets a stronger master control */ .master-switch{min-width:138px;gap:9px;} .master-switch-track{ width:88px; height:42px; border:1px solid color-mix(in srgb,var(--line) 78%,var(--text) 22%); background:color-mix(in srgb,var(--field) 86%,var(--panel) 14%); box-shadow:inset 0 3px 8px color-mix(in srgb,#000 24%,transparent),0 0 0 1px color-mix(in srgb,var(--text) 5%,transparent); } .master-switch-track::after{ width:32px; height:32px; left:4px; top:4px; background:color-mix(in srgb,var(--text) 94%,#fff 6%); box-shadow:0 3px 10px color-mix(in srgb,#000 34%,transparent); } .master-switch input:checked+.master-switch-track{ background:linear-gradient(135deg,color-mix(in srgb,var(--ok) 84%,var(--brand) 16%),var(--ok)); border-color:color-mix(in srgb,var(--ok) 78%,#fff 22%); box-shadow:0 0 0 1px color-mix(in srgb,var(--ok) 22%,transparent),0 0 24px color-mix(in srgb,var(--ok) 34%,transparent); } .master-switch input:checked+.master-switch-track::after{left:50px;background:#fff;} .master-switch strong{ font-size:11px; font-weight:900; letter-spacing:.04em; color:var(--muted); padding:3px 8px; border-radius:999px; border:1px solid var(--line); background:color-mix(in srgb,var(--field) 82%,var(--panel) 18%); } .master-switch input:checked~strong{ color:var(--ok); border-color:var(--ok-line); background:var(--ok-soft); } .master-switch input:focus-visible+.master-switch-track{outline:2px solid var(--brand);outline-offset:3px;} /* Per-theme tuning */ html[data-theme="light"] .nestra-toggle span, html[data-theme="light"] .master-switch-track{ background:#dce8f3; border-color:#9eb5c9; } html[data-theme="light"] .nestra-toggle span::after, html[data-theme="light"] .master-switch-track::after{background:#fff;} html[data-theme="light"] .logout-danger{color:#fff!important;} html[data-theme="gold"] .app-toggle-schedule input:checked+span{ background:linear-gradient(135deg,#d9a928,#f0c95e); border-color:#f1d482; } html[data-theme="gold"] .app-toggle-limit input:checked+span{ background:linear-gradient(135deg,#b97922,#e0a33e); border-color:#efc16c; } html[data-theme="gold"] .master-switch input:checked+.master-switch-track, html[data-theme="gold"] .app-toggle-allowed input:checked+span{ background:linear-gradient(135deg,#6f9f59,#9ec27a); border-color:#bdd89f; } /* ===== FIX25.11 LIGHT THEME: APPLICATIONS CONTRAST ===== */ html[data-theme="light"] .app-table-panel{ background:#f7fbff; border-color:#b9cde1!important; box-shadow:0 10px 28px rgba(31,66,103,.08); } html[data-theme="light"] .app-list-settings{ background:#f3f8fd; border:1px solid #c8d8e8; border-radius:13px; padding:14px 16px; margin-bottom:14px; } html[data-theme="light"] .full-control-note{ background:#eef6ff; border-color:#bfd4e8; color:#4a6785; } html[data-theme="light"] .app-filter-line input{ background:#fff; border-color:#a9bed3; color:#173958; box-shadow:inset 0 1px 2px rgba(0,0,0,.04); } html[data-theme="light"] .app-filter-line input:focus{ outline:none; border-color:#4d95da; box-shadow:0 0 0 3px rgba(77,149,218,.16); } html[data-theme="light"] .apps-summary span{ background:#fff!important; border-color:#adc3d9!important; color:#486682; box-shadow:0 1px 2px rgba(18,52,84,.04); } html[data-theme="light"] .apps-summary strong{color:#123756;} html[data-theme="light"] .app-list-columns{ color:#4d6b88; border-bottom-color:#b8ccdf; } html[data-theme="light"] .app-table-row-wrap{ border-bottom-color:#c8d8e8; } html[data-theme="light"] .app-table-row{ background:#fff; transition:background .16s,border-color .16s,box-shadow .16s; } html[data-theme="light"] .app-table-row:hover{ background:#f2f8fe; box-shadow:inset 0 0 0 1px rgba(101,151,202,.13); } html[data-theme="light"] .app-row-icon, html[data-theme="light"] .app-row-fallback{ background:linear-gradient(180deg,#fff,#eef5fb); border:1px solid #cbdceb; box-shadow:0 4px 12px rgba(30,61,92,.10); } html[data-theme="light"] .app-row-identity strong{ color:#102f4c; } html[data-theme="light"] .app-row-identity span, html[data-theme="light"] .app-row-identity small{ color:#5d7791; } html[data-theme="light"] .nestra-toggle span{ background:linear-gradient(180deg,#dbe6f0,#cad8e5); border-color:#93adc6; box-shadow:inset 0 1px 3px rgba(0,0,0,.08),0 1px 1px rgba(255,255,255,.7); } html[data-theme="light"] .nestra-toggle span::after{ background:#fff; box-shadow:0 2px 6px rgba(30,53,76,.22); } html[data-theme="light"] .app-toggle-allowed input:checked+span{ background:linear-gradient(135deg,#61c389,#31ad69); border-color:#258b55; box-shadow:0 0 0 3px rgba(49,173,105,.13); } html[data-theme="light"] .app-toggle-schedule input:checked+span{ background:linear-gradient(135deg,#63b7ff,#2e8edf); border-color:#2878bd; box-shadow:0 0 0 3px rgba(46,142,223,.13); } html[data-theme="light"] .app-toggle-limit input:checked+span{ background:linear-gradient(135deg,#f0c65d,#d9991d); border-color:#ad7615; box-shadow:0 0 0 3px rgba(217,153,29,.14); } html[data-theme="light"] .app-table-row .secondary{ background:#fff; border-color:#9eb7d0; color:#183b5e; box-shadow:0 1px 2px rgba(24,59,94,.04); } html[data-theme="light"] .app-table-row .secondary:hover:not(:disabled){ background:#edf6ff; border-color:#5b9bd8; color:#103454; box-shadow:0 6px 16px rgba(35,91,145,.10); } html[data-theme="light"] .app-row-details{ background:#eef5fb; border-top:1px solid #c8d8e8; } /* ===== FIX26.2 MOBILE PANEL / ANDROID WEBVIEW ===== */ @media(max-width:760px){ html,body{max-width:100%;overflow-x:hidden;} body{font-size:14px;} .sidebar{ width:64px!important; padding:14px 6px 12px!important; } .sidebar>.sidebar-logo{ width:48px!important; height:48px!important; margin:0 auto 12px!important; } .sidebar nav{gap:6px!important;} .nav{ min-height:52px!important; padding:8px 6px!important; border-radius:12px!important; } .nav-icon{ width:23px!important; height:23px!important; } .sidebar-bottom{ font-size:0!important; justify-content:center!important; padding:10px 0!important; } .sidebar-bottom .dot{margin:0!important;} main{ margin-left:64px!important; width:calc(100% - 64px)!important; max-width:calc(100% - 64px)!important; min-width:0!important; } .topbar{ width:100%!important; min-width:0!important; padding:10px 10px!important; gap:8px!important; overflow-x:auto!important; overflow-y:visible!important; flex-wrap:nowrap!important; scrollbar-width:none; -webkit-overflow-scrolling:touch; } .topbar::-webkit-scrollbar{display:none;} .device-brand-row,.topbar-selectors,.topbar-actions{ min-width:0!important; flex:0 0 auto!important; gap:7px!important; } .topbar-profile-select{display:none!important;} .topbar-device-select{min-width:0!important;} .device-smart-picker{ width:168px!important; min-width:168px!important; } .smart-picker-summary{ min-height:48px!important; padding:7px 9px!important; } .smart-picker-copy strong{font-size:11px!important;} .smart-picker-copy small{font-size:8px!important;} .topbar .eyebrow{font-size:8px!important;letter-spacing:.1em!important;} .takeover-btn{min-height:44px!important;padding:8px 12px!important;white-space:nowrap!important;} .theme-segment{min-height:44px!important;flex:0 0 auto!important;} .theme-segment button{min-width:38px!important;padding:7px!important;} .theme-segment button>span:last-child{display:none!important;} .global-locale-switch summary{height:44px!important;padding:0 10px!important;} .notification-toggle,.topbar .secondary{min-height:44px!important;} #refreshBtn,#logoutBtn{display:none!important;} .view{ width:100%!important; max-width:100%!important; min-width:0!important; padding:18px 12px 30px!important; box-sizing:border-box!important; overflow:hidden!important; } .view>*, .panel,.card,.hero,.section-head, .dashboard-grid,.cards,.devices-layout,.devices-side-stack,.device-fleet, .message-grid,.network-top-grid,.network-main-grid,.account-settings-grid, .web-lists-grid,.web-settings-panel,.app-table-panel,.app-stats-chart-panel, .access-limit-editor,.access-limit-panel,.access-status-row,.access-schedule-panel, .screenshot-settings-grid,.shot-history-layout,.shot-history-search-card{ min-width:0!important; max-width:100%!important; width:100%!important; box-sizing:border-box!important; } .dashboard-grid,.cards,.devices-layout,.devices-side-stack,.device-fleet, .message-grid,.network-top-grid,.network-main-grid,.account-settings-grid, .web-lists-grid,.access-status-row{ grid-template-columns:1fr!important; } .section-head,.app-head,.network-head,.access-head{ align-items:flex-start!important; gap:10px!important; } .section-head h1,.network-head h1,.app-head h1{ font-size:31px!important; line-height:1.05!important; overflow-wrap:anywhere; } .section-head p,.network-head p,.app-head p{ font-size:13px!important; line-height:1.5!important; } .panel,.card{ padding:16px!important; border-radius:16px!important; } input,select,textarea,button{ max-width:100%; box-sizing:border-box; } input,select,textarea{font-size:16px!important;} .app-table-row,.app-row-details,.fleet-edit{ grid-template-columns:1fr!important; } .app-table-row>*{min-width:0!important;} .app-path,.smart-picker-copy,.stats-app-copy{min-width:0!important;} .hourly-chart-shell{ width:100%!important; overflow-x:auto!important; -webkit-overflow-scrolling:touch; } .hourly-chart{min-width:620px!important;} .access-days{ display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; width:100%!important; } .access-day{ width:100%!important; min-width:0!important; } .access-slider-shell{width:100%!important;overflow:visible!important;} .access-slider-labels{font-size:8px!important;} .access-grid-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch;} .access-grid{min-width:866px!important;} .network-title-row{ display:grid!important; grid-template-columns:58px minmax(0,1fr)!important; gap:12px!important; } .network-title-mark{width:54px!important;height:54px!important;} .network-master-card,.service-card{min-width:0!important;} .coverage-grid{grid-template-columns:1fr!important;} .profile-strip{ width:100%!important; overflow-x:auto!important; -webkit-overflow-scrolling:touch; } .profile-chip{min-width:150px!important;} .fleet-card,.account-password-panel,.account-details-panel, .message-editor,.preview-panel{ min-width:0!important; width:100%!important; } .auth-shell{ height:var(--nestra-vvh,100dvh)!important; min-height:var(--nestra-vvh,100dvh)!important; overflow-y:auto!important; overflow-x:hidden!important; align-items:flex-start!important; padding:10px!important; -webkit-overflow-scrolling:touch; } .auth-stage{ width:100%!important; min-height:0!important; margin:0 auto 36vh!important; border-radius:18px!important; overflow:visible!important; } .login-card.auth-card{ width:100%!important; padding:88px 18px 28px!important; border-radius:18px!important; overflow:visible!important; } .auth-card .login-logo{ width:145px!important; height:auto!important; margin-bottom:20px!important; } .login-locale-switch{top:10px!important;right:10px!important;} .login-theme-segment{top:64px!important;right:10px!important;} .auth-tabs{margin-bottom:22px!important;} .auth-pane input{ min-height:52px!important; font-size:16px!important; } .auth-primary{min-height:50px!important;} .auth-security-note{margin-bottom:24px!important;} } @media(max-width:430px){ .sidebar{width:58px!important;} main{ margin-left:58px!important; width:calc(100% - 58px)!important; max-width:calc(100% - 58px)!important; } .sidebar>.sidebar-logo{width:44px!important;height:44px!important;} .nav{min-height:48px!important;} .device-smart-picker{width:154px!important;min-width:154px!important;} .view{padding-left:10px!important;padding-right:10px!important;} .section-head h1,.network-head h1,.app-head h1{font-size:28px!important;} } /* Explicit parent penalty controls */ .penalty-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:18px;align-items:stretch;} .penalty-status-card,.penalty-control-card{min-height:250px;} .penalty-status-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;} .penalty-status-head h2{margin:8px 0 0;font-size:24px;} .penalty-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:8px 12px;font-size:11px;font-weight:900;letter-spacing:.05em;white-space:nowrap;border:1px solid var(--line);} .penalty-badge.clear{background:var(--ok-soft);border-color:var(--ok-line);color:var(--ok);} .penalty-badge.active{background:color-mix(in srgb,var(--danger) 14%,var(--panel));border-color:var(--danger);color:var(--danger);} .penalty-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px;} .penalty-meta>div{border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--panel-2);} .penalty-meta span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:900;letter-spacing:.06em;margin-bottom:6px;} .penalty-meta strong{font-size:13px;overflow-wrap:anywhere;} .penalty-control-card{display:flex;flex-direction:column;} .penalty-control-card h2{margin:8px 0 10px;} .penalty-control-card .muted{line-height:1.55;} .penalty-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:22px;} .penalty-actions button{min-width:150px;} .penalty-apply{background:var(--danger);border-color:var(--danger);color:#fff;} .penalty-clear{border-color:var(--ok-line);color:var(--ok);} .penalty-action-status{min-height:20px;margin-top:12px;color:var(--muted);font-size:12px;line-height:1.45;} .penalty-explainer{margin-top:18px;} .penalty-explainer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:12px;} .penalty-explainer-grid>div{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--panel-2);} .penalty-explainer-grid strong{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-size:12px;} .penalty-explainer-grid span{font-size:12px;line-height:1.5;color:var(--muted);} @media(max-width:980px){.penalty-grid{grid-template-columns:1fr;}.penalty-explainer-grid{grid-template-columns:1fr;}} @media(max-width:620px){.penalty-status-head{flex-direction:column;}.penalty-meta{grid-template-columns:1fr;}.penalty-actions{flex-direction:column;}.penalty-actions button{width:100%;}} /* ===== FIX: Web Control tab contrast + Shorts dependency ===== */ .web-tabs{ gap:8px; } .web-tab{ color:color-mix(in srgb,var(--text) 82%,var(--muted))!important; opacity:1!important; padding:11px 12px 12px; border-radius:9px 9px 0 0; transition:background .16s ease,color .16s ease,border-color .16s ease; } .web-tab:hover{ color:var(--text)!important; background:color-mix(in srgb,var(--brand) 10%,var(--panel)); } .web-tab.active{ color:var(--text)!important; background:color-mix(in srgb,var(--brand) 18%,var(--panel))!important; text-shadow:none!important; } .web-tab.active::after{ height:3px!important; background:var(--brand)!important; box-shadow:0 0 12px color-mix(in srgb,var(--brand) 42%,transparent)!important; } .web-setting-copy{ display:grid; gap:4px; min-width:0; } .web-setting-note{ display:block; color:color-mix(in srgb,var(--text) 64%,var(--muted)); font-size:10px; line-height:1.4; font-weight:700; } .shorts-setting.guard-required{ padding:10px 12px; margin-left:-12px!important; margin-right:-12px!important; border:1px solid color-mix(in srgb,var(--brand) 58%,var(--line)); border-radius:10px; background:color-mix(in srgb,var(--brand) 10%,var(--panel)); } .shorts-setting.guard-required .web-setting-note{ color:var(--brand); } /* ===== MAIN NOTIFICATION CENTRE V1 ===== */ .notifications-nav .nav-count{ margin-left:auto; min-width:20px; height:20px; padding:0 6px; border-radius:999px; display:grid; place-items:center; background:var(--brand); color:var(--brand-ink); font-style:normal; font-size:9px; font-weight:900; } .notifications-hub-view{max-width:1500px} .notifications-hub-head{align-items:center} .notifications-hub-summary{ min-width:150px; padding:14px 18px; border:1px solid var(--line); border-radius:14px; background:var(--panel); display:grid; gap:2px; text-align:center; } .notifications-hub-summary strong{font-size:26px;color:var(--brand)} .notifications-hub-summary span{font-size:10px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.05em} .notifications-hub-toolbar{ padding:16px 18px; margin-bottom:16px; display:grid; gap:14px; } .notification-hub-tabs{display:flex;gap:8px;flex-wrap:wrap} .notification-hub-tab{ border:1px solid var(--line); background:transparent; color:var(--text); border-radius:999px; padding:8px 13px; font-size:10px; font-weight:850; } .notification-hub-tab.active{ background:var(--brand); color:var(--brand-ink); border-color:var(--brand); } .notification-hub-controls{display:grid;grid-template-columns:220px minmax(280px,1fr);gap:12px} .notification-hub-controls select,.notification-hub-controls input{width:100%} .notification-hub-bulk{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:4px;border-top:1px solid var(--line)} .notification-select-all{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:800;margin-right:auto} .notification-select-all input,.notification-hub-check input{width:18px;height:18px;accent-color:var(--brand)} .notification-delete{border-color:color-mix(in srgb,#e55353 60%,var(--line))!important;color:#ff8e8e!important} .notification-hub-list{display:grid;gap:10px} .notification-hub-row{ display:grid; grid-template-columns:34px 48px minmax(0,1fr) auto; gap:14px; align-items:center; padding:16px 18px; border:1px solid var(--line); border-radius:15px; background:var(--panel); box-shadow:0 8px 24px color-mix(in srgb,var(--text) 10%,transparent); } .notification-hub-row.is-unread{ border-color:color-mix(in srgb,var(--brand) 62%,var(--line)); box-shadow:inset 3px 0 0 var(--brand),0 8px 24px color-mix(in srgb,var(--text) 10%,transparent); } .notification-hub-row.is-pinned{background:color-mix(in srgb,var(--brand) 7%,var(--panel))} .notification-hub-check{display:grid;place-items:center} .notification-hub-icon{ width:42px;height:42px;border-radius:12px;display:grid;place-items:center; background:var(--brand-soft);color:var(--brand);font-size:18px;font-weight:900 } .notification-hub-copy{min-width:0;display:grid;gap:5px} .notification-hub-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .notification-hub-title strong{font-size:13px} .notification-hub-copy p{margin:0;color:var(--text);font-size:12px;line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .notification-hub-copy small{color:var(--muted);font-size:10px} .notification-pin-mark{color:var(--brand);font-size:14px} .notification-hub-actions{display:flex;align-items:center;gap:7px} .notification-hub-actions .notification-hub-delete-one{font-size:17px;color:#ff8e8e} @media(max-width:900px){ .notifications-hub-head{align-items:flex-start} .notification-hub-controls{grid-template-columns:1fr} .notification-hub-row{grid-template-columns:28px 40px minmax(0,1fr)} .notification-hub-actions{grid-column:2/-1;justify-content:flex-end} } /* ===== ANDROID PARENT v0.1.4 MOBILE UI PASS ============================= */ .mobile-device-sheet{display:none} @media(max-width:760px){ /* Header: keep it stable and never clip interactive overlays. */ .topbar{ overflow:visible!important; min-height:76px!important; height:auto!important; padding:9px 8px!important; } .device-brand-row{flex:1 1 auto!important;min-width:0!important} .topbar-selectors{flex:1 1 auto!important;min-width:0!important} .topbar-device-select{width:100%!important} .device-smart-picker{width:100%!important;min-width:142px!important;max-width:190px!important} .smart-picker-summary{height:48px!important;min-height:48px!important} .topbar-mark{display:none!important} .notification-menu-wrap{display:none!important} .topbar-actions{flex:0 0 auto!important;gap:5px!important} .takeover-btn{ min-width:74px!important; min-height:42px!important; padding:7px 9px!important; font-size:10px!important; letter-spacing:.01em!important; } .theme-segment{min-height:42px!important} .theme-segment button{min-width:34px!important;min-height:38px!important;padding:6px!important} .global-locale-switch summary{height:42px!important;min-width:40px!important;padding:0 7px!important} .global-locale-switch .locale-current{display:none!important} /* Dedicated chooser rendered outside the topbar. */ .mobile-device-sheet{ position:fixed; inset:0; z-index:100000; display:grid; align-items:end; } .mobile-device-sheet.hidden{display:none!important} .mobile-device-sheet-backdrop{ position:absolute; inset:0; border:0; border-radius:0; background:rgba(3,13,25,.58); backdrop-filter:blur(3px); } .mobile-device-sheet-card{ position:relative; z-index:1; width:100%; max-height:min(72vh,560px); overflow:auto; padding:16px 14px calc(18px + env(safe-area-inset-bottom)); border:1px solid var(--line); border-radius:22px 22px 0 0; background:var(--panel); box-shadow:0 -18px 48px rgba(0,0,0,.28); } .mobile-device-sheet-head{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; } .mobile-device-sheet-head h2{margin:4px 0 0;font-size:21px} .mobile-device-sheet-close{ width:40px;height:40px;border-radius:50%;border:1px solid var(--line); background:var(--field);color:var(--text);font-size:25px;line-height:1; } .mobile-device-sheet-list{display:grid;gap:8px} .mobile-device-sheet-row{ width:100%; display:grid; grid-template-columns:42px minmax(0,1fr) 28px; align-items:center; gap:11px; min-height:66px; padding:10px 12px; text-align:left; border:1px solid var(--line); border-radius:14px; background:var(--field); color:var(--text); } .mobile-device-sheet-row.active{ border-color:var(--brand); background:color-mix(in srgb,var(--brand) 10%,var(--panel)); box-shadow:inset 3px 0 0 var(--brand); } .mobile-device-sheet-row .smart-device-icon{width:38px;height:38px} .mobile-device-sheet-row>span{display:grid;gap:4px;min-width:0} .mobile-device-sheet-row strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .mobile-device-sheet-row small{font-size:10px;color:var(--muted)} .mobile-device-sheet-row b{color:var(--brand);font-size:17px;text-align:center} /* Global mobile density. */ .view{padding-top:16px!important} .section-head{margin-bottom:14px!important} .section-head h1,.network-head h1,.app-head h1{ margin-top:4px!important; font-size:27px!important; line-height:1.04!important; } .section-head p,.network-head p,.app-head p{font-size:12px!important;line-height:1.45!important} .panel,.card{padding:14px!important;border-radius:15px!important} .hero{ min-height:0!important; padding:20px!important; border-radius:18px!important; gap:12px!important; } .hero h1{font-size:30px!important;line-height:1.05!important;margin:6px 0 8px!important} .hero-time strong{font-size:32px!important} .cards{gap:10px!important;margin:10px 0!important} .cards .card{padding:14px!important} /* Web Control: all four tabs remain visible. */ .web-tabs{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px!important; width:100%!important; overflow:visible!important; border-bottom:0!important; margin-bottom:12px!important; } .web-tab{ width:100%!important; min-height:46px!important; padding:8px!important; border:1px solid var(--line)!important; border-radius:10px!important; white-space:normal!important; line-height:1.15!important; text-align:center!important; font-size:10px!important; } .web-tab.active{border-color:var(--brand)!important} .web-tab.active::after{display:none!important} .browser-chip-row,.web-browser-strip{overflow-x:auto!important;-webkit-overflow-scrolling:touch} /* Application statistics: less legend, more chart. */ .app-stats-chart-panel{padding:13px!important} .stats-legend{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px 10px!important; margin-bottom:12px!important; } .stats-legend>span{ min-width:0!important; overflow:hidden!important; white-space:nowrap!important; text-overflow:ellipsis!important; font-size:10px!important; } .stats-legend-more{ justify-content:center!important; color:var(--brand)!important; font-weight:900!important; } .stats-date-nav{width:100%!important;display:grid!important;grid-template-columns:42px minmax(0,1fr) 42px!important} .stats-date-nav input{width:100%!important} .hourly-chart-shell{margin-top:6px!important} /* Access time: touch targets are easier to grab. */ .access-limit-panel{padding:14px!important} .access-days{gap:8px!important;margin-bottom:16px!important} .access-day{min-height:58px!important;border-radius:14px!important} .access-limit-main{align-items:flex-start!important;gap:10px!important;flex-direction:column!important} .access-limit-actions{width:100%!important;display:grid!important;grid-template-columns:1fr!important;gap:8px!important} .access-unlimited-toggle{width:100%!important;justify-content:center!important;min-height:44px!important} .access-slider-card{padding:14px 12px 16px!important} .access-slider-value-row{margin-bottom:24px!important} .access-slider-hint{display:none!important} .access-slider{height:34px!important} .access-slider::-webkit-slider-thumb{width:30px!important;height:30px!important} .access-slider::-moz-range-thumb{width:30px!important;height:30px!important} .access-slider-labels{font-size:9px!important} /* Penalties: reduce empty vertical space on phone. */ .penalty-grid{gap:12px!important} .penalty-status-card,.penalty-control-card{min-height:0!important} .penalty-status-card{padding:15px!important} .penalty-status-head{gap:10px!important} .penalty-status-head h2{font-size:23px!important;margin-top:4px!important} .penalty-meta{margin-top:14px!important;gap:8px!important} .penalty-meta>div{padding:10px 12px!important} .penalty-control-card{padding:15px!important} .penalty-actions{padding-top:12px!important} /* Network Guard: remove duplicate large logo and tighten the master card. */ .network-title-row{grid-template-columns:48px minmax(0,1fr)!important} .network-title-mark{width:46px!important;height:46px!important} .network-top-grid{gap:10px!important} .network-master-card{ min-height:0!important; padding:15px!important; display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; gap:12px!important; } .network-master-copy{gap:0!important} .network-shield-wrap{display:none!important} .network-master-card h2{font-size:22px!important;margin:3px 0 6px!important} .network-master-card p{font-size:11px!important;line-height:1.48!important} .master-switch{min-width:82px!important} .network-settings-card{padding:14px!important} .network-setting-row{min-height:54px!important} /* Block message templates in one compact row. */ .message-template-box{padding:13px!important} .message-template-buttons{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:6px!important; } .message-template-btn{width:100%!important;min-width:0!important;padding:9px 5px!important;font-size:10px!important} .message-textarea{min-height:150px!important} /* Screenshots settings become compact rows rather than oversized cards. */ .screenshot-settings-panel{padding:13px!important} .screenshot-settings-grid{gap:9px!important} .shot-control{gap:5px!important} .shot-toggle{ min-height:0!important; padding:11px 12px!important; border-radius:12px!important; display:grid!important; grid-template-columns:24px minmax(0,1fr)!important; align-items:start!important; gap:10px!important; } .shot-toggle input{width:20px!important;height:20px!important;margin-top:2px!important} .shot-toggle strong{font-size:12px!important} .shot-toggle small{font-size:10px!important;line-height:1.35!important} .shot-save{min-height:46px!important} .shot-mode-switch{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important} .shot-mode-tab{padding:10px 8px!important} /* Profiles and account forms need less vertical chrome. */ .profile-head-actions{ width:100%!important; display:grid!important; grid-template-columns:1fr 1fr!important; gap:7px!important; } .profile-head-actions #newProfileBtn{grid-column:1/-1!important} .profile-head-actions button{min-height:42px!important;padding:8px 10px!important} .profile-strip{padding-bottom:8px!important} .profile-chip{min-width:135px!important;padding:10px!important} .device-fleet-panel{padding:14px!important} .fleet-head{align-items:center!important;gap:8px!important} .fleet-head #pairDeviceBtn{padding:8px 10px!important;font-size:10px!important} .account-password-panel input{min-height:46px!important} .account-password-panel .form-label{margin-top:13px!important} .account-settings-grid{gap:12px!important} /* Notifications: bulk actions appear only when something is selected. */ .notifications-hub-summary{min-width:118px!important;padding:10px 12px!important} .notifications-hub-toolbar{padding:13px!important;gap:10px!important} .notification-hub-tabs{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important} .notification-hub-tab{width:100%!important;padding:9px 6px!important} .notification-hub-bulk{gap:7px!important} .notification-hub-bulk .secondary{display:none!important} .notification-hub-bulk.has-selection .secondary{display:inline-flex!important} .notification-select-all{width:100%!important;margin-right:0!important} .notification-hub-row{padding:12px!important;gap:9px!important} .notification-hub-copy p{white-space:normal!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden!important} } @media(max-width:430px){ .topbar{padding-left:7px!important;padding-right:7px!important} .device-smart-picker{min-width:138px!important;max-width:150px!important} .takeover-btn{min-width:68px!important;padding-left:7px!important;padding-right:7px!important} .theme-segment button{min-width:32px!important} .global-locale-switch summary{min-width:36px!important} .section-head h1,.network-head h1,.app-head h1{font-size:26px!important} } /* ===== NESTRA BRAND V2 + UI POLISH ====================================== */ .sidebar-logo,.topbar-mark,.network-title-mark,.auth-hero-logo,.login-logo,.preview-header>img{ object-fit:contain; background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; filter:drop-shadow(0 8px 18px rgba(0,0,0,.18))!important; } .sidebar-logo{width:142px!important;max-height:142px!important} .topbar-mark{width:42px!important;height:42px!important} .auth-hero-logo{width:132px!important;height:132px!important;object-fit:contain!important} .auth-card .login-logo{width:126px!important;height:126px!important;margin-bottom:22px!important} .preview-header>img{width:66px!important;height:66px!important} .network-title-mark{width:54px!important;height:54px!important} /* One logo is enough in Network Guard. The second large shield made the card look like a separate product and wasted space on phones. */ .network-shield-wrap{display:none!important} .network-master-copy{grid-template-columns:1fr!important} .network-master-card{min-height:0!important} /* NESTRA itself always uses the project artwork instead of an extracted EXE icon. */ .active-card-icon.nestra-brand-app{ background:#030b16!important; border-color:#139cff!important; box-shadow:0 8px 22px rgba(19,156,255,.18)!important; } .active-card-icon.nestra-brand-app .active-app-icon-img{ width:45px!important;height:45px!important;border-radius:0!important; } .nestra-brand-img{ object-fit:contain!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; } /* Replace OS-dependent emoji with the same line icon language as the sidebar. */ .panel-title-icon>span.panel-line-icon{ color:var(--brand)!important; background:color-mix(in srgb,var(--brand) 9%,var(--panel))!important; border-color:color-mix(in srgb,var(--brand) 32%,var(--line))!important; } .panel-line-icon svg{ width:18px;height:18px; fill:none;stroke:currentColor;stroke-width:1.8; stroke-linecap:round;stroke-linejoin:round; } /* Cleaner density for account/security cards visible in the Android app. */ .account-settings-grid{gap:14px!important} .account-password-panel,.account-details-panel,.account-security-panel{padding:18px!important} .account-password-panel .muted,.account-security-panel .muted{line-height:1.5} .account-password-form{gap:0!important} .account-password-panel .form-label{margin-top:14px!important} .account-detail-row{min-height:48px!important} /* Subtle brand consistency on key status surfaces. */ .hero{ box-shadow:0 16px 36px color-mix(in srgb,var(--brand) 20%,transparent)!important; } .network-guard-badge.on,.penalty-badge.clear{ box-shadow:0 5px 16px color-mix(in srgb,var(--ok) 18%,transparent); } /* Android app gets deterministic branding even if the WebView reports an unusually wide CSS viewport on some Xiaomi/Samsung builds. */ html[data-nestra-android="1"] .network-shield-wrap{display:none!important} html[data-nestra-android="1"] .topbar-mark{display:none!important} html[data-nestra-android="1"] .sidebar-logo{ width:46px!important;height:50px!important;max-height:50px!important; margin:0 auto 10px!important; } html[data-nestra-android="1"] .topbar{ min-height:72px!important; padding:8px 8px!important; } html[data-nestra-android="1"] .device-brand-row{ flex:1 1 auto!important; min-width:0!important; } html[data-nestra-android="1"] .topbar-selectors{ width:100%!important; min-width:0!important; } html[data-nestra-android="1"] .topbar-device-select{ flex:1 1 auto!important; width:100%!important; } html[data-nestra-android="1"] .device-smart-picker{ width:100%!important; max-width:none!important; } html[data-nestra-android="1"] .smart-picker-summary{ min-height:46px!important; border-radius:12px!important; } html[data-nestra-android="1"] .smart-picker-copy strong{ font-size:11px!important; } html[data-nestra-android="1"] .takeover-btn{ min-width:72px!important; min-height:42px!important; padding:7px 8px!important; } html[data-nestra-android="1"] .view{ padding-top:15px!important; } html[data-nestra-android="1"] .section-head h1, html[data-nestra-android="1"] .network-head h1, html[data-nestra-android="1"] .app-head h1{ letter-spacing:-.025em!important; } html[data-nestra-android="1"] .panel-title-icon{ margin-bottom:10px!important; } html[data-nestra-android="1"] .network-title-row{ grid-template-columns:48px minmax(0,1fr)!important; gap:10px!important; } html[data-nestra-android="1"] .network-title-mark{ width:46px!important;height:46px!important; } html[data-nestra-android="1"] .preview-header>img{ width:54px!important;height:54px!important; } @media(max-width:760px){ .sidebar-logo{width:46px!important;height:50px!important} .auth-card .login-logo{width:112px!important;height:112px!important} .auth-hero-logo{width:112px!important;height:112px!important} .network-title-mark{width:46px!important;height:46px!important} .account-password-panel,.account-details-panel,.account-security-panel{padding:14px!important} } /* INTERNET PROTECTION ETAP 3 */ .internet-categories-panel .network-category-summary{grid-template-columns:repeat(auto-fit,minmax(330px,1fr));} .internet-categories-panel .network-derived-title{margin-top:22px;} @media(max-width:720px){ .network-category-card{grid-template-columns:42px minmax(0,1fr) auto;} .network-category-card .open-category-list{grid-column:2/4;justify-self:start;} .network-category-switch{grid-column:3;grid-row:1;} .network-auto-save{white-space:normal;} } /* INTERNET PROTECTION ETAP 4 */ .internet-strict-mode,.internet-service-option{display:flex;align-items:flex-start;gap:11px;margin-top:18px;padding:13px 14px;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--panel) 94%,var(--brand-soft));cursor:pointer;} .internet-strict-mode input,.internet-service-option input{width:17px;height:17px;margin-top:2px;accent-color:var(--brand);flex:0 0 auto;} .internet-strict-mode span,.internet-service-option span{display:grid;gap:3px;} .internet-strict-mode strong,.internet-service-option strong{font-size:11px;color:var(--text);} .internet-strict-mode small,.internet-service-option small{font-size:9.5px;line-height:1.4;color:var(--muted);} .internet-exceptions-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:10px;} .internet-exception-column{border:1px solid var(--line);border-radius:14px;padding:14px;background:color-mix(in srgb,var(--panel) 96%,var(--brand-soft));min-width:0;} .internet-exception-head{display:grid;gap:3px;margin-bottom:10px;} .internet-exception-head strong{font-size:12px;} .internet-exception-head small{font-size:9.5px;line-height:1.4;color:var(--muted);} .internet-exception-column.allow{border-color:var(--ok-line);} .internet-block-message-panel{margin-top:16px;padding:20px;} .internet-block-message-panel .web-message-box{margin-top:10px;} .internet-message-actions{display:flex;justify-content:flex-end;margin-top:10px;} @media(max-width:820px){.internet-exceptions-grid{grid-template-columns:1fr;}} /* INTERNET PROTECTION ETAP 5 */ .internet-services-panel{margin-top:16px;padding:20px;} .internet-service-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:12px;margin-top:14px;} .internet-service-card{border:1px solid var(--line);border-radius:14px;padding:14px;background:color-mix(in srgb,var(--panel) 96%,var(--brand-soft));display:grid;gap:10px;min-width:0;} .internet-service-card.allowed{border-color:var(--ok-line);} .internet-service-card.blocked{border-color:color-mix(in srgb,var(--danger) 55%,var(--line));} .internet-service-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;} .internet-service-card-head>div{display:grid;gap:3px;} .internet-service-card-head strong{font-size:15px;color:var(--text);} .internet-service-reason{font-size:9.5px;color:var(--muted);} .internet-service-card .service-domain-chips{margin-top:0;} .internet-service-card .service-actions{margin-top:2px;} .internet-service-card .service-actions button:disabled{opacity:.45;cursor:default;} /* INTERNET PROTECTION ETAP 6 */ .internet-sync-panel{margin-top:16px;padding:18px 20px;} .internet-sync-head{display:flex;align-items:center;justify-content:space-between;gap:16px;} .internet-sync-head h2{margin:4px 0 0;font-size:17px;} .internet-sync-badge{border:1px solid var(--line);border-radius:999px;padding:7px 10px;font-size:9px;font-weight:900;letter-spacing:.06em;} .internet-sync-badge.synced{color:var(--ok);border-color:var(--ok-line);background:var(--ok-soft);} .internet-sync-badge.pending{color:var(--brand);border-color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,var(--panel));} .internet-sync-badge.offline{color:var(--danger);border-color:var(--danger);background:color-mix(in srgb,var(--danger) 10%,var(--panel));} .internet-sync-grid{display:grid;grid-template-columns:1fr 28px 1fr 28px 1fr;gap:8px;align-items:center;margin-top:14px;} .internet-sync-step{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:center;border:1px solid var(--line);border-radius:13px;padding:11px;background:color-mix(in srgb,var(--panel) 96%,var(--brand-soft));} .internet-sync-step>span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--field);color:var(--text);font-size:10px;font-weight:900;} .internet-sync-step>div{display:grid;gap:2px;min-width:0;} .internet-sync-step small{font-size:8px;font-weight:900;letter-spacing:.08em;color:var(--brand);} .internet-sync-step strong{font-size:11px;color:var(--text);} .internet-sync-step em{font-size:9.5px;color:var(--muted);font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .internet-sync-arrow{text-align:center;color:var(--muted);font-weight:900;} .internet-sync-detail{display:flex;gap:18px;flex-wrap:wrap;margin-top:11px;padding-top:10px;border-top:1px solid var(--line);font-size:9.5px;color:var(--muted);} .internet-sync-detail strong{color:var(--text);} @media(max-width:900px){.internet-sync-grid{grid-template-columns:1fr;}.internet-sync-arrow{transform:rotate(90deg)}} /* INTERNET PROTECTION ETAP 7 */ .internet-diagnostic-panel{margin-top:16px;padding:20px;} .internet-diagnostic-head h2{margin:4px 0 5px;font-size:17px;} .internet-diagnostic-head p{margin:0;color:var(--muted);font-size:10px;line-height:1.5;max-width:900px;} .internet-diagnostic-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-top:14px;} .internet-diagnostic-form input{width:100%;} .internet-diagnostic-result{margin-top:12px;border:1px solid var(--line);border-radius:14px;padding:14px;background:color-mix(in srgb,var(--panel) 96%,var(--brand-soft));font-size:10px;color:var(--muted);} .internet-diagnostic-result.allowed{border-color:var(--ok-line);background:var(--ok-soft);} .internet-diagnostic-result.blocked{border-color:var(--danger);background:color-mix(in srgb,var(--danger) 10%,var(--panel));} .internet-diagnostic-result.warning{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,var(--panel));} .internet-diagnostic-result.error{border-color:var(--danger);color:var(--danger);} .internet-diagnostic-verdict{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px;} .internet-diagnostic-verdict strong{font-size:13px;color:var(--text);} .internet-diagnostic-verdict span{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--brand);font-size:10px;} .internet-diagnostic-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;} .internet-diagnostic-facts>div{display:grid;gap:2px;padding:8px 9px;border:1px solid var(--line);border-radius:10px;background:var(--panel);} .internet-diagnostic-facts span{font-size:8px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:850;} .internet-diagnostic-facts strong{font-size:10px;color:var(--text);overflow:hidden;text-overflow:ellipsis;} .internet-diagnostic-result p{margin:12px 0 0;line-height:1.5;} @media(max-width:650px){.internet-diagnostic-form{grid-template-columns:1fr;}.internet-diagnostic-verdict{align-items:flex-start;flex-direction:column;}} /* INTERNET PROTECTION ETAP 8 */ .internet-temporary-box{border:1px solid var(--line);border-radius:14px;padding:14px;background:color-mix(in srgb,var(--panel) 96%,var(--brand-soft));} .internet-temporary-copy{display:grid;gap:3px;margin-bottom:10px;} .internet-temporary-copy strong{font-size:12px;color:var(--text);} .internet-temporary-copy small{font-size:9.5px;color:var(--muted);line-height:1.4;} .internet-temporary-form{display:grid;grid-template-columns:minmax(0,1fr) 120px auto;gap:9px;} .internet-temporary-list{display:grid;gap:8px;margin-top:10px;} .internet-temporary-item{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:9px;} .internet-temporary-item>div{display:grid;gap:2px;} .internet-temporary-item strong{font-size:10.5px;color:var(--text);} .internet-temporary-item small{font-size:9px;color:var(--muted);} .internet-history-panel{margin-top:16px;padding:20px;} .internet-history-head{display:flex;align-items:center;justify-content:space-between;gap:16px;} .internet-history-head h2{margin:4px 0 4px;font-size:17px;} .internet-history-head p{margin:0;color:var(--muted);font-size:10px;} .internet-history-list{display:grid;gap:7px;margin-top:14px;} .internet-history-item{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 10px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--panel) 97%,var(--brand-soft));} .internet-history-item>div{display:grid;gap:2px;min-width:0;} .internet-history-item strong{font-size:10.5px;color:var(--text);} .internet-history-item small{font-size:9px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .internet-history-item>span{font-size:8.5px;color:var(--muted);white-space:nowrap;} .internet-history-item.undone{opacity:.55;} @media(max-width:760px){.internet-temporary-form{grid-template-columns:1fr;}.internet-history-head,.internet-temporary-item{align-items:stretch;flex-direction:column;}} /* INTERNET PROTECTION ETAP 12: visible status feedback */ .toast{ top:82px; right:24px; bottom:auto; z-index:10000; max-width:min(440px,calc(100vw - 32px)); border:1px solid var(--line); box-shadow:0 16px 42px color-mix(in srgb,var(--text) 18%,transparent); opacity:0; transform:translateY(-10px) scale(.985); font-weight:750; line-height:1.35; } .toast.show{opacity:1;transform:translateY(0) scale(1);} .toast.info{border-color:color-mix(in srgb,var(--brand) 55%,var(--line));} .toast.success{border-color:var(--ok-line);background:color-mix(in srgb,var(--ok-soft) 72%,var(--panel));} .toast.error{border-color:color-mix(in srgb,var(--danger) 72%,var(--line));background:color-mix(in srgb,var(--danger) 10%,var(--panel));color:var(--danger);} .network-auto-save.saved{font-weight:850;} @media(max-width:760px){.toast{top:16px;right:16px;left:16px;max-width:none;}} /* INTERNET PROTECTION ETAP 25: diagnostic quick fix */ .internet-diagnostic-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px;padding-top:12px;border-top:1px solid var(--line);} .internet-diagnostic-actions>span{font-size:8px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);} .internet-diagnostic-actions>div{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;} @media(max-width:680px){.internet-diagnostic-actions{align-items:stretch;flex-direction:column}.internet-diagnostic-actions>div{justify-content:stretch}.internet-diagnostic-actions button{width:100%}} /* ETAP30 screenshot view visibility hardening */ #screen.view.active{ display:block!important; visibility:visible!important; opacity:1!important; } #screen.view.active > *{ visibility:visible!important; opacity:1!important; } /* ===== ETAP 31 Guard hierarchy ===== */ .guard-hierarchy-notice{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 14px;align-items:center;margin:14px 0 18px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--panel)} .guard-hierarchy-notice strong{font-size:12px;letter-spacing:.01em} .guard-hierarchy-notice span{font-size:11px;color:var(--muted);line-height:1.45} .guard-hierarchy-notice.on{border-color:var(--ok-line);background:var(--ok-soft)} .guard-hierarchy-notice.on strong{color:var(--ok)} .guard-hierarchy-notice.off{border-color:color-mix(in srgb,var(--brand) 45%,var(--line));background:color-mix(in srgb,var(--brand) 7%,var(--panel))} .guard-hierarchy-notice.off strong{color:var(--brand)} .network-master-card{border-width:2px;border-color:color-mix(in srgb,var(--brand) 55%,var(--line));box-shadow:0 14px 34px -24px color-mix(in srgb,var(--brand) 65%,transparent)} .network-main-grid .coverage-card{order:-1} .guard-scope-summary{margin-left:auto;min-width:48px;padding:5px 9px;border:1px solid var(--line);border-radius:999px;background:var(--field);color:var(--text);font-size:10px;font-weight:900;text-align:center} .guard-dependency-note{margin:0 0 14px;padding:10px 12px;border-left:3px solid var(--brand);border-radius:8px;background:color-mix(in srgb,var(--brand) 7%,var(--panel));color:var(--muted);font-size:10px;line-height:1.45} .network-view.guard-master-off .guard-dependent,.network-view.guard-master-off .internet-services-panel,.network-view.guard-master-off .internet-categories-panel,.network-view.guard-master-off .youtube-card{opacity:.72} .internet-service-option.guard-disabled{opacity:.58} .internet-service-option.guard-disabled small{color:var(--brand)} @media(max-width:760px){.guard-hierarchy-notice{grid-template-columns:1fr}.network-main-grid .coverage-card{order:-1}} /* ===== ETAP 32 Guard layer truth ===== */ .guard-layer-status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 14px} .guard-layer-status{display:grid;gap:4px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--field)} .guard-layer-status>span{font-size:9px;font-weight:900;letter-spacing:.06em;color:var(--muted)} .guard-layer-status strong{font-size:12px} .guard-layer-status strong.on{color:var(--ok)} .guard-layer-status strong.off{color:var(--muted)} .guard-layer-status small{font-size:10px;line-height:1.4;color:var(--muted)} .network-rule-chips{display:grid;gap:8px} .network-rules-total.browser,.network-rules-total.system{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--field)} .service-status.pending{border-color:color-mix(in srgb,var(--brand) 52%,var(--line));background:color-mix(in srgb,var(--brand) 10%,var(--panel));color:var(--brand)} @media(max-width:760px){.guard-layer-status-grid{grid-template-columns:1fr}} /* ===== ETAP 33 simple protection status ===== */ .guard-simple-status{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:4px 0 14px} .guard-simple-status-copy{display:grid;gap:5px;min-width:0} .guard-simple-status-copy h2{margin:0;font-size:24px;line-height:1.05} .guard-simple-status-copy p{margin:0;color:var(--muted);font-size:11px;line-height:1.5} .guard-primary-status.synced{color:var(--ok)} .guard-primary-status.pending{color:var(--brand)} .guard-primary-status.offline{color:var(--danger)} .guard-primary-status.paused{color:var(--warn)} .guard-primary-status.off{color:var(--muted)} .internet-sync-technical{margin-top:8px;border-top:1px solid var(--line);padding-top:10px} .internet-sync-technical>summary{cursor:pointer;list-style:none;width:max-content;max-width:100%;padding:8px 11px;border:1px solid var(--line);border-radius:9px;background:var(--field);color:var(--text);font-size:10px;font-weight:850} .internet-sync-technical>summary::-webkit-details-marker{display:none} .internet-sync-technical>summary::after{content:" +";color:var(--brand);font-weight:900} .internet-sync-technical[open]>summary::after{content:" −"} .internet-sync-technical .internet-sync-head{margin-top:12px} .internet-sync-technical .internet-sync-head h3{margin:2px 0 0;font-size:16px} @media(max-width:760px){.guard-simple-status{align-items:flex-start;flex-direction:column}.guard-simple-status-copy h2{font-size:21px}} /* UI ZOOM 1: desktop zoom / reduced logical viewport hardening */ html,body{max-width:100%;overflow-x:hidden;} main,.view,.panel,.card,.topbar,.device-brand-row,.topbar-selectors,.topbar-actions{min-width:0;} /* Keep the shell fixed, but let the menu itself scroll independently. */ .sidebar{ height:100dvh; max-height:100dvh; overflow:hidden; } .sidebar>nav{ flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:color-mix(in srgb,var(--brand) 40%,transparent) transparent; padding-right:3px; } .sidebar>nav::-webkit-scrollbar{width:5px;} .sidebar>nav::-webkit-scrollbar-track{background:transparent;} .sidebar>nav::-webkit-scrollbar-thumb{ background:color-mix(in srgb,var(--brand) 38%,transparent); border-radius:999px; } .sidebar-bottom{flex:0 0 auto;} /* Zoom behaves like a narrower viewport. Compact before the old mobile breakpoint. */ @media(min-width:761px) and (max-width:1500px){ .sidebar{width:205px;padding-left:14px;padding-right:14px;} main{margin-left:205px;} .sidebar>.sidebar-logo{width:112px!important;height:112px!important;max-height:112px!important;} .sidebar>nav{margin-top:12px;} .nav{padding:10px 11px;} .view{padding-left:24px;padding-right:24px;} .topbar{ height:auto; min-height:82px; padding:12px 22px; gap:10px 16px; flex-wrap:wrap; align-content:center; } .device-brand-row{flex:1 1 520px;min-width:0;} .topbar-selectors{flex:1 1 auto;min-width:0;flex-wrap:wrap;} .topbar-actions{flex:0 1 auto;min-width:0;flex-wrap:wrap;justify-content:flex-end;} .profile-smart-picker{width:min(180px,100%);} .device-smart-picker{width:min(230px,100%);} } /* Typical 125–150% browser zoom on 1080p/1440p screens. */ @media(min-width:761px) and (max-width:1360px){ .sidebar{width:184px;padding:18px 11px 14px;} main{margin-left:184px;} .sidebar>.sidebar-logo{width:92px!important;height:92px!important;max-height:92px!important;margin-bottom:4px;} .sidebar>nav{margin-top:8px;gap:5px;} .nav{padding:9px 9px;font-size:13px;line-height:1.18;} .sidebar-bottom{font-size:11px;padding-top:8px;} .view{padding:22px 18px;} .topbar{padding:10px 16px;} .device-brand-row{flex-basis:100%;width:100%;} .topbar-selectors{flex:1 1 520px;} .topbar-actions{flex:1 1 auto;} .topbar-actions>.secondary, .topbar-actions>.takeover-btn{padding-left:10px;padding-right:10px;} .profile-smart-picker{width:170px;} .device-smart-picker{width:205px;} } /* Low logical height is the main reason the bottom of the sidebar disappears at zoom. */ @media(max-height:760px) and (min-width:761px){ .sidebar{padding-top:12px;padding-bottom:10px;} .sidebar>.sidebar-logo{width:82px!important;height:82px!important;max-height:82px!important;margin-bottom:0;} .sidebar>nav{margin-top:6px;gap:3px;} .nav{padding-top:8px;padding-bottom:8px;} .sidebar-bottom{padding-top:6px;font-size:11px;} } @media(max-height:620px) and (min-width:761px){ .sidebar>.sidebar-logo{width:62px!important;height:62px!important;max-height:62px!important;} .nav{padding-top:7px;padding-bottom:7px;font-size:12px;} } /* Avoid accidental page-wide horizontal scroll; wide widgets retain their own local scrolling. */ .view,.cards,.dashboard-grid,.devices-layout,.device-fleet,.profile-sync-panel, .message-grid,.network-main-grid,.shot-history-layout,.screenshot-settings-grid{max-width:100%;} /* UI ZOOM 1.1: keep desktop header visible while browser zoom changes scroll geometry */ @media(min-width:761px){ .topbar{ position:sticky!important; top:0; z-index:60!important; width:100%; backdrop-filter:saturate(1.15) blur(10px); } main{overflow:visible;} } /* UI ZOOM 1.2: force an independently scrollable sidebar at 130-150% zoom */ @media(min-width:761px) and (max-width:1420px){ .sidebar>nav{ flex:0 1 auto; max-height:calc(100dvh - 200px); overflow-y:scroll!important; overflow-x:hidden!important; scrollbar-gutter:stable; scrollbar-width:auto; scrollbar-color:color-mix(in srgb,var(--brand) 62%,var(--text)) color-mix(in srgb,var(--panel) 70%,transparent); } .sidebar>nav::-webkit-scrollbar{width:8px;} .sidebar>nav::-webkit-scrollbar-track{ background:color-mix(in srgb,var(--panel) 74%,transparent); border-radius:999px; } .sidebar>nav::-webkit-scrollbar-thumb{ background:color-mix(in srgb,var(--brand) 62%,var(--text)); border-radius:999px; border:2px solid color-mix(in srgb,var(--panel) 74%,transparent); } } /* UI ZOOM 1.4: guarantee real sidebar overflow around 130% zoom */ @media(min-width:1180px) and (max-width:1360px){ .sidebar>nav{ height:calc(100dvh - 245px)!important; max-height:calc(100dvh - 245px)!important; min-height:0!important; flex:0 0 auto!important; overflow-y:scroll!important; overflow-x:hidden!important; scrollbar-gutter:stable both-edges; } } /* NESTRA Child Location & Safe Places */ .location-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:18px;margin-bottom:18px} .location-summary-card{min-width:0} .location-latest-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:8px 0 16px} .location-latest-grid>div{display:flex;flex-direction:column;gap:5px;padding:12px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)} .location-latest-grid span{font-size:12px;color:var(--muted)} .location-latest-grid strong{font-size:14px;overflow-wrap:anywhere} .location-trace-wrap{width:100%;overflow:hidden;border-radius:16px} .location-trace{width:100%;height:auto;min-height:180px;display:block} .location-trace-bg{fill:var(--surface-2);stroke:var(--border)} .location-trace-estimated{fill:none;stroke:var(--muted);stroke-width:2.5;stroke-dasharray:6 7;stroke-linecap:round;stroke-linejoin:round;opacity:.75} .location-trace-coarse{fill:none;stroke:#d58b00;stroke-width:3.2;stroke-dasharray:3 6;stroke-linecap:round;stroke-linejoin:round;opacity:.92} .location-trace-line{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round} .location-trace-point{fill:var(--muted)} .location-trace-current{fill:var(--accent);stroke:var(--surface);stroke-width:2} .location-privacy-note{margin-top:10px;font-size:12px} .location-event-list,.location-history-list,.safe-place-list{display:flex;flex-direction:column;gap:8px} .location-event-row{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--border);border-radius:12px} .location-event-row>div{display:flex;flex-direction:column;gap:3px;min-width:0} .location-event-row small{color:var(--muted)} .location-event-badge{min-width:54px;text-align:center;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800} .location-event-badge.enter{background:rgba(34,197,94,.14);color:#22c55e} .location-event-badge.exit{background:rgba(239,68,68,.14);color:#ef4444} .safe-places-panel{margin-bottom:18px} .safe-place-form{display:grid;grid-template-columns:1.4fr repeat(3,1fr) 1fr auto;gap:10px;align-items:end;margin:14px 0 16px} .safe-place-form label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--muted)} .safe-place-form input,.safe-place-form select{width:100%} .safe-place-form .safe-place-enabled{flex-direction:row;align-items:center;padding-bottom:10px} .safe-place-form .safe-place-enabled input{width:auto} .safe-place-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:12px;align-items:center;padding:12px;border:1px solid var(--border);border-radius:12px} .safe-place-main{display:flex;flex-direction:column;gap:3px;min-width:0} .safe-place-main span{color:var(--muted);font-size:12px;overflow-wrap:anywhere} .safe-place-kind{font-size:11px;font-weight:800;padding:5px 8px;border-radius:999px;background:rgba(59,130,246,.14)} .safe-place-kind.restricted{background:rgba(239,68,68,.14);color:#ef4444} .safe-place-on{color:#22c55e;font-size:12px;font-weight:700} .safe-place-off{color:var(--muted);font-size:12px;font-weight:700} .location-history-row{display:grid;grid-template-columns:180px minmax(220px,1fr) 90px 100px;gap:12px;padding:10px 12px;border-bottom:1px solid var(--border);align-items:center;font-size:13px} .location-history-time{color:var(--muted)} @media(max-width:980px){.location-grid{grid-template-columns:1fr}.safe-place-form{grid-template-columns:1fr 1fr}.location-history-row{grid-template-columns:1fr 1fr}.safe-place-row{grid-template-columns:1fr auto}} @media(max-width:620px){.location-latest-grid,.safe-place-form{grid-template-columns:1fr}.location-history-row{grid-template-columns:1fr}.safe-place-row{grid-template-columns:1fr}.location-trace{min-height:140px}} /* Restored last known-good locator styles (4cc17b8c). Only location selectors / theme aliases. */ .location-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:18px;margin-bottom:18px} .location-summary-card{min-width:0} .location-latest-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:8px 0 16px} .location-latest-grid>div{display:flex;flex-direction:column;gap:5px;padding:12px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)} .location-latest-grid span{font-size:12px;color:var(--muted)} .location-latest-grid strong{font-size:14px;overflow-wrap:anywhere} .location-trace-wrap{width:100%;overflow:hidden;border-radius:16px} .location-trace{width:100%;height:auto;min-height:180px;display:block} .location-map-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:10px 0} .location-map-toolbar>span{font-size:12px} .location-map-actions{display:flex;gap:6px} .location-map-actions button{min-width:40px;min-height:36px} .location-map-legend{font-size:12px;color:var(--muted);line-height:1.5;padding-top:7px} .location-map-grid{stroke:var(--border);stroke-width:1;stroke-dasharray:3 5;opacity:.6} .location-map-north{fill:var(--muted);font-size:14px;font-weight:800;pointer-events:none} .location-zone-safe{fill:rgba(34,197,94,.10);stroke:#22c55e;stroke-width:1.6} .location-zone-restricted{fill:rgba(239,68,68,.09);stroke:#ef4444;stroke-width:1.6} .location-stop-marker{fill:#f59e0b;stroke:var(--surface);stroke-width:1.5} .location-trace-bg{fill:var(--surface-2);stroke:var(--border)} .location-trace-line{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round} .location-trace-point{fill:var(--muted)} .location-trace-current{fill:var(--accent);stroke:var(--surface);stroke-width:2} .location-privacy-note{margin-top:10px;font-size:12px} .location-event-list,.location-history-list,.safe-place-list{display:flex;flex-direction:column;gap:8px} .location-event-row{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--border);border-radius:12px} .location-event-row>div{display:flex;flex-direction:column;gap:3px;min-width:0} .location-event-row small{color:var(--muted)} .location-event-badge{min-width:54px;text-align:center;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800} .location-event-badge.enter{background:rgba(34,197,94,.14);color:#22c55e} .location-event-badge.exit{background:rgba(239,68,68,.14);color:#ef4444} .location-event-badge.dwell{background:rgba(245,158,11,.14);color:#d97706} .safe-place-email-config{border:1px solid var(--border);border-radius:13px;padding:14px;margin:14px 0;background:var(--surface-2)} .safe-place-email-config h3{font-size:16px;margin:0} .safe-place-email-config p{font-size:12px;line-height:1.55;margin:7px 0 12px} .safe-place-email-config label{display:flex;align-items:center;gap:9px;font-size:13px;margin:8px 0} .safe-place-email-config input{accent-color:var(--accent);width:17px;height:17px;flex:none} .safe-place-email-events{display:flex;gap:12px;flex-wrap:wrap;padding:8px 0} .safe-place-email-save{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:10px} .safe-place-email-save span{font-size:12px;color:var(--muted)} .safe-place-dwell-setting{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;font-size:12px;line-height:1.5;color:var(--muted)} .safe-place-dwell-setting input{accent-color:var(--accent);flex:none;width:16px;height:16px} .safe-places-panel{margin-bottom:18px} .safe-place-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px;align-items:end;margin:14px 0 16px} .safe-place-form label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--muted)} .safe-place-form input,.safe-place-form select{width:100%} .safe-place-form .safe-place-enabled{flex-direction:row;align-items:center;padding-bottom:10px} .safe-place-form .safe-place-enabled input{width:auto} .safe-place-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto minmax(110px,auto) auto;gap:12px;align-items:center;padding:12px;border:1px solid var(--border);border-radius:12px} .safe-place-zone-dwell{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--muted)} .safe-place-zone-dwell select{min-width:104px;max-width:150px;min-height:36px} @media(max-width:900px){.safe-place-row{grid-template-columns:minmax(0,1fr) auto}.safe-place-zone-dwell{grid-column:1/2}.safe-place-row>.remove-safe-place{grid-column:2/3}} .safe-place-main{display:flex;flex-direction:column;gap:3px;min-width:0} .safe-place-main span{color:var(--muted);font-size:12px;overflow-wrap:anywhere} .safe-place-kind{font-size:11px;font-weight:800;padding:5px 8px;border-radius:999px;background:rgba(59,130,246,.14)} .safe-place-kind.restricted{background:rgba(239,68,68,.14);color:#ef4444} .safe-place-on{color:#22c55e;font-size:12px;font-weight:700} .safe-place-off{color:var(--muted);font-size:12px;font-weight:700} .location-history-controls{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 12px} .location-history-controls button{min-height:36px} .location-history-controls button[aria-pressed="true"]{border-color:var(--accent);color:var(--accent);font-weight:800} .location-history-summary{padding:12px 14px;margin:0 0 10px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);font-size:13px;color:var(--text)} .location-stop-panel{margin:14px 0 18px;padding:16px;border:1px solid var(--border);border-radius:16px;background:var(--surface-2)} .location-stop-panel .panel-head{gap:12px} .location-stop-panel h3{font-size:16px;font-weight:800;margin:0} .location-stop-note{font-size:12px;line-height:1.5;margin:6px 0 12px} .location-stops-list{display:flex;flex-direction:column;gap:8px} .location-stop-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--surface);border:1px solid var(--border)} .location-stop-row>div{display:flex;flex-direction:column;gap:3px} .location-stop-row small{font-size:12px;color:var(--muted)} .location-stop-row span{font-weight:800} @media(max-width:620px){.location-stop-row{grid-template-columns:minmax(0,1fr) auto}.location-stop-row>small{grid-column:1/-1}} .location-history-row{display:grid;grid-template-columns:180px minmax(220px,1fr) 90px 100px;gap:12px;padding:10px 12px;border-bottom:1px solid var(--border);align-items:center;font-size:13px} .location-history-time{color:var(--muted)} @media(max-width:980px){.location-grid{grid-template-columns:1fr}.safe-place-form{grid-template-columns:1fr 1fr}.location-history-row{grid-template-columns:1fr 1fr}.safe-place-row{grid-template-columns:1fr auto}} @media(max-width:620px){.location-latest-grid,.safe-place-form{grid-template-columns:1fr}.location-history-row{grid-template-columns:1fr}.safe-place-row{grid-template-columns:1fr}.location-trace{min-height:140px}} /* NESTRA Location Map 2.0 — responsive, accessible and isolated from other views. */ .location-live-map-panel{margin-bottom:18px;min-width:0} .location-map-head{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap} .location-map-head>div:first-child{min-width:0} .location-map-head h2{margin:0 0 6px} .location-map-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px} .location-map-actions button{white-space:normal} .location-map-actions [hidden]{display:none!important} .location-map-toolbar{display:flex;gap:8px;margin:12px 0;flex-wrap:wrap} .location-map-toolbar button[aria-pressed="true"]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--surface));color:var(--text)} .location-map-viewport{overflow:hidden;border:1px solid var(--border);border-radius:16px;background:#d9e6f0} .location-map-viewport[hidden]{display:none!important} .location-map-canvas{height:clamp(320px,50vh,620px);min-height:320px;width:100%;isolation:isolate} .location-map-canvas .leaflet-container{font-family:inherit} .location-map-canvas .leaflet-popup-content-wrapper{border-radius:12px} .location-map-canvas .leaflet-popup-content{font-size:13px;line-height:1.5;max-width:260px;overflow-wrap:anywhere} .location-map-canvas .leaflet-popup-content strong{display:block;margin-bottom:3px} .location-map-canvas .leaflet-control-attribution{font-size:11px!important;background:rgba(255,255,255,.92)!important;color:#263340!important} .location-map-canvas .leaflet-control-attribution a{color:#115eae!important} .location-map-privacy{font-size:12px;line-height:1.5;margin:10px 0 0;max-width:1000px} @media(max-width:720px){ .location-map-head{align-items:stretch} .location-map-actions{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))} .location-map-actions button:first-child{grid-column:1/-1} .location-map-canvas{height:380px;min-height:300px} } /* NESTRA Locator 2.0: status, day history, playback, trips, legend, sketch mode. */ /* Aliases used by the location views (#105/#111) map onto the theme palette. */ html{--surface:var(--panel);--surface-2:var(--panel-2);--border:var(--line);--accent:var(--brand)} .location-status-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0 4px} .location-freshness{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid var(--border);background:var(--surface-2,var(--surface));color:var(--text)} .location-freshness::before{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;flex:none} .location-freshness.state-current{color:#0e8a5f;border-color:rgba(16,164,118,.45)} .location-freshness.state-delayed{color:#b26a00;border-color:rgba(245,158,11,.5)} .location-freshness.state-stale,.location-freshness.state-offline,.location-freshness.state-clock{color:#c2410c;border-color:rgba(234,88,12,.5)} .location-freshness.state-no-gps,.location-freshness.state-no-permission{color:#c62839;border-color:rgba(220,53,69,.55)} .location-freshness.state-none{color:var(--muted)} .location-freshness-detail{font-size:12px;line-height:1.5;flex:1 1 280px} .location-day-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin:10px 0} .location-day-controls label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)} .location-day-controls input[type=date],.location-day-controls input[type=time]{min-height:38px} .location-day-controls .location-auto-refresh{flex-direction:row;align-items:center;gap:8px;min-height:38px} .location-playback{display:grid;grid-template-columns:auto auto minmax(140px,1fr) auto auto;gap:10px;align-items:center;margin:12px 0} .location-playback-label{font-size:12px;font-weight:700;color:var(--muted)} .location-playback input[type=range]{width:100%;min-height:32px;accent-color:var(--accent)} .location-legend{display:flex;flex-wrap:wrap;gap:8px 16px;list-style:none;padding:0;margin:6px 0 10px;font-size:12px;color:var(--muted)} .location-legend li{display:flex;align-items:center;gap:6px} .location-legend i{display:inline-block;width:20px;height:10px;border-radius:6px;flex:none} .legend-route{background:#1472eb} .legend-estimated{border-top:2px dashed #60a5fa;height:0!important;width:18px!important;border-radius:0!important} .legend-gap{border:2px dashed var(--muted);height:0!important;width:18px!important;border-radius:0!important;border-bottom:none;border-left:none;border-right:none} .legend-stop{background:#fbbf24;border:2px solid #a6650c;width:12px!important;height:12px!important;border-radius:50%!important} .legend-safe{border:2px solid #10a476;background:rgba(16,164,118,.15);border-radius:50%!important;width:14px!important;height:14px!important} .legend-restricted{border:2px solid #dc3545;background:rgba(220,53,69,.15);border-radius:50%!important;width:14px!important;height:14px!important} .legend-accuracy{border:1px solid #2985ed;background:rgba(41,133,237,.12);border-radius:50%!important;width:14px!important;height:14px!important} .location-trips h3{font-size:14px;margin:14px 0 8px} .location-trip-list{list-style:none;padding:0;margin:0;display:grid;gap:6px} .location-trip{display:grid;grid-template-columns:auto auto 1fr;gap:10px;align-items:center;width:100%;text-align:left;padding:9px 12px;min-height:44px;border-radius:12px;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer} .location-trip.active{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 30%,transparent)} .location-trip:focus-visible{outline:3px solid var(--accent);outline-offset:2px} .location-trip-swatch{width:14px;height:14px;border-radius:4px} .location-trip span:last-child{font-size:12px;color:var(--muted)} .location-map-canvas.location-map-sketch{background-color:#eef3f8;background-image:linear-gradient(rgba(20,40,70,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(20,40,70,.06) 1px,transparent 1px);background-size:32px 32px} html[data-theme="dark"] .location-map-canvas.location-map-sketch,html[data-theme="gold"] .location-map-canvas.location-map-sketch{background-color:#16202c;background-image:linear-gradient(rgba(200,220,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(200,220,255,.07) 1px,transparent 1px)} @media(max-width:720px){.location-playback{grid-template-columns:auto 1fr auto}.location-playback-label,.location-playback #locationPlaybackTime{grid-column:1/-1}.location-day-controls label{flex:1 1 40%}} .location-live-map-panel .location-map-toolbar{justify-content:flex-start} /* ===== NESTRA LOCATOR 2.1 — SIMPLE UI (scoped, no changes to other panels) ===== */ #location .locator-simple-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; max-width:720px; margin:10px 0 18px; padding:6px; background:var(--panel-2); border:1px solid var(--line);border-radius:16px; } #location .locator-simple-tabs[hidden],#location .locator-simple-pane[hidden] {display:none!important} #location .locator-simple-tabs button { border:0; border-radius:12px; background:transparent;color:var(--muted); min-height:47px;font-weight:750;letter-spacing:.01em;cursor:pointer; } #location .locator-simple-tabs button[aria-selected="true"]{ background:var(--brand);color:var(--brand-ink); box-shadow:0 5px 16px color-mix(in srgb,var(--brand) 22%,transparent); } #location .locator-simple-tabs button:focus-visible, #location .locator-simple-pane summary:focus-visible, #location .locator-simple-pane button:focus-visible{ outline:3px solid var(--brand2);outline-offset:2px; } #location .locator-simple-pane{max-width:100%;min-width:0;} #location .locator-simple-pane>.location-live-map-panel{margin-bottom:12px} #location .locator-simple-pane .location-map-canvas{height:clamp(390px,60vh,690px)} #location .locator-simple-pane .location-map-toolbar [data-location-map-window]{display:none!important} #location .locator-simple-pane .location-map-toolbar{justify-content:flex-end} #location .locator-simple-pane .location-day-controls{margin:12px 0} #location .locator-simple-pane .location-map-head h2{font-size:19px} #location .locator-simple-pane .location-map-actions button{min-height:39px} #location .locator-simple-pane .location-map-privacy{font-size:12px} #location .locator-simple-pane details.locator-technical-details, #location .locator-simple-pane details.locator-period-details, #location .locator-simple-pane details.locator-editor-details, #location .locator-simple-pane details.locator-notify-details, #location .locator-simple-pane details.locator-replay-details, #location .locator-simple-pane details.locator-legend-details{ min-width:0;margin:12px 0;padding:0;border:1px solid var(--line); border-radius:14px;background:var(--panel-2);overflow:visible; } #location .locator-simple-pane details.locator-legend-details{margin-top:10px} #location .locator-simple-pane details>summary{ cursor:pointer;list-style:none;padding:14px 16px; color:var(--text);font-weight:740;display:flex;gap:10px;align-items:center; user-select:none; } #location .locator-simple-pane details>summary::-webkit-details-marker{display:none} #location .locator-simple-pane details>summary:after{content:'⌄';margin-left:auto;color:var(--muted);font-size:19px;line-height:1} #location .locator-simple-pane details[open]>summary:after{transform:rotate(180deg)} #location .locator-simple-pane details.locator-technical-details>.panel{ margin:0;border:0;box-shadow:none;background:transparent; } #location .locator-simple-pane details.locator-replay-details .location-playback{ padding:10px 14px 16px;margin:0 } #location .locator-simple-pane details.locator-legend-details .location-legend{padding:8px 15px;flex-wrap:wrap} #location .locator-simple-pane details.locator-legend-details .location-map-privacy{margin:5px 15px 16px} #location .locator-simple-pane details.locator-period-details .location-day-controls{padding:0 15px 16px} #location .locator-simple-pane .locator-show-map{margin:8px 0 16px;min-height:40px} #location .locator-simple-pane .location-trips{margin:10px 0} #location .locator-simple-pane>.safe-places-panel{margin-top:0} #location .locator-simple-pane details.locator-editor-details{margin:10px 0} #location .locator-simple-pane details.locator-editor-details .safe-place-form{margin:0;padding:4px 14px 16px} #location .locator-simple-pane details.locator-notify-details{margin:12px 0} #location .locator-simple-pane details.locator-notify-details .safe-place-email-config{ margin:0 12px 12px;border:0;background:transparent;padding:10px 0 } #location .locator-simple-pane details.locator-notify-details .safe-place-dwell-setting{margin:6px 12px} #location .locator-simple-pane .safe-place-row{ grid-template-columns:minmax(185px,1fr) auto auto minmax(110px,auto) auto auto;gap:10px } #location .locator-simple-pane .safe-place-row .edit-safe-place{min-height:38px} #location .locator-simple-pane .safe-place-more{position:relative;margin:0;min-width:42px} #location .locator-simple-pane .safe-place-more>summary{ width:42px;min-height:39px;display:flex;justify-content:center;padding:6px 12px; border:1px solid var(--line);border-radius:10px;font-size:23px;font-weight:800; } #location .locator-simple-pane .safe-place-more>summary:after{content:none} #location .locator-simple-pane .safe-place-more[open]>summary{background:var(--panel-2)} #location .locator-simple-pane .safe-place-more .remove-safe-place{ position:absolute;right:0;top:42px;z-index:3;min-width:145px; padding:9px 14px;border:1px solid var(--danger);background:var(--panel); color:var(--danger);box-shadow:var(--shadow);border-radius:10px;font-size:12px } #location .locator-simple-pane .safe-place-list{gap:10px} #location .locator-simple-pane .location-history-controls{margin:10px 0} #location .locator-simple-pane .location-event-list{max-height:590px;overflow-y:auto;overscroll-behavior:contain} #location .locator-simple-pane .location-event-row{padding:11px 13px} @media(max-width:1000px){ #location .locator-simple-pane .safe-place-row{grid-template-columns:minmax(0,1fr) auto auto;gap:8px} #location .locator-simple-pane .safe-place-row .safe-place-main{grid-column:1/2} #location .locator-simple-pane .safe-place-row .safe-place-zone-dwell{grid-column:auto} } @media(max-width:680px){ #location .locator-simple-tabs{position:sticky;top:0;z-index:4;max-width:none;margin:8px 0 12px} #location .locator-simple-tabs button{min-height:45px;font-size:13px} #location .locator-simple-pane .location-map-canvas{height:min(65vh,520px);min-height:330px} #location .locator-simple-pane .location-map-head{gap:10px} #location .locator-simple-pane .location-map-actions{display:flex;flex-wrap:wrap;gap:7px} #location .locator-simple-pane .location-map-actions button{font-size:12px;flex:1 1 auto} #location .locator-simple-pane .location-map-toolbar{justify-content:flex-start} #location .locator-simple-pane .safe-place-form{grid-template-columns:1fr 1fr} #location .locator-simple-pane .safe-place-row{grid-template-columns:minmax(0,1fr) auto} #location .locator-simple-pane .safe-place-row>.safe-place-main{grid-column:1/-1} #location .locator-simple-pane .safe-place-row>.safe-place-zone-dwell{grid-column:1/2} #location .locator-simple-pane .safe-place-row>.safe-place-more{justify-self:end} #location .locator-simple-pane .location-history-row{grid-template-columns:1fr 1fr} } @media(max-width:400px){ #location .locator-simple-pane .safe-place-form{grid-template-columns:1fr} #location .locator-simple-pane .location-history-row{grid-template-columns:1fr} } @media(prefers-reduced-motion:reduce){ #location .locator-simple-tabs button{transition:none} } /* Android browser-use telemetry is an app-duration row, not a web visit. Do not inherit the icon/title column sizing from .web-event-row. */ #androidBrowserUsageList .android-browser-usage-row{ display:flex;align-items:center;justify-content:space-between;gap:18px; width:100%;min-width:0;padding:12px 4px; border-bottom:1px solid var(--line); } #androidBrowserUsageList .android-browser-usage-row:last-child{border-bottom:0} #androidBrowserUsageList .android-browser-usage-main{ display:flex;flex-direction:column;gap:4px;flex:1 1 auto;min-width:0; } #androidBrowserUsageList .android-browser-usage-main strong{ color:var(--text);font-size:14px;overflow-wrap:anywhere; } #androidBrowserUsageList .android-browser-usage-main span{ color:var(--muted);font-size:12px;line-height:1.4; } #androidBrowserUsageList .android-browser-usage-duration{ flex:0 0 auto;margin-left:auto;white-space:nowrap; font-size:16px;font-weight:850;color:var(--text); font-variant-numeric:tabular-nums;text-align:right; } /* An Android search-history list does not exist; don't show a vacant 520px Windows-history box or nonfunctional date/search filters on Xiaomi. */ #webSearchesPane.android-search-unavailable .web-toolbar{display:none} #webSearchesPane.android-search-unavailable .web-list-panel{min-height:0;padding:24px} #webSearchesPane.android-search-unavailable .web-event-list{display:block} .android-search-explainer{max-width:700px;display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:6px 0 14px} .android-search-explainer strong{font-size:16px;line-height:1.4} .android-search-explainer p{color:var(--muted);font-size:13px;line-height:1.65;margin:0} .android-search-explainer button{min-height:42px;padding:9px 16px} /* Private screenshot histories are omitted from desktop and mobile navigation. */ body.screenshot-privacy-locked [data-view="screen"] { display:none !important; } /* FIX26.2: current GPS marker must stay visible in Android WebView even when Leaflet's vector/canvas pane is not painted. The marker itself is a DOM DivIcon. */ .nestra-location-pos-host { background: transparent !important; border: 0 !important; } .nestra-location-pos-dot { display: block; width: 20px; height: 20px; box-sizing: border-box; border-radius: 50%; background: #1677ff; border: 4px solid #fff; } .nestra-location-pos-dot.replay { background: #7c3aed; } /* FIX26.4: protect Leaflet render surfaces from responsive/global CSS rules. Android WebView showed distorted Canvas vectors while tiles stayed correct. */ .leaflet-container canvas, .leaflet-container svg { max-width: none !important; max-height: none !important; } /* Coarse movement only: explicitly not a confirmed street route. */ .legend-coarse{display:inline-block;width:26px;height:0;border-top:3px dotted #fbbf24;vertical-align:middle}