/* TOCHKA_NATIVE_REFINED_HOME_20261102_V3
   Real HTML controls, original approved photo as CSS background, no
   bitmap buttons or invisible image hotspots. Scoped to male presentation;
   goals use normal DOM controls for both atmospheres. */
body[data-gender="male"] .app{
  background:#f7f5ec;
  color:#263d33;
}
body[data-gender="male"] .app > .intro-shell{
  display:block !important;
  background-color:#143d35;
  overflow:hidden;
  border-bottom:0;
}
body[data-gender="male"] .intro-shell::before{
  background-image:var(--theme-photo);
  background-position:74% 44%;
  background-size:cover;
  background-repeat:no-repeat;
  filter:brightness(1.06) saturate(1.04);
}
body[data-gender="male"] .intro-shell::after{
  background:linear-gradient(90deg,rgba(7,41,38,.81) 0%,rgba(9,52,46,.60) 45%,rgba(8,52,47,.18) 82%,rgba(8,46,41,.06) 100%),
    linear-gradient(0deg,rgba(4,44,35,.23),transparent 35%);
}
body[data-gender="male"] .intro-shell .hero{
  min-height:520px;
  padding:26px clamp(20px,4.2vw,52px) 38px;
  background:transparent !important;
  position:relative;
  z-index:1;
}
body[data-gender="male"] .intro-shell .top{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
body[data-gender="male"] .intro-shell .brand{
  gap:13px;
  align-items:center;
}
body[data-gender="male"] .intro-shell .logo{
  width:68px;height:68px;
  border:1.5px solid #dbbd7b;
  box-shadow:0 5px 15px rgba(0,24,19,.25);
}
body[data-gender="male"] .intro-shell .brand b{
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(18px,2.25vw,29px);
  letter-spacing:1.6px;
  font-weight:700;
  color:#fff9e9;
  line-height:1.13;
}
body[data-gender="male"] .intro-shell .brand small{
  color:#f5e9d0;
  font-size:10px;
  letter-spacing:1.4px;
  line-height:1.3;
}
body[data-gender="male"] .intro-shell .switch{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:rgba(255,252,244,.94);
  color:#254538;
  border:1px solid #e7d9be;
  box-shadow:0 5px 14px rgba(3,30,25,.15);
  border-radius:14px;
  font-size:12px;
  padding:9px 11px;
  font-weight:650;
}
body[data-gender="male"] .intro-shell .hero-main{
  max-width:min(61%,570px);
  margin-top:46px;
}
body[data-gender="male"] .intro-shell .eyebrow{
  color:#f7ebcb;
  font-size:11px;
  letter-spacing:1.75px;
  font-weight:650;
}
body[data-gender="male"] .intro-shell .reference-release-label{display:none}
body[data-gender="male"] .intro-shell h1{
  color:#fffaf1;
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(34px,4.2vw,53px);
  line-height:1.12;
  font-weight:700;
  margin:20px 0 17px;
  text-shadow:0 2px 12px rgba(3,35,31,.38);
}
body[data-gender="male"] .intro-shell h1 em{color:#f4cf81;font-style:normal}
body[data-gender="male"] .intro-shell .hero p{
  color:#fffaf1;
  font-size:clamp(14px,1.32vw,17px);
  line-height:1.54;
  max-width:385px;
  font-weight:450;
  text-shadow:0 2px 8px rgba(2,27,23,.35);
}
body[data-gender="male"] .intro-shell .actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:27px;
}
body[data-gender="male"] .intro-shell .actions .btn{
  min-height:46px;
  padding:12px 20px;
  border-radius:14px;
  font-size:14px;
  font-weight:750;
  box-shadow:0 4px 12px rgba(7,35,28,.18);
  transition:transform .15s ease,box-shadow .15s ease;
}
body[data-gender="male"] .intro-shell .actions .btn:active{transform:translateY(1px)}
body[data-gender="male"] .intro-shell .actions .btn.primary{
  color:#263a2e;
  background:#f4d08c;
  border:1px solid #e7bd6c;
}
body[data-gender="male"] .intro-shell .actions .btn.outline{
  color:#fffaf1;
  background:rgba(6,51,40,.78);
  border:1px solid rgba(236,218,176,.8);
}
body[data-gender="male"] .intro-shell .genderbar{
  display:block;
  position:relative;
  z-index:2;
  width:calc(100% - 28px);
  max-width:1100px;
  margin:0 auto 18px;
  padding:22px clamp(18px,4vw,31px);
  border-radius:21px;
  background:rgba(5,57,43,.97);
  border:1px solid #cfae6f;
  box-shadow:0 10px 26px rgba(12,44,35,.2);
  color:#fff9e9;
  backdrop-filter:none;
}
body[data-gender="male"] .intro-shell .genderbar::after{display:none}
body[data-gender="male"] .intro-shell .genderbar b{
  display:block;
  font:700 clamp(21px,2.5vw,29px)/1.22 Georgia,'Times New Roman',serif;
  color:#fffaf0;
}
body[data-gender="male"] .intro-shell .genderbar p{
  color:#ebf1e8;
  max-width:650px;
  margin:8px 0 15px;
  line-height:1.5;
  font-size:13px;
}
body[data-gender="male"] .intro-shell .genderbtns{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
body[data-gender="male"] .intro-shell .genderbtn{
  min-height:47px;
  padding:12px 17px;
  border-radius:13px;
  font-size:14px;
  font-weight:720;
  text-align:left;
  background:#f9f7ef;
  color:#203c2f;
  border:1px solid #e6dcc6;
  box-shadow:none;
}
body[data-gender="male"] .intro-shell #gender-male.active,
body[data-gender="male"] .intro-shell #gender-female.active{
  background:#f3d18a;
  color:#263a2e;
  border:1px solid #e4b967;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);
}
body[data-gender="male"] .intro-shell .genderbtn:hover{filter:brightness(1.05)}
body[data-gender="male"] .app > .home-design-traits{display:none !important}
/* Navigation is a REAL DOM bar separate from the photograph */
body[data-gender="male"] .app > .nav{
  display:flex !important;
  flex-wrap:nowrap;
  position:sticky;
  top:0;
  z-index:30;
  width:calc(100% - 24px);
  max-width:none;
  margin:12px auto 14px;
  padding:8px 10px;
  gap:5px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:thin;
  border:1px solid #c9ab74;
  border-radius:18px;
  background:#083e30;
  box-shadow:0 6px 17px rgba(10,49,36,.17);
}
body[data-gender="male"] .app > .nav button{
  flex:0 0 calc((100% - 20px)/5);
  min-width:0;
  order:20;
  white-space:normal;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:72px;
  padding:7px 3px;
  border:1px solid transparent;
  border-radius:12px;
  background:transparent;
  color:#f8f5eb;
  font-size:clamp(10px,1vw,13px);
  line-height:1.14;
  font-weight:550;
  box-shadow:none;
}
body[data-gender="male"] .app > .nav #nav-home{order:1}
body[data-gender="male"] .app > .nav #nav-habits{order:2}
body[data-gender="male"] .app > .nav #nav-breath{order:3}
body[data-gender="male"] .app > .nav #nav-nutrition{order:4}
body[data-gender="male"] .app > .nav #nav-preparation{order:5}
body[data-gender="male"] .app > .nav button.active,
body[data-gender="male"] .app > .nav button:hover{
  background:rgba(244,208,140,.13);
  color:#f5d38d;
  border-color:rgba(239,213,153,.25);
}
body[data-gender="male"] .app > .nav button::before{
  width:25px;
  height:25px;
  display:block;
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
}
body[data-gender="male"] .app > .nav button:not(#nav-home):not(#nav-habits):not(#nav-breath):not(#nav-nutrition):not(#nav-preparation){
  flex:0 0 auto;
  min-height:72px;
  padding:7px 14px;
}
body[data-gender="male"] .app > .nav button:not(#nav-home):not(#nav-habits):not(#nav-breath):not(#nav-nutrition):not(#nav-preparation)::before{display:none}
/* Original module logic stays intact; no old scenic image beneath real content */
body[data-gender="male"] main.content{
  scroll-margin-top:96px;
  background:#f7f5ec !important;
  background-image:linear-gradient(180deg,#f7f5ec,#fbfaf5 450px,#f6f7ef 100%) !important;
  padding-top:14px;
  color:#2d4639;
}
body[data-gender="male"] main.content > .preview-note{display:none}
body[data-gender="male"][data-current-tab]:not([data-current-tab="home"]) main.content > .journey,
body[data-gender="male"][data-current-tab]:not([data-current-tab="home"]) main.content > .sectionhead{display:none}
body[data-gender="male"] .navsection{scroll-margin-top:110px}
/* Live daily goals panel, not an illustration or fixed set of example tasks */
#today-goals{display:none}
body[data-current-tab="home"] #today-goals{display:block}
.today-goals{
  margin:4px 0 20px;
  padding:clamp(17px,4vw,25px);
  border-radius:20px;
  border:1px solid #d9d6c5;
  background:#fffdf7;
  box-shadow:0 8px 22px rgba(40,61,45,.08);
  color:#233e32;
}
.today-goals__head{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap;margin-bottom:14px;
}
.today-goals__head h2{
  margin:0;
  color:#1b4835;
  font:700 clamp(22px,3vw,27px)/1.2 Georgia,'Times New Roman',serif;
}
.today-goals__head p{
  margin:6px 0 0;color:#667567;font-size:12px;line-height:1.4;
}
.today-goals__count{
  flex-shrink:0;border:1px solid #d7ddcb;border-radius:20px;
  color:#2a6948;background:#ecf5e9;padding:7px 11px;font-size:12px;font-weight:750;
}
.today-goals__track{
  background:#e8e9df;border-radius:20px;height:6px;overflow:hidden;margin:0 0 14px;
}
.today-goals__track span{
  display:block;height:100%;border-radius:20px;background:#368054;transition:width .18s;
}
.today-goals__empty{
  padding:11px 0 17px;color:#607566;font-size:14px;line-height:1.45;
}
.today-goals__list{display:flex;flex-direction:column;gap:8px;margin:0 0 13px}
.today-goals__item{
  display:flex;align-items:center;gap:9px;min-height:51px;
  border:1px solid #e2e4d8;border-radius:13px;
  background:#f8faf5;padding:7px 9px;
}
.today-goals__item.done{background:#eff5ec}
.today-goals__item input[type="checkbox"]{
  flex:0 0 auto;width:20px;height:20px;accent-color:#167347;cursor:pointer;
}
.today-goals__item input[type="text"]{
  width:100%;min-width:0;border:0;background:transparent;
  color:#263d32;font-family:inherit;font-size:14px;font-weight:500;line-height:1.4;outline:none;padding:7px 2px;
}
.today-goals__item.done input[type="text"]{text-decoration:line-through;color:#7c8b7b}
.today-goals__item button{
  flex:0 0 auto;
  background:transparent;border:0;border-radius:9px;
  color:#819085;padding:7px 8px;cursor:pointer;
  font-size:20px;line-height:1;
}
.today-goals__item button:hover{background:#f9e9e4;color:#a5493f}
.today-goals__add{display:flex;gap:8px;align-items:stretch}
.today-goals__add input{
  min-width:0;flex:1;border:1px solid #cfd9ca;
  border-radius:12px;background:#fff;padding:12px 13px;
  color:#233b2e;font:inherit;font-size:14px;
}
.today-goals__add input:focus{outline:2px solid #d8b56e;outline-offset:1px}
.today-goals__add button{
  border:1px solid #d7ae65;border-radius:12px;
  background:#f1cf8c;color:#243b2c;padding:11px 17px;
  font-weight:750;cursor:pointer;
}
.today-goals__add button:active{transform:translateY(1px)}
.today-goals__help{margin:10px 0 0;font-size:12px;color:#758378}
/* Responsive: keep the man visible and the controls fully usable on a phone */
@media(max-width:759px){
 body[data-gender="male"] .intro-shell::before{background-position:76% center}
 body[data-gender="male"] .intro-shell::after{
   background:linear-gradient(90deg,rgba(5,43,39,.83),rgba(6,52,45,.57) 52%,rgba(8,49,44,.19) 95%),
   linear-gradient(0deg,rgba(7,40,37,.19),transparent 55%);
 }
 body[data-gender="male"] .intro-shell .hero{
   min-height:490px;
   padding:20px 18px 32px;
 }
 body[data-gender="male"] .intro-shell .brand{gap:8px}
 body[data-gender="male"] .intro-shell .logo{width:53px;height:53px}
 body[data-gender="male"] .intro-shell .brand b{
   font-size:clamp(16px,4.25vw,20px);letter-spacing:.8px;
 }
 body[data-gender="male"] .intro-shell .brand small{font-size:8px;letter-spacing:.9px}
 body[data-gender="male"] .intro-shell .switch{font-size:11px;padding:7px 9px}
 body[data-gender="male"] .intro-shell .hero-main{max-width:94%;margin-top:37px}
 body[data-gender="male"] .intro-shell .eyebrow{font-size:10px;letter-spacing:1.2px}
 body[data-gender="male"] .intro-shell h1{
   font-size:clamp(31px,7.8vw,42px);margin:18px 0 16px;
 }
 body[data-gender="male"] .intro-shell .hero p{max-width:315px;font-size:14px;line-height:1.48}
 body[data-gender="male"] .intro-shell .actions{margin-top:22px;gap:9px}
 body[data-gender="male"] .intro-shell .actions .btn{font-size:13px;padding:11px 14px;min-height:44px}
 body[data-gender="male"] .intro-shell .genderbar{margin:0 12px 16px;width:calc(100% - 24px);padding:18px}
 body[data-gender="male"] .intro-shell .genderbtns{grid-template-columns:1fr}
 body[data-gender="male"] .app > .nav{width:calc(100% - 14px);margin:8px 7px 12px;padding:6px 5px;gap:2px}
 body[data-gender="male"] .app > .nav button{
   flex:0 0 calc((100% - 8px)/5);
   padding:5px 2px;min-height:73px;font-size:10px;
 }
 body[data-gender="male"] .app > .nav button::before{width:23px;height:23px}
 .today-goals__add button{padding:10px 12px}
}
@media(max-width:380px){
 body[data-gender="male"] .intro-shell .top{align-items:flex-start}
 body[data-gender="male"] .intro-shell .brand b{font-size:16px}
 body[data-gender="male"] .intro-shell .switch{font-size:10px}
 .today-goals__head h2{font-size:22px}
 .today-goals__add input{padding:10px}
}
@media(prefers-reduced-motion:reduce){
 .today-goals__track span,body[data-gender="male"] .intro-shell .actions .btn{transition:none}
}


/* Linked program goals · subtle native edit link */
.today-goals__open{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 margin-top:10px;
 padding:10px 14px;
 border:1px solid #c8dacb;
 border-radius:11px;
 background:#f2f7ef;
 color:#1d6540;
 font:650 13px/1.35 system-ui,-apple-system,Arial,sans-serif;
 cursor:pointer;
 transition:background .15s ease, border-color .15s ease;
}
.today-goals__open:hover,.today-goals__open:focus-visible{
 background:#e4f1e3;
 border-color:#9abfa5;
}
.today-goals__open:focus-visible{outline:2px solid #be9550;outline-offset:2px}