/* По графику 2.0 — мобильная версия */
html{-webkit-text-size-adjust:100%}
button,input,select,textarea{touch-action:manipulation}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(105,84,232,.35);outline-offset:2px}
.mobile-nav{display:none}
.mobile-nav button{border:0;background:transparent}
#pointsList>button{padding:19px;text-align:left;font-weight:750;border-radius:14px;background:#faf9ff;border:1px solid var(--line);min-height:64px}
#pointsList>button:hover{background:var(--brand-soft)}
@media(max-width:880px){
.hero-actions{width:100%}
.hero-actions button{min-height:44px}
.week-nav{flex:1}
.week-nav button,.week-nav input{min-height:44px}
.week-nav input{font-size:16px}
.day-checks label{min-height:44px}
}
@media(max-width:767px){
body{font-size:15px;overflow-x:hidden}
.page{padding:0 12px calc(28px + env(safe-area-inset-bottom));max-width:100%}
.topbar{height:68px;gap:8px}
.brand{gap:10px}
.brandmark{width:37px;height:37px;border-radius:11px;font-size:16px}
.brandname{font-size:19px}
.brandhint{font-size:10px}
.topbadge{display:none}
.card{border-radius:16px;padding:16px}
.auth-layout{display:block;padding-top:12px}
.auth-story{padding:4px 4px 8px}
.auth-story h1{font-size:25px;line-height:1.17;margin:0 0 7px;letter-spacing:-.7px}
.auth-story>p{font-size:13px;line-height:1.45;margin:0 0 10px}
.auth-story .kicker{font-size:10px;margin-bottom:7px}
.auth-card{max-width:none;padding:17px}
.auth-tabs{margin-bottom:16px}
.auth-tabs button{min-height:44px}
.grid-form,.auth-card .grid-form,.work-card .grid-form{grid-template-columns:minmax(0,1fr);gap:12px}
.formfield.wide{grid-column:auto}
.grid-form>div{min-width:0}
.formgroup{margin-top:15px;padding-top:15px}
.formgroup h3{margin-bottom:10px}
.formnote{margin-bottom:14px}
.day-checks{gap:7px}
.day-checks label{font-size:13px;flex:0 0 calc(25% - 6px);justify-content:center;padding:8px 4px;min-height:44px}
input,select,textarea{font-size:16px;min-height:44px}
input[type=checkbox]{min-height:15px}
.pass-wrap button{min-width:46px;min-height:46px}
.buttonwide{min-height:48px;margin-top:16px}
#emailSignup{padding:0 0 10px;margin-bottom:13px;border-bottom:1px solid var(--line)}
#pointPicker{margin-top:16px!important}
#pointsList{grid-template-columns:1fr}
#pointsList>button{width:100%;min-height:64px}
.dashboard{padding-top:15px;padding-bottom:76px}
.hero{gap:12px;margin-bottom:14px}
.hero h1{font-size:25px;overflow-wrap:anywhere}
.hero .kicker{margin-bottom:5px;font-size:10px}
.hero .subtitle{font-size:12px}
.hero-actions{gap:7px}
.hero-actions button{font-size:12px;padding:8px 10px}
.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:12px}
.metric{padding:13px;min-height:98px;border-radius:13px}
.metric strong{font-size:23px;margin:7px 0 2px}
.metric .metric-label{font-size:11px}
.metric small{font-size:10px;line-height:1.25;display:block}
.metrics .metric:last-child{grid-column:1/-1;min-height:88px}
.metrics .metric:last-child strong{font-size:24px}
.card-header{display:block;margin-bottom:13px}
.card-header h2{font-size:20px}
.card-header p{font-size:12px;margin-bottom:12px}
.card-header>button{margin-top:10px;min-height:44px}
.week-nav{display:grid;grid-template-columns:44px minmax(0,1fr) 44px minmax(73px,90px);gap:7px;align-items:center;width:100%}
.week-nav label{display:none}
.week-nav input{min-width:0;width:100%;padding:9px 6px;font-size:16px}
.week-nav button{min-height:44px;padding:8px 6px;font-size:14px}
.week-range{font-size:12px;display:block;margin:12px 0;border-radius:10px;padding:9px 11px}
.calendar{border:0;background:transparent;overflow:visible}
.weektable{display:block;min-width:0;width:100%;table-layout:auto;border:0}
.weektable thead{display:none}
.weektable tbody{display:grid;grid-template-columns:minmax(0,1fr);gap:11px;width:100%}
.weektable tbody tr{display:block;background:#fff;border:1px solid var(--line);box-shadow:0 3px 14px rgba(30,33,83,.04);border-radius:14px;overflow:hidden;padding:12px}
.weektable tbody tr.todayrow{border-color:#bfb5fa;box-shadow:0 0 0 1px #bfb5fa}
.weektable tbody td,.weektable tbody td:last-child{display:block;height:auto;border:0;min-height:0;padding:0;background:transparent}
.weektable tbody td.daycell{display:block;border-bottom:1px solid var(--line);padding:0 0 10px;margin-bottom:10px}
.daycell strong{font-size:15px}
.daycell small{font-size:12px}
.weektable .todayrow .daycell{box-shadow:none}
.weektable .todayrow .daycell strong{color:var(--brand)}
.weektable .weekend .daycell{background:transparent}
.weektable .offrow td{background:transparent;color:var(--muted)}
.weektable .offrow .daycell{background:transparent}
.weektable .offrow td:not(.daycell):not(:nth-child(2)){display:none}
.weektable .offrow td:nth-child(2){color:var(--muted);font-size:13px;padding:4px 1px 2px}
.weektable tbody td[data-slot]{margin-top:9px}
.weektable tbody td[data-slot]::before{content:attr(data-slot);display:block;font-weight:750;font-size:11px;letter-spacing:.3px;color:var(--muted);margin-bottom:5px}
.weektable .offrow td[data-slot]::before{display:none}
.slot{min-height:0;padding:12px 13px;border-radius:10px}
.slot .person{font-size:14px}
.slot .shift-time{font-size:12px}
.slot .remove-btn{min-height:34px;padding:5px 2px;font-size:12px}
.slotbtn{min-height:68px;display:block;padding:12px 13px;font-size:14px;text-align:left;border-radius:10px}
.slotbtn small{font-size:12px;margin-top:3px}
.table-hint{gap:11px;margin:12px 0 2px;font-size:11px}
.work-card,.pay-card,.settings-card{margin-top:12px;scroll-margin-top:14px}
.work-actions{display:grid;grid-template-columns:1fr;gap:9px}
.work-actions button{min-height:46px;width:100%}
.security-box .grid-form{grid-template-columns:1fr}
.paytable{min-width:0;border-collapse:separate;border-spacing:0}
.paytable thead{display:none}
.paytable tbody{display:grid;gap:10px}
.paytable tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;background:#fafaff;padding:12px;border:1px solid var(--line);border-radius:12px}
.paytable tbody td{border:0;padding:0;min-width:0;overflow-wrap:anywhere}
.paytable tbody td:first-child{font-weight:800}
.paytable tbody td:nth-child(2){text-align:right;white-space:nowrap}
.paytable tbody td:nth-child(3){grid-column:1/-1}
.paytable tbody td:nth-child(3) button{width:100%;min-height:44px}
.table-scroll{overflow:visible}
.mobile-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;z-index:20;padding:7px 10px calc(7px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid var(--line);box-shadow:0 -7px 22px rgba(28,31,71,.05);gap:6px;backdrop-filter:blur(12px)}
.mobile-nav button{min-height:49px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;font-size:11px;font-weight:750;color:#63677b;border-radius:9px;padding:3px 6px}
.mobile-nav button:active{background:var(--brand-soft)}
.mobile-nav .nav-icon{font-size:20px;line-height:1.3}
.mobile-nav button:first-child{color:var(--brand)}
}
@media(max-width:375px){
.week-nav{grid-template-columns:38px minmax(0,1fr) 38px 69px;gap:5px}
.week-nav button{padding:6px 3px;font-size:12px}
.week-nav input{font-size:14px}
.brandname{font-size:18px}
.hero-actions button{font-size:11px}
.metric strong{font-size:20px}
}
@media(min-width:768px){.mobile-nav{display:none!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}button{transition:none}}
