/* polish.css: the visual layer. Loads last. Colour, depth, type and motion only: no selector here changes layout or behaviour.
   One accent (electric blue). Every animation lives under prefers-reduced-motion:no-preference. */
:root{--faint:#8592c4;--r:18px;--r-in:12px;--r-ctl:11px;--ease:cubic-bezier(.2,.8,.2,1);--ring:#b4c1ff;
  --hair:linear-gradient(165deg,rgba(255,255,255,.26),rgba(255,255,255,.05) 38%,rgba(108,134,255,.16));
  --lift:inset 0 1px 0 rgba(255,255,255,.07),0 0 0 .5px rgba(0,0,0,.45),0 2px 4px rgba(0,0,0,.25),0 18px 40px -22px rgba(0,0,0,.75)}
::selection{background:rgba(0,80,240,.5);color:#fff}
*{scrollbar-width:thin;scrollbar-color:rgba(159,177,255,.3) transparent}

/* ---------- atmosphere: aurora + grain (html paints the base colour, body goes clear) ---------- */
body{background:none;-webkit-font-smoothing:antialiased;font-optical-sizing:auto;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:-20%;z-index:-2;pointer-events:none;background:radial-gradient(38% 34% at 82% 8%,rgba(0,80,240,.26),transparent 70%),radial-gradient(34% 30% at 10% 22%,rgba(108,134,255,.13),transparent 70%),radial-gradient(42% 36% at 68% 94%,rgba(75,47,208,.14),transparent 70%)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- header, brand, tab bar ---------- */
header.top{gap:12px 16px;margin-bottom:22px}
.brand{letter-spacing:-.03em}
.mark{box-shadow:0 8px 24px -8px rgba(70,99,255,.85),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -6px 12px -6px rgba(0,30,160,.45)}
#status::before{content:"";display:inline-block;width:6px;height:6px;margin:0 7px 1px 0;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 18%,transparent)}
nav.tabs{position:relative;gap:2px;padding:4px;border-color:transparent;border-radius:15px;background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.03)),rgba(9,14,30,.45);box-shadow:var(--lift);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%)}
nav.tabs a{position:relative;padding:7px 15px;border-radius:11px;font-weight:500;letter-spacing:-.01em;transition:color .2s,background .2s,box-shadow .2s}
nav.tabs a:hover{background:rgba(255,255,255,.06);color:var(--text)}
nav.tabs a.on{color:#fff;background:linear-gradient(180deg,rgba(108,134,255,.36),rgba(0,80,240,.2));box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 8px 20px -10px rgba(0,80,240,.95)}
nav.tabs a.on::after{content:"";position:absolute;left:24%;right:24%;bottom:3px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--accent2),transparent);box-shadow:0 0 10px var(--accent)}
nav.tabs a:focus-visible{outline-offset:1px}

/* gradient hairline border (replaces the flat 1px border) */
.card:not(.pcard){border-color:transparent}
.pcard{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent}
.card::before,nav.tabs::before,.nowbox::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:var(--hair);pointer-events:none;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}
.pcard::before{left:-4px}

/* ---------- glass surfaces ---------- */
.card{padding:16px 18px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.024)),rgba(9,14,30,.5);box-shadow:var(--lift);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%)}
.pcard,.pb{transition:transform .22s var(--ease),box-shadow .22s var(--ease)}
.pcard:hover,.pb:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 0 .5px rgba(0,0,0,.45),0 26px 50px -24px rgba(0,0,0,.9),0 10px 30px -18px rgba(0,80,240,.7)}
.pcard:hover::before,.pb:hover::before{background:linear-gradient(165deg,rgba(180,193,255,.7),rgba(159,177,255,.12) 45%,rgba(108,134,255,.34))}
.pcard strong,.pb strong{letter-spacing:-.015em}

/* ---------- type rhythm ---------- */
.vh{margin:6px 0 22px}
.vh h1{font-size:clamp(1.9rem,4.4vw,3.2rem);font-weight:660;letter-spacing:-.05em;line-height:1.02}
.vh h1 em{background-image:linear-gradient(100deg,#fff 0%,#b4c1ff 42%,#6c86ff 100%);padding-right:.04em}
.vh p{margin-top:8px;font-size:.98rem}
h2.h{font-weight:500;letter-spacing:.12em}
.meta,.due,.tm,.pill,.chip,.st,.ct-date,.ct-num,.sc-hdh,.sc-gut span,.sc-btime,.sc-total b,.hbars div,.inv td,.inv th,.wh-count,#status{font-variant-numeric:tabular-nums}
.areah{letter-spacing:-.01em;margin:26px 0 10px}
.areah::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--edge2),transparent)}
.pill{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1)}

/* ---------- Today: the Now box and the timeline ---------- */
.nowbox{position:relative;isolation:isolate;overflow:hidden;border-color:transparent;border-radius:22px;padding:20px 22px 22px;background:radial-gradient(120% 150% at 0% 0%,rgba(0,80,240,.34),rgba(0,80,240,.07) 55%,transparent),linear-gradient(135deg,rgba(108,134,255,.18),rgba(108,134,255,.04)),rgba(8,13,30,.62);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 24px 60px -30px rgba(0,80,240,.55),0 2px 6px rgba(0,0,0,.3)}
.nowbox::before{background:linear-gradient(150deg,rgba(180,193,255,.7),rgba(108,134,255,.12) 45%,rgba(108,134,255,.4))}
.nowbox::after{content:"";position:absolute;z-index:-1;inset:-40% -20%;pointer-events:none;background:radial-gradient(38% 46% at 72% 38%,rgba(159,177,255,.2),transparent 70%)}
.nowbox .meta{color:var(--dim)}
.nowbox .meta:first-child{color:var(--accent2);letter-spacing:.1em}
.nowbox .big{font-size:clamp(1.6rem,3.4vw,2.35rem);letter-spacing:-.045em;line-height:1.06;margin:8px 0 6px}
.blk{border-radius:var(--r-in);background:linear-gradient(90deg,color-mix(in srgb,var(--c,#6c86ff) 11%,rgba(5,9,20,.62)),rgba(5,9,20,.5));border-color:rgba(255,255,255,.08);border-left-color:var(--c,var(--accent));box-shadow:inset 0 1px 0 rgba(255,255,255,.05);transition:border-color .2s,background .2s,box-shadow .2s}
.blk:hover{border-color:rgba(255,255,255,.18);border-left-color:var(--c,var(--accent))}
.blk.now{border-color:var(--c);box-shadow:0 0 0 1px var(--c) inset,0 14px 34px -18px var(--c);background:linear-gradient(90deg,color-mix(in srgb,var(--c,#6c86ff) 22%,rgba(5,9,20,.6)),rgba(108,134,255,.1))}
.blk.past{opacity:.76}
.blk .pg{height:3px;overflow:hidden;box-shadow:0 0 12px var(--c);opacity:1}
.blk .pg::after{content:"";position:absolute;right:0;top:0;bottom:0;width:44px;background:linear-gradient(90deg,transparent,#fff)}
.hbars i{border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,var(--accent2),var(--accent) 55%,#2b49d8);box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.hbars .td i{background:linear-gradient(180deg,#fff,var(--accent2) 38%,var(--accent));box-shadow:0 0 20px -2px rgba(108,134,255,.9),inset 0 1px 0 #fff}
.hbars .td{color:var(--text)}

/* ---------- lists, ticks, stars ---------- */
.rowi{border-top-color:rgba(255,255,255,.07)}
.rowi>*,.rowi .meta{min-width:0;overflow-wrap:anywhere}
.rowi:hover,.wh-row:hover{background:linear-gradient(90deg,rgba(108,134,255,.07),transparent 80%)}
.rowi .t[data-edit]{transition:color .18s}.rowi .t[data-edit]:hover{color:var(--accent2)}
.tick{border-color:rgba(255,255,255,.3);border-radius:7px;transition:border-color .18s,background .18s,box-shadow .2s}
.tick:hover{box-shadow:0 0 0 4px rgba(61,220,151,.14)}
.tick.on{background:linear-gradient(180deg,#5ff0b0,var(--ok));box-shadow:0 0 14px -2px rgba(61,220,151,.7)}
.star{transition:color .18s,text-shadow .2s}.star:hover{color:var(--warn)}.star.on{text-shadow:0 0 12px rgba(255,200,87,.6)}
.inv tbody tr{transition:background .18s}.inv tbody tr:hover{background:rgba(108,134,255,.07)}
.inv td,.inv th{border-top-color:rgba(255,255,255,.07)}

/* ---------- buttons ---------- */
.btn,button.primary,button.danger,.vh>button,.bar>button,.mrow button,.ct-colh button,.wh-act button,.wh-top button,.sktable>button,.minibtns button,.ct-arrow,.ct-prof,.ct-f,.sc-add{border-radius:var(--r-ctl);background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.045));border-color:rgba(255,255,255,.12);font-weight:500;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 1px 2px rgba(0,0,0,.3);transition:border-color .18s,background .2s,box-shadow .22s,transform .18s var(--ease),color .18s}
.btn:hover,button.primary:hover,.vh>button:hover,.bar>button:hover,.mrow button:hover,.ct-colh button:hover,.wh-act button:hover,.wh-top button:hover,.sktable>button:hover,.minibtns button:hover,.ct-arrow:hover:not(:disabled),.ct-prof:hover,.sc-add:hover{border-color:rgba(159,177,255,.7);background:linear-gradient(180deg,rgba(108,134,255,.28),rgba(108,134,255,.12));box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 8px 20px -10px rgba(0,80,240,.85)}
button.primary,.sc-add{color:#fff;background:linear-gradient(180deg,#4262f6,#2a4be6);border-color:rgba(159,177,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 8px 22px -8px rgba(0,80,240,.9)}
button.primary:hover,.sc-add:hover{background:linear-gradient(180deg,#5473ff,#3558f2);border-color:rgba(180,193,255,.85);box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 12px 28px -8px rgba(0,80,240,1)}
button.danger:hover{border-color:var(--bad);background:rgba(255,123,123,.14);box-shadow:0 8px 20px -12px rgba(255,123,123,.7)}
.ct-arrow:disabled{box-shadow:none}
.ct-prof[aria-pressed=true]{background:linear-gradient(180deg,rgba(108,134,255,.3),rgba(0,80,240,.14))}
.ct-f[aria-pressed=true],.seg button.on,.sc-pill[aria-pressed=true]{background:linear-gradient(180deg,rgba(108,134,255,.36),rgba(0,80,240,.2));box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.seg,.sc-pills{border-color:rgba(255,255,255,.1);box-shadow:inset 0 1px 3px rgba(0,0,0,.4)}
.seg button{transition:background .18s,color .18s}.seg button:hover:not(.on){background:rgba(255,255,255,.06);color:var(--text)}

/* ---------- inputs ---------- */
input,select,textarea{border-radius:var(--r-ctl);background-color:rgba(4,8,20,.62);border-color:rgba(255,255,255,.1);box-shadow:inset 0 1px 3px rgba(0,0,0,.45);transition:border-color .18s,box-shadow .2s,background-color .18s}
input:hover,select:hover,textarea:hover{border-color:rgba(255,255,255,.22)}
input:not([type=checkbox]):focus,select:focus,textarea:focus{outline:none;border-color:var(--accent2);box-shadow:inset 0 1px 3px rgba(0,0,0,.45),0 0 0 3px rgba(108,134,255,.28)}
input[type=checkbox]{box-shadow:none;accent-color:var(--accent)}
::placeholder{color:var(--faint);opacity:1}
select{max-width:100%;text-overflow:ellipsis;appearance:none;-webkit-appearance:none;padding-right:32px;background-repeat:no-repeat;background-position:right 11px center;background-size:12px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%239fb1ff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5'/%3E%3C/svg%3E")}
:focus-visible{outline:2px solid var(--ring);outline-offset:3px}
.wh-search input:focus{box-shadow:inset 0 1px 3px rgba(0,0,0,.45),0 0 0 3px rgba(108,134,255,.28)}

/* ---------- empty states ---------- */
p.empty,div.empty{display:grid;justify-items:center;gap:10px;padding:22px 16px;border:1px dashed rgba(255,255,255,.14);border-radius:14px;background:radial-gradient(80% 120% at 50% 0%,rgba(108,134,255,.09),transparent 70%);color:var(--faint);text-align:center;line-height:1.45}
p.empty::before,div.empty::before{content:"";width:34px;height:34px;border-radius:11px;background:rgba(108,134,255,.12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239fb1ff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13l2.2-7h11.6L20 13v5H4z'/%3E%3Cpath d='M4 13h5l1 2.2h4L15 13h5'/%3E%3C/svg%3E") center/18px no-repeat;box-shadow:inset 0 0 0 1px rgba(159,177,255,.24)}

/* ---------- Schedule ---------- */
.sc-scroll{border-color:rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)),rgba(9,14,30,.5);box-shadow:var(--lift)}
.sc-head{background:rgba(10,16,36,.92);border-bottom-color:rgba(255,255,255,.14)}
.sc-hd.sc-today{background:linear-gradient(180deg,rgba(108,134,255,.3),rgba(108,134,255,.08));color:#fff}
.sc-b{border-radius:10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 6px 14px -10px rgba(0,0,0,.8)}
.sc-now{border-top-color:var(--bad);box-shadow:0 0 12px rgba(255,123,123,.55)}
.sc-now::before{box-shadow:0 0 0 3px rgba(255,123,123,.25)}
.sc-pill-today::after{box-shadow:0 0 8px var(--ok)}

/* ---------- Content and Where ---------- */
.ct-prof{border-radius:var(--r)}
.ct-item,.ct-pillar{border-radius:var(--r-in);background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.ct-item:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 24px -16px rgba(0,80,240,.7)}
.ct-tile{border-radius:var(--r-in)}
.ct-tile[data-st=drafted]{opacity:.9}
.wh-row{border-top-color:rgba(255,255,255,.07)}
.wh-kind,.st{box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}

/* ---------- modal and toast ---------- */
dialog{border-color:rgba(255,255,255,.14);border-radius:22px;padding:22px;background:linear-gradient(180deg,rgba(20,30,62,.97),rgba(9,14,32,.98));box-shadow:0 0 0 1px rgba(0,0,0,.5),0 40px 100px -20px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.09)}
dialog::backdrop{background:radial-gradient(60% 50% at 50% 40%,rgba(0,40,140,.28),rgba(2,5,13,.82));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
dialog h3{font-size:1.15rem;letter-spacing:-.03em}
.toast{background:rgba(11,18,38,.9);border-color:rgba(255,255,255,.16);border-radius:14px;box-shadow:0 18px 50px -12px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}

/* ---------- narrower screens: brand, status and Hermes share row one, the tab bar gets row two ---------- */
@media(max-width:1180px){nav.tabs{order:5}}
@media(max-width:700px){
  header.top{gap:10px 8px}
  #status{font-size:.72rem}
  nav.tabs{order:5;flex:0 0 100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr))}
  nav.tabs a{padding:8px 4px;text-align:center;font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .card{padding:14px 15px}
  .blk{grid-template-columns:auto 1fr}.blk .tm{white-space:nowrap}
}

/* ---------- motion: hover lifts, entrance, and the living bits ---------- */
@media(prefers-reduced-motion:no-preference){
  body::before{animation:os-drift 32s ease-in-out infinite alternate}
  main#view{animation:os-in .5s var(--ease)}
  .btn:hover,button.primary:hover,.vh>button:hover,.bar>button:hover,.mrow button:hover,.ct-colh button:hover,.wh-act button:hover,.wh-top button:hover,.sktable>button:hover,.sc-add:hover,.pb:hover{transform:translateY(-1px)}
  .pb:hover{transform:translateY(-2px)}
  button:active,.btn:active{transform:scale(.97)}
  .ct-open:active,.wh-label:active,.ct-open:hover,.wh-label:hover{transform:none}
  .star:hover{transform:scale(1.18)}
  .star{transition:color .18s,text-shadow .2s,transform .18s var(--ease)}
  .nowbox{animation:os-breathe 5.5s ease-in-out infinite}
  .nowbox::after{animation:os-drift 14s ease-in-out infinite alternate}
  .blk .pg::after{animation:os-pulse 2.4s ease-in-out infinite}
  .sc-now::before{animation:os-ping 2.6s ease-out infinite}
  dialog[open]{animation:os-modal .26s var(--ease)}
  dialog[open]::backdrop{animation:os-fade .26s ease}
  .toast{animation:os-toast .28s var(--ease)}
  @keyframes os-drift{to{transform:translate3d(3%,-2%,0) scale(1.08)}}
  @keyframes os-in{from{opacity:0;transform:translateY(6px)}}
  @keyframes os-breathe{50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 24px 70px -22px rgba(0,80,240,.95),0 2px 6px rgba(0,0,0,.3)}}
  @keyframes os-pulse{0%,100%{opacity:.35}50%{opacity:1}}
  @keyframes os-ping{0%{box-shadow:0 0 0 0 rgba(255,123,123,.6)}70%,100%{box-shadow:0 0 0 9px rgba(255,123,123,0)}}
  @keyframes os-modal{from{opacity:0;transform:translateY(10px) scale(.97)}}
  @keyframes os-fade{from{opacity:0}}
  @keyframes os-toast{from{opacity:0;transform:translate(-50%,10px)}}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:.01ms!important}button:active,.pcard:hover,.pb:hover{transform:none}}