/* LIGHT RE-SKIN. physical.html carries its own dark palette + components; this
   remaps every token to the app.css system so it matches Today. Logic untouched. */

body.pm-premium{background:var(--bg);color:var(--ink)}
body.pm-premium .light,body.pm-premium::before,body.pm-premium::after{display:none!important}
.back{display:none}
.col{border-left:none;border-right:none;padding-bottom:120px}
.col::before{display:none}/* cards + inputs become white paper */

.card{background:var(--surface);border:none;border-radius:var(--r-lg);box-shadow:var(--shadow-1)}
input[type=number],input[type=text]{background:var(--surface);border:none;border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--hairline);color:var(--ink);font-size:16px}
input:focus{outline:2px solid var(--accent);outline-offset:-2px;background:var(--surface)}/* buttons: one dark primary, like the rest of the app */

.btn{background:#141516;color:var(--ink-invert);border-radius:var(--r-md);padding:18px;font-size:16.5px;box-shadow:none;transition:transform var(--t-micro) var(--ease),background var(--t-norm) var(--ease),opacity var(--t-norm)}
.btn:hover{transform:none}
.btn:active{transform:scale(.98)}
.btn.acc{background:var(--accent);color:var(--accent-ink)}
.btn.acc:hover{background:var(--accent-hover)}
.btn.ghost{background:var(--surface);color:var(--ink);border:none;box-shadow:0 1px 2px rgba(30,31,33,.05);
  font-family:var(--sans);font-size:15px;letter-spacing:0;text-transform:none;font-weight:600;padding:16px}/* The dark theme's hover turned ghost text white, which on this white button
   made it vanish under the cursor, and under a thumb that just tapped there. */

.btn.ghost:hover{color:var(--ink);border-color:transparent}
.btn.sm{font-size:14px;padding:12px 16px}
.btn:disabled{background:var(--hairline);color:var(--ink-3)}
.opt{background:var(--surface);border:none;border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--hairline);color:var(--ink-2);font-size:15px}
.opt.sel{background:var(--accent);color:var(--accent-ink);box-shadow:none}
.chip{background:var(--surface);border:none;box-shadow:inset 0 0 0 1px var(--hairline);color:var(--ink)}
.mini{background:var(--surface);border:none;box-shadow:inset 0 0 0 1px var(--hairline);color:var(--ink-2);font-size:14px;padding:11px 14px}
.mini.on{background:var(--accent);color:var(--accent-ink)}
.tick,.ltick{border-color:var(--hair)}
.meal.logged .tick,.lift.done .ltick{background:var(--accent);border-color:transparent;box-shadow:none}
.meal.logged .tick svg,.lift.done .ltick svg{stroke:var(--accent-ink)}
.step .box{background:var(--surface);box-shadow:inset 0 0 0 1px var(--hair)}/* headings + labels: plain words, not tiny caps */

h1{font-family:var(--serif);font-weight:600;letter-spacing:-.03em}
.kicker{font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-3)}
.kicker::before{display:none}
.sec-head h2{font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink)}
.sec-head h2::before{display:none}
.sec-head .ix,.reveal-h .ix{font-family:var(--sans);font-size:var(--ui-meta,14px);letter-spacing:0;text-transform:none;color:var(--ink-3)}
.grp-title{font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-3)}
.field>label{font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-2)}/* the mode bar + bottom tabs */

.modebar{background:var(--surface);border:none;box-shadow:inset 0 0 0 1px var(--hairline)}
.modebar button{font-family:var(--sans);font-size:var(--ui-meta,14px);letter-spacing:0;text-transform:none;color:var(--ink-3)}
.modebar button.on{background:#141516;color:var(--ink-invert)}
.tabs{background:rgba(255,255,255,.94);border:1px solid var(--hairline);box-shadow:0 8px 30px -12px rgba(30,31,33,.2);bottom:calc(18px + env(safe-area-inset-bottom))}
.tabs button{font-family:var(--sans);font-size:14px;letter-spacing:0;text-transform:none;color:var(--ink-3)}
.tabs button.on{background:#141516;color:var(--ink-invert);box-shadow:none}/* rings + charts read on white */

.ring .rt{stroke:var(--hairline)}
.ring .ra{stroke:var(--accent);filter:none}
.ring-c b{font-family:var(--sans)}
.spark path{stroke:var(--accent);filter:none}
.spark circle{fill:var(--accent)}
.adaptcard{background:var(--surface);border:none;box-shadow:0 1px 2px rgba(30,31,33,.05),0 8px 24px -12px rgba(30,31,33,.16)}
.banner{background:var(--surface);border:none;box-shadow:0 1px 2px rgba(30,31,33,.04),0 8px 24px -12px rgba(30,31,33,.14)}
.banner::after{display:none}
.banner .orb{background:var(--accent);box-shadow:none}
.banner .who{font-family:var(--sans);font-size:var(--ui-meta,14px);letter-spacing:0;text-transform:none}/* These two carried hard-coded white from the dark palette, so on white paper
   they were invisible: auxe's daily line, and the weight +/- buttons. */

.banner .ln{color:var(--ink)}
.wt .wstep{background:var(--surface);border:none;box-shadow:inset 0 0 0 1px var(--hairline);color:var(--ink)}
.wt .wstep:hover{background:var(--bg)}
.changed{background:var(--surface);border:none;border-left:3px solid #111213}
.photoslot img,.thumb{border-color:var(--hairline)}
.photoslot .empty{border-color:var(--hair)}
@media(max-width:760px){.tabs{bottom:calc(16px + env(safe-area-inset-bottom))}}