/* ============================================================================
   Habit Tracker — the styles, taken out of the app.

   GENERATED. Do not hand-edit. Regenerate with:
     python3 tools/extract-habit-css.py

   Three of the four real apps on this page carry their own CSS inside
   block.js and inject it on mount. The Habit Tracker does not: its rules
   live in main-app/styles-v2.css and main-app/styles-v6.css, because in the
   app it is drawn inside the shell that already loads them.

   This file is every rule in those two stylesheets whose selector mentions
   `htx`, copied verbatim and in source order. Nothing is rewritten, so the
   app looks here exactly as it looks in Life Base.
   ========================================================================== */

/* ---- from styles-v2.css ---- */
.htx{position:relative;width:100%;min-width:480px;max-width:100%;
  background:#fbfaf8;border:1px solid #ece9e6;border-radius:20px;padding:18px 16px 16px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  user-select:none;color:#3a3836;}
.htx-name,.htx-time,.htx-perfname,.htx-note,.htx-gtitle{user-select:text;-webkit-user-select:text;cursor:text;}
.htx-name a.lb-link{cursor:pointer}
.htx-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;padding:0 2px}
.htx-gtitle{font-size:22px;font-weight:600;letter-spacing:-.5px;color:#242424;}
.htx-tabs{display:inline-flex;background:#f1efec;border-radius:9px;padding:2px;gap:1px}
.htx-tab{font-size:11.5px;color:#6e6c6a;padding:4px 11px;border-radius:7px;cursor:pointer}
.htx-tab:hover{color:#242424}
.htx-tab.sel{background:#fff;color:#242424;font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.htx-datenav{display:flex;align-items:center;justify-content:center;gap:8px;padding:4px 0 16px}
.htx-chev{width:36px;height:36px;border-radius:10px;border:1px solid #ece9e6;
  display:inline-flex;align-items:center;justify-content:center;background:transparent;}
.htx-chev svg{width:15px;height:15px}
.htx-chev:hover{background:#f1efec}
.htx-datebtn{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:10px;background:transparent}
.htx-datebtn:hover{background:#f1efec}
.htx-datetext{font-size:16px;font-weight:500;color:#242424}
.htx-todaypill{font-size:10px;font-weight:600;letter-spacing:.5px;padding:2px 6px;border-radius:4px;
  background:rgba(100,95,240,.15);color:rgb(130,125,250);}
.htx-list{display:flex;flex-direction:column;gap:14px;padding:2px 2px 6px}
.htx-card{position:relative;background:#fff;border:1px solid #ece9e6;border-radius:20px;padding:15px 16px;}
.htx-cardmain{display:flex;align-items:center;gap:12px}
.htx-check{width:26px;height:26px;flex:none;background:none;border:0;padding:0;cursor:pointer;
  transition:transform .08s;}
.htx-check:active{transform:scale(.85)}
.htx-check svg{width:24px;height:24px;display:block}
.htx-check.done svg{animation:htx-pop .18s ease-out}
.htx-mid{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.htx-name{font-size:16px;color:#242424;line-height:1.3}
.htx-name.done{color:#a19f9d;text-decoration:line-through;text-decoration-color:#a19f9d}
.htx-time{font-size:12px;color:#a19f9d}
.htx-icons{display:flex;gap:8px;align-items:center}
.htx-icon{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:0;cursor:pointer;border-radius:8px;}
.htx-icon svg{width:15px;height:15px}
.htx-icon:hover{background:#f1efec}
.htx-actions{display:flex;gap:4px;flex:none;margin-left:6px;
  visibility:hidden;}
.htx-card:hover .htx-actions{visibility:visible}
.htx-act{width:26px;height:26px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;
  background:#f1efec;border:0;cursor:pointer;}
.htx-act svg{width:14px;height:14px}
.htx-act:hover{background:#e9e6e2}
.htx-kids{display:flex;flex-direction:column;gap:14px;padding:16px 0 2px 32px}
.htx-kidrow{display:flex;align-items:center;gap:12px}
.htx-card.drop-before{box-shadow:inset 0 2px 0 0 rgb(130,125,250)}
.htx-card.drop-after{box-shadow:inset 0 -2px 0 0 rgb(130,125,250)}
.htx-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:44px 20px;text-align:center}
.htx-empty-ic{width:44px;height:44px;opacity:.9;margin-bottom:4px}
.htx-empty-t1{font-size:15px;font-weight:600;color:#6e6c6a}
.htx-empty-t2{font-size:13px;color:#a19f9d}
.htx-perf{padding:2px}
.htx-perfcard{background:#fff;border:1px solid #ece9e6;border-radius:20px;padding:4px 16px}
.htx-perfrow{display:flex;align-items:center;gap:12px;padding:11px 0}
.htx-perfrow.sep{border-top:1px solid #ece9e6}
.htx-perfrow.dim{opacity:.5}
.htx-perfname{font-size:15px;color:#242424;flex:1;min-width:0}
.htx-perfcount{font-size:12px;width:44px;text-align:center;font-variant-numeric:tabular-nums;flex:none}
.htx-perfbar{width:60px;height:5px;border-radius:999px;background:#eceae6;overflow:hidden;flex:none}
.htx-perffill{display:block;height:100%;border-radius:999px}
.htx-perfrate{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;width:44px;text-align:right;flex:none}
.htx-perfdash{flex:none;color:#a19f9d}
.htx-perfsec{font-size:10.5px;letter-spacing:.14em;color:#a19f9d;padding:16px 6px 6px;
  text-transform:uppercase;}
.htx-nextwrap{padding:2px}
.htx-nextrow{display:flex;align-items:center;gap:12px;padding:13px 16px}
.htx-daycaps{display:flex;gap:4px;flex-wrap:wrap}
.htx-daycap{font-size:10px;padding:2px 6px;border-radius:999px;
  background:rgba(130,125,250,.15);color:rgb(130,125,250);}
.htx-activate{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;
  padding:6px 10px;border-radius:999px;background:rgba(52,199,89,.15);color:rgb(52,199,89);
  border:0;cursor:pointer;flex:none;}
.htx-activate svg{width:9px;height:9px}
.htx-activate:hover{background:rgba(52,199,89,.25)}
.htx-nextrow .htx-act{display:none}
.htx-nextrow:hover .htx-act{display:inline-flex}
.htx-fab{position:absolute;right:16px;bottom:16px;width:52px;height:52px;border-radius:50%;
  background:rgb(99,95,236);border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(99,95,236,.35);}
.htx-fab.purple{background:rgb(168,85,247);box-shadow:0 4px 14px rgba(168,85,247,.35)}
.htx-fab svg{width:20px;height:20px}
.htx-fab:hover{filter:brightness(1.1)}
.htx-fabmenu{position:absolute;right:16px;bottom:76px;z-index:8;
  background:#fff;border:1px solid #ece9e6;border-radius:12px;
  padding:4px;box-shadow:0 8px 24px rgba(0,0,0,.12);}
.htx-fabitem{display:flex;align-items:center;gap:9px;width:100%;padding:8px 12px;border-radius:8px;
  font-size:13px;color:#3a3836;background:transparent;border:0;cursor:pointer;
  white-space:nowrap;}
.htx-fabitem svg{width:14px;height:14px}
.htx-fabitem:hover{background:#f1efec}
.htx-overlay{position:absolute;inset:0;z-index:20;background:rgba(0,0,0,.18);
  backdrop-filter:blur(2px);border-radius:20px;
  display:flex;align-items:center;justify-content:center;padding:18px;}
.htx-sheet{width:100%;max-width:380px;max-height:100%;overflow-y:auto;
  background:#fff;border:1px solid #ece9e6;border-radius:20px;
  padding:18px;display:flex;flex-direction:column;gap:10px;
  box-shadow:0 16px 48px rgba(0,0,0,.14);}
.htx-sheet-title{font-size:17px;font-weight:600;color:#242424;text-align:center;padding-bottom:2px}
.htx-seclabel{font-size:10px;letter-spacing:.14em;color:#a19f9d;padding-top:4px}
.htx-input{background:#fbfaf8;border:1px solid #ece9e6;border-radius:10px;
  padding:9px 12px;font-size:14px;color:#242424;outline:none;width:100%;}
.htx-input::placeholder{color:#a19f9d}
.htx-input:focus{border-color:rgb(130,125,250)}
.htx-input.ta{resize:vertical;min-height:64px;font-family:inherit;line-height:1.4}
.htx-daysel{display:flex;gap:8px;justify-content:center;padding:2px 0}
.htx-daypill{width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;color:#6e6c6a;
  border:1px solid #e2ded9;background:transparent;cursor:pointer;}
.htx-daypill:hover{border-color:#a19f9d}
.htx-daypill.sel{background:rgb(130,125,250);border-color:rgb(130,125,250);color:#fff}
.htx-trackrow{display:flex;align-items:center;justify-content:space-between;
  font-size:13.5px;color:#3a3836;padding:4px 2px;}
.htx-switch{width:44px;height:26px;border-radius:999px;background:#e2ded9;position:relative;cursor:pointer;
  transition:background .12s;flex:none;}
.htx-switch.on{background:rgb(52,199,89)}
.htx-knob{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.3);transition:left .12s;}
.htx-switch.on .htx-knob{left:20px}
.htx-sheet-actions{display:flex;gap:8px;justify-content:flex-end;padding-top:6px}
.htx-btn{padding:8px 16px;border-radius:10px;font-size:13.5px;font-weight:600;border:0;cursor:pointer;}
.htx-btn.ghost{background:transparent;color:#6e6c6a}
.htx-btn.ghost:hover{color:#242424}
.htx-btn.solid{background:rgb(130,125,250);color:#fff}
.htx-btn.solid:hover{filter:brightness(1.1)}
.htx-btn.solid:disabled{opacity:.4;cursor:default;filter:none}
.htx-btn.danger{background:rgb(255,69,58);color:#fff}
.htx-kiditem{display:flex;align-items:center;justify-content:space-between;
  padding:7px 10px;background:#fbfaf8;border:1px solid #ece9e6;border-radius:8px;font-size:13px;color:#3a3836;
  margin-bottom:5px;}
.htx-kiddel{background:none;border:0;color:#a19f9d;cursor:pointer;font-size:11px}
.htx-kiddel:hover{color:#242424}
.htx-projicon{width:26px;height:26px;flex:none;display:flex;align-items:center;justify-content:center}
.htx-projicon svg{width:22px;height:22px}
.htx-kidrow{cursor:grab}
.htx-kidrow:active{cursor:grabbing}
.htx-kidrow .htx-name{font-size:15px}
.htx-kidrow .htx-icons{margin-left:auto}
.htx-kidrow.drop-before{box-shadow:inset 0 2px 0 0 rgb(130,125,250)}
.htx-kidrow.drop-after{box-shadow:inset 0 -2px 0 0 rgb(130,125,250)}
.htx-linkbtn{width:100%;text-align:left;background:#fbfaf8;border:1px solid #ece9e6;border-radius:10px;
  padding:9px 12px;font-size:14px;color:#242424;cursor:pointer;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.htx-linkbtn.empty{color:#a19f9d}
.htx-linkbtn:hover{border-color:rgb(130,125,250)}
.htx-childlist{display:flex;flex-direction:column;gap:8px}
.htx-childedit{border:1px solid #ece9e6;border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:9px;background:#fff}
.htx-childtop{display:flex;align-items:center;gap:8px}
.htx-childtop .cname{flex:1}
.htx-childcfg{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.htx-childcfg .htx-daysel{gap:5px;padding:0;justify-content:flex-start;flex-wrap:wrap}
.htx-childcfg .htx-daypill{width:27px;height:27px;font-size:10.5px}
.htx-childcfg .ctime{width:96px;flex:none}
.htx-childcfg .clink{flex:1;min-width:130px;display:flex}
.htx-childcfg .clink .htx-linkbtn{padding:6px 10px;font-size:12.5px}
.htx-cardgrip,.htx-rowgrip{flex:none;width:14px;display:flex;align-items:center;justify-content:center;
  cursor:grab;opacity:0;transition:opacity .12s;}
.htx-cardgrip svg,.htx-rowgrip svg{width:9px;height:15px;fill:#c4c1bd}
.htx-card:hover .htx-cardgrip,.htx-kidrow:hover .htx-rowgrip{opacity:1}
.htx-cardgrip:active,.htx-rowgrip:active{cursor:grabbing}
.htx-projnote{color:#a19f9d;font-size:13px;font-style:italic;padding-top:8px}
.htx-addhabit{width:100%;padding:10px;border:1px dashed #d6d2cd;border-radius:10px;background:#fbfaf8;
  color:rgb(130,125,250);font-size:13px;font-weight:600;cursor:pointer;}
.htx-addhabit:hover{border-color:rgb(130,125,250);background:#fff}
.htx-confirm{width:100%;max-width:320px;background:#fff;border:1px solid #ece9e6;
  border-radius:18px;padding:18px;box-shadow:0 16px 48px rgba(0,0,0,.14);}
.htx-confirm-t{font-size:16px;font-weight:600;color:#242424;padding-bottom:6px}
.htx-confirm-m{font-size:13px;color:#6e6c6a;line-height:1.45}
.htx-pop{position:fixed;z-index:1300;max-width:300px;min-width:200px;
  background:#fff;border:1px solid #ece9e6;border-radius:12px;
  padding:12px 14px;font-size:13px;color:#3a3836;line-height:1.5;
  box-shadow:0 10px 30px rgba(0,0,0,.12);white-space:pre-wrap;}
.htx-prev{background:#fbfaf8;border-radius:8px;padding:7px 8px;display:flex;flex-direction:column;gap:4px;height:100%}
.htx-prev-nav{display:flex;justify-content:space-between;align-items:center;font-size:7px;color:#a19f9d;padding:0 2px 2px}
.htx-prev-date{color:#242424;font-weight:600}
.htx-prev-date i{font-style:normal;background:rgba(130,125,250,.15);color:rgb(130,125,250);border-radius:2px;padding:0 2px;font-size:5px;margin-left:2px}
.htx-prev-card{display:flex;align-items:center;gap:5px;background:#fff;border:1px solid #ece9e6;border-radius:6px;padding:4px 6px}
.htx-prev-c{width:8px;height:8px;border-radius:50%;border:1.2px solid rgba(52,199,89,.5);flex:none}
.htx-prev-c.on{background:rgb(52,199,89);border-color:rgb(52,199,89)}
.htx-prev-n{font-size:6.5px;color:#3a3836}
.htx-prev-n.done{color:#a19f9d;text-decoration:line-through}
.htx-prev-t{font-size:5.5px;color:#a19f9d;margin-left:auto}
.htx-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.htx-card.drop-into{outline:2px solid rgba(130,125,250,.65);outline-offset:-2px;background:rgba(130,125,250,.08)}
.htx-card.drop-out{outline:1.5px dashed rgba(130,125,250,.5);outline-offset:-2px}

/* ---- from styles-v6.css ---- */
.htx-card{margin-left: 10px; margin-right: 10px;}
.htx-mid{min-width: 0; flex: 1;}
.htx-name{display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 100%;}
.htx-card.htx-project .htx-mid{display: flex; min-height: 24px;}
.htx-projicon{opacity: .75;}
.htx-kids{padding-left: 0;}
.htx-kidrow .htx-name{font-size: 16px;}
.htx{background:
    radial-gradient(120% 90% at 50% 18%, rgba(122,78,40,.55) 0%, rgba(122,78,40,0) 55%),
    radial-gradient(140% 120% at 50% 40%, #4a2e18 0%, #2e1c0d 52%, #1a0f07 100%);
  border:1px solid #6b4a24;
  box-shadow:
    inset 0 0 0 1px rgba(230,194,122,.14),
    inset 0 0 70px rgba(0,0,0,.55),
    0 10px 34px rgba(0,0,0,.45);
  color:#f2e4c4;
  font-family:Georgia,'Palatino Linotype',Palatino,'Times New Roman',serif;}
.htx button{font-family:inherit}
.htx-gtitle{color:#eed39a;letter-spacing:.06em;font-weight:600;
  font-variant:small-caps;font-size:24px;
  text-shadow:0 1px 0 rgba(0,0,0,.85),0 0 14px rgba(230,194,122,.25);}
.htx-gtitle::before{content:'✦';margin-right:9px;font-size:15px;color:#c9a252;
  text-shadow:0 0 8px rgba(230,194,122,.5)}
.htx-head{border-bottom:1px solid transparent;
  border-image:linear-gradient(90deg,rgba(185,141,79,0),rgba(185,141,79,.85) 18%,rgba(230,194,122,.95) 50%,rgba(185,141,79,.85) 82%,rgba(185,141,79,0)) 1;
  padding-bottom:10px;}
.htx-tabs{background:rgba(20,11,5,.6);border:1px solid #5d4126;border-radius:8px;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.6);}
.htx-tab{color:#b99c6b;letter-spacing:.05em;font-variant:small-caps;font-size:12.5px;}
.htx-tab:hover{color:#f2e4c4}
.htx-tab.sel{background:linear-gradient(180deg,#eacd8f,#c49a52);color:#2e1c09;
  box-shadow:inset 0 1px 0 rgba(255,246,220,.6),0 1px 3px rgba(0,0,0,.5);
  text-shadow:none;}
.htx-chev{border:1px solid #5d4126;border-radius:8px;
  background:linear-gradient(180deg,#38220f,#241407);
  box-shadow:inset 0 1px 0 rgba(230,194,122,.18),0 1px 3px rgba(0,0,0,.45);}
.htx-chev:hover{background:linear-gradient(180deg,#452b14,#2c1a0a)}
.htx-chev svg path{stroke:#d9b677}
.htx-datebtn{border-radius:8px}
.htx-datebtn:hover{background:rgba(185,141,79,.14)}
.htx-datetext{color:#f2e4c4;letter-spacing:.05em;text-shadow:0 1px 0 rgba(0,0,0,.8)}
.htx-todaypill{background:rgba(212,175,55,.14);color:#e6c27a;border:1px solid rgba(201,162,82,.55);
  letter-spacing:.12em;font-variant:small-caps;font-size:10.5px;}
.htx-card{background:
    radial-gradient(130% 150% at 28% 0%, rgba(255,248,224,.5) 0%, rgba(255,248,224,0) 55%),
    linear-gradient(180deg,#f1e2bd 0%,#e6d2a6 58%,#dbc292 100%);
  border:1px solid #5d4126;border-radius:8px;
  box-shadow:
    inset 0 0 0 1px rgba(255,246,220,.45),
    inset 0 -12px 20px rgba(122,84,40,.16),
    0 3px 8px rgba(0,0,0,.5);}
.htx-name{color:#3a2a16;text-shadow:0 1px 0 rgba(255,246,220,.35)}
.htx-name.done{color:#9a8563;text-decoration-color:rgba(122,96,58,.65)}
.htx .htx-name a.lb-link{color:#3d5a96;border-bottom-color:rgba(61,90,150,.45)}
.htx .htx-name a.lb-link:hover{border-bottom-color:#3d5a96;background:rgba(61,90,150,.1)}
.htx-time{color:#857050}
.htx-check svg{filter:drop-shadow(0 1px 1px rgba(0,0,0,.4))}
.htx-check svg circle{fill:rgba(60,40,18,.14);stroke:rgba(122,90,48,.65);stroke-width:1.6}
.htx-check.done svg circle{fill:#3d9e5f;stroke:#e6c27a;stroke-width:1.4}
.htx-check.done svg path{stroke:#fdf6e0}
.htx-cardgrip svg,.htx-rowgrip svg{fill:#a07c4e}
.htx-projicon{opacity:.9}
.htx-projicon svg path{stroke:#7a5a30}
.htx-icon:hover{background:rgba(122,90,48,.14)}
.htx-icon svg path[stroke]{stroke:#7a5a30}
.htx-act{background:linear-gradient(180deg,#efe0ba,#dcc493);border:1px solid #6b4a24;
  box-shadow:inset 0 1px 0 rgba(255,246,220,.5),0 1px 2px rgba(0,0,0,.35);}
.htx-act:hover{background:linear-gradient(180deg,#f7ecc9,#e6d0a2)}
.htx-act.edit svg path{stroke:#6b4a1c}
.htx-act.del svg path{stroke:#a33327}
.htx-card.drop-before{box-shadow:inset 0 2px 0 0 #d4af37,inset 0 0 0 1px rgba(255,246,220,.45),0 3px 8px rgba(0,0,0,.5)}
.htx-card.drop-after{box-shadow:inset 0 -2px 0 0 #d4af37,inset 0 0 0 1px rgba(255,246,220,.45),0 3px 8px rgba(0,0,0,.5)}
.htx-kidrow.drop-before{box-shadow:inset 0 2px 0 0 #d4af37}
.htx-kidrow.drop-after{box-shadow:inset 0 -2px 0 0 #d4af37}
.htx-card.drop-into{outline:2px solid rgba(212,175,55,.75);background:rgba(212,175,55,.14)}
.htx-card.drop-out{outline:1.5px dashed rgba(212,175,55,.6)}
.htx-empty-ic path[stroke]{stroke:#9c7a4e}
.htx-empty-ic path[fill]:not([fill="none"]){fill:#9c7a4e}
.htx-empty-t1{color:#e8d5ac;font-variant:small-caps;letter-spacing:.08em}
.htx-empty-t2{color:#a98c5e}
.htx-perfcard{background:
    radial-gradient(130% 150% at 28% 0%, rgba(255,248,224,.5) 0%, rgba(255,248,224,0) 55%),
    linear-gradient(180deg,#f1e2bd 0%,#e6d2a6 58%,#dbc292 100%);
  border:1px solid #5d4126;border-radius:8px;
  box-shadow:
    inset 0 0 0 1px rgba(255,246,220,.45),
    inset 0 -12px 20px rgba(122,84,40,.16),
    0 3px 8px rgba(0,0,0,.5);}
.htx-perfrow.sep{border-top:1px solid rgba(122,90,48,.35)}
.htx-perfrow.dim{opacity:.55}
.htx-perfname{color:#3a2a16}
.htx-perfbar{height:9px;background:linear-gradient(180deg,#43301a,#2a1c0c);border-radius:4px;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.65),0 1px 0 rgba(255,246,220,.4);}
.htx-perffill{border-radius:3px;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 1px rgba(0,0,0,.25)}
.htx-perffill[style*="52,199,89"]{background:linear-gradient(180deg,#8fd6a8 0%,#3d9e5f 55%,#2c7a48 100%)!important}
.htx-perffill[style*="255,159,10"]{background:linear-gradient(180deg,#f2d488 0%,#d99a2b 55%,#a86f14 100%)!important}
.htx-perffill[style*="255,69,58"]{background:linear-gradient(180deg,#e99080 0%,#c75044 55%,#8e2f26 100%)!important}
.htx-perfcount[style*="52,199,89"],.htx-perfrate[style*="52,199,89"]{color:#2c7a48!important}
.htx-perfcount[style*="255,159,10"],.htx-perfrate[style*="255,159,10"]{color:#a86f14!important}
.htx-perfcount[style*="255,69,58"],.htx-perfrate[style*="255,69,58"]{color:#a33327!important}
.htx-perfsec{color:#c9a252;letter-spacing:.18em;font-variant:small-caps;font-size:11.5px}
.htx-perfdash{color:#9a8563}
.htx-daycap{background:rgba(185,141,79,.2);color:#6b4a1c;border:1px solid rgba(122,90,48,.45);
  font-variant:small-caps;letter-spacing:.04em;}
.htx-activate{background:rgba(61,158,95,.16);color:#2c7a48;border:1px solid rgba(44,122,72,.5);
  font-variant:small-caps;letter-spacing:.05em;}
.htx-activate svg path{fill:#2c7a48}
.htx-activate:hover{background:rgba(61,158,95,.28)}
.htx-nextrow .htx-act{background:linear-gradient(180deg,#efe0ba,#dcc493)}
.htx-fab{background:radial-gradient(circle at 34% 28%,#f2dcA4 0%,#d9b677 38%,#a87c34 78%,#7a5a20 100%);
  border:1px solid #5d4126;
  box-shadow:
    inset 0 1px 0 rgba(255,248,224,.65),
    inset 0 -3px 6px rgba(90,60,20,.45),
    0 4px 14px rgba(0,0,0,.55),0 0 18px rgba(212,175,55,.3);}
.htx-fab:hover{filter:brightness(1.08)}
.htx-fab svg path{stroke:#33200a}
.htx-fab.purple{background:radial-gradient(circle at 34% 28%,#d9b8f0 0%,#a06cc8 45%,#6c3d94 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,248,224,.5),
    inset 0 -3px 6px rgba(50,20,80,.5),
    0 4px 14px rgba(0,0,0,.55),0 0 18px rgba(160,108,200,.35);}
.htx-fab.purple svg path{stroke:#f4e9fc}
.htx-fabmenu{background:linear-gradient(180deg,#33200f,#241407);border:1px solid #b98d4f;border-radius:8px;
  box-shadow:inset 0 0 0 1px rgba(230,194,122,.14),0 10px 28px rgba(0,0,0,.6);}
.htx-fabitem{color:#f2e4c4}
.htx-fabitem:hover{background:rgba(185,141,79,.18)}
.htx-fabitem svg path[stroke]{stroke:#d9b677}
.htx-fabitem svg path[fill]:not([fill="none"]){fill:#d9b677}
.htx-overlay{background:rgba(16,9,4,.62);backdrop-filter:blur(3px)}
.htx-sheet,.htx-confirm{background:linear-gradient(180deg,#33200f 0%,#271709 100%);
  border:1px solid #b98d4f;border-radius:10px;
  box-shadow:
    inset 0 0 0 1px rgba(230,194,122,.14),
    inset 0 0 40px rgba(0,0,0,.4),
    0 18px 50px rgba(0,0,0,.65);}
.htx-sheet-title{color:#eed39a;font-variant:small-caps;letter-spacing:.08em;
  text-shadow:0 1px 0 rgba(0,0,0,.85);}
.htx-seclabel{color:#c9a252;letter-spacing:.18em}
.htx-input{background:linear-gradient(180deg,#efe0ba,#e2cf9f);border:1px solid #6b4a24;
  color:#3a2a16;border-radius:6px;font-family:inherit;
  box-shadow:inset 0 1px 3px rgba(90,60,20,.3);}
.htx-input::placeholder{color:#9a8563}
.htx-input:focus{border-color:#d4af37;box-shadow:inset 0 1px 3px rgba(90,60,20,.3),0 0 8px rgba(212,175,55,.35)}
.htx-linkbtn{background:linear-gradient(180deg,#efe0ba,#e2cf9f);border:1px solid #6b4a24;
  color:#3a2a16;border-radius:6px;font-family:inherit;}
.htx-linkbtn.empty{color:#9a8563}
.htx-linkbtn:hover{border-color:#d4af37}
.htx-daypill{border:1px solid #7a5a30;color:#cbb27f;background:rgba(20,11,5,.5);
  font-variant:small-caps;}
.htx-daypill:hover{border-color:#d9b677;color:#f2e4c4}
.htx-daypill.sel{background:linear-gradient(180deg,#eacd8f,#c49a52);border-color:#5d4126;color:#2e1c09;
  box-shadow:inset 0 1px 0 rgba(255,246,220,.5);}
.htx-trackrow{color:#e8d5ac}
.htx-switch{background:#4a3620;border:1px solid #6b4a24;box-shadow:inset 0 1px 3px rgba(0,0,0,.55)}
.htx-switch.on{background:#3d9e5f;border-color:#2c7a48}
.htx-knob{background:#f0e3c0;box-shadow:0 1px 3px rgba(0,0,0,.5)}
.htx-btn{font-variant:small-caps;letter-spacing:.06em;border-radius:7px}
.htx-btn.ghost{color:#cbb27f}
.htx-btn.ghost:hover{color:#f2e4c4}
.htx-btn.solid{background:linear-gradient(180deg,#eacd8f,#c49a52);color:#2e1c09;border:1px solid #5d4126;
  box-shadow:inset 0 1px 0 rgba(255,246,220,.55),0 2px 5px rgba(0,0,0,.45);}
.htx-btn.solid:hover{filter:brightness(1.07)}
.htx-btn.danger{background:linear-gradient(180deg,#c8563f,#8e2f26);color:#f6e8d0;border:1px solid #5d1f16;
  box-shadow:inset 0 1px 0 rgba(255,220,200,.3),0 2px 5px rgba(0,0,0,.45);}
.htx-kiditem{background:rgba(20,11,5,.5);border:1px solid #5d4126;color:#e8d5ac}
.htx-kiddel{color:#a98c5e}
.htx-kiddel:hover{color:#e99080}
.htx-childedit{background:rgba(20,11,5,.42);border:1px solid #5d4126;border-radius:8px;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.4);}
.htx-addhabit{background:rgba(185,141,79,.1);border:1px dashed rgba(201,162,82,.6);color:#e6c27a;
  font-variant:small-caps;letter-spacing:.06em;border-radius:7px;}
.htx-addhabit:hover{background:rgba(185,141,79,.2);border-color:#d4af37}
.htx-confirm-t{color:#eed39a;font-variant:small-caps;letter-spacing:.06em}
.htx-confirm-m{color:#cbb27f}
.htx-pop{background:linear-gradient(180deg,#33200f,#241407);border:1px solid #b98d4f;
  color:#f2e4c4;border-radius:8px;
  box-shadow:inset 0 0 0 1px rgba(230,194,122,.14),0 12px 32px rgba(0,0,0,.6);}
.htx-projnote{color:#9a8563}
.htx-prev{background:radial-gradient(140% 120% at 50% 30%, #452b14 0%, #241407 70%, #180d05 100%);
  border:1px solid #5d4126;}
.htx-prev-nav{color:#a98c5e}
.htx-prev-date{color:#f2e4c4}
.htx-prev-date i{background:rgba(212,175,55,.16);color:#e6c27a}
.htx-prev-card{background:linear-gradient(180deg,#efe0ba,#dcc493);border:1px solid #6b4a24}
.htx-prev-c{border-color:rgba(122,90,48,.6)}
.htx-prev-c.on{background:#3d9e5f;border-color:#2c7a48}
.htx-prev-n{color:#3a2a16}
.htx-prev-n.done{color:#9a8563}
.htx-prev-t{color:#857050}