*{box-sizing:border-box}body{margin:0;background:#eef2f8;color:#132b50;font:15px system-ui,-apple-system,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #83b7ff;outline-offset:2px}button:disabled{opacity:.45;cursor:default}#app{max-width:540px;margin:auto;background:#f8faff;min-height:100dvh;padding-bottom:100px}header{padding:30px 24px 18px;display:flex;align-items:center;justify-content:space-between}h1{font-size:28px;letter-spacing:-1px;margin:0}h2{font-size:20px;letter-spacing:-.4px;margin:0}h3{font-size:15px;margin:0 0 16px}p{line-height:1.5}.eyebrow{font-size:11px;font-weight:700;letter-spacing:1.8px;color:#6b819d;text-transform:uppercase;margin-bottom:7px}.icon-button{width:44px;height:44px;border-radius:14px;background:white;color:#47617f;font-size:22px}.content{padding:0 24px}.primary{background:#0969e8;color:white;font-weight:650;border-radius:15px;min-height:52px;padding:12px 22px;box-shadow:0 5px 14px #0969e81b}.wide{width:100%}.hero{font-size:18px;min-height:62px;margin:8px 0 24px}.section-head{display:flex;justify-content:space-between;align-items:center;margin:24px 0 14px}.link{background:none;color:#0969e8;font-size:13px;padding:10px 0}.card{background:white;border:1px solid #e8eef5;border-radius:19px;padding:20px;margin:14px 0;box-shadow:0 4px 16px #183b6310}.entry{display:flex;align-items:center;gap:12px;text-align:left;background:white;width:100%;padding:17px 0;color:inherit;border-bottom:1px solid #eef2f6}.entry:last-child{border-bottom:0}.entries{padding:0 16px}.face{display:grid;place-items:center;flex-shrink:0;width:35px;height:35px;border-radius:50%;font-size:23px;border:1px solid}.positive{color:#12844b;background:#eaf8f0;border-color:#b9e5cb}.negative{color:#dc4651;background:#fff0f1;border-color:#ffc5ca}.entry .info{flex:1;min-width:0}.entry strong{font-size:14px;display:block;margin-bottom:5px}.muted{color:#71839b;font-size:12px}.entry time{display:block;font-size:11px;color:#71839b;margin-bottom:5px}.chevron{color:#91a2b8}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.stat{border-radius:14px;padding:16px 7px;text-align:center;background:#eef5ff}.stat strong{font-size:25px;display:block;color:#0969e8}.stat small{display:block;font-size:10px;line-height:1.4;margin-top:6px}.stat.good{background:#edf8f2}.stat.good strong{color:#14864e}.stat.bad{background:#fff0f1}.stat.bad strong{color:#d94755}nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);max-width:540px;width:100%;background:#ffffffed;backdrop-filter:blur(12px);border-top:1px solid #e7edf5;padding:9px 15px max(12px,env(safe-area-inset-bottom));display:flex;z-index:10}nav button{flex:1;background:none;color:#7b8ba1;font-size:10px;min-height:51px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px}nav svg{width:23px;height:23px}nav button.active{color:#0969e8;font-weight:700}.empty{text-align:center;padding:35px 12px;color:#71839b}.empty .symbol{font-size:32px;margin-bottom:12px;color:#9eb2cc}.empty strong{color:#334f71;display:block}.tabs{display:flex;gap:4px;border-radius:13px;padding:4px;background:#eaf0f7;margin-bottom:20px}.tabs button{flex:1;min-height:39px;border-radius:10px;color:#45607f;background:none;font-size:12px}.tabs button.active{background:#0969e8;color:white;box-shadow:0 3px 8px #0969e825}.steps{display:flex;justify-content:center;align-items:center;gap:0;margin:5px 0 30px}.step{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#e5ebf3;color:#647993;font-size:13px;font-weight:700}.step.active{background:#0969e8;color:white}.line{height:2px;width:48px;background:#dce5f0}.field{margin:23px 0}.field>label,.field-title{display:block;font-weight:650;font-size:13px;margin-bottom:10px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.grid.two{grid-template-columns:repeat(2,1fr)}.choice{min-height:51px;padding:12px 7px;border:1px solid transparent;border-radius:12px;background:#edf2f8;color:#29425f;font-size:12px}.choice.selected{background:#e8f2ff;color:#0969e8;border-color:#0969e8}.behavior{min-height:86px;line-height:1.35}.behavior .glyph{display:block;font-size:21px;margin-bottom:8px}.choice.selected.positive{background:#eaf8f0;color:#12844b;border-color:#12844b}.choice.selected.negative{background:#fff0f1;color:#dc4651;border-color:#dc4651}input,select,textarea{width:100%;border:1px solid #dce5f0;border-radius:12px;background:white;min-height:49px;padding:12px;color:#1d3556}textarea{min-height:86px;resize:vertical}.actions{display:flex;gap:10px;margin:30px 0 18px}.actions>*{flex:1}.secondary{border-radius:14px;min-height:50px;padding:12px 18px;background:#eaf0f7;color:#29476b;font-weight:600}.badge{padding:6px 10px;border-radius:8px;display:inline-block;font-size:12px}.details dl{margin:0}.details dl div{display:grid;grid-template-columns:1fr 1.4fr;gap:15px;border-bottom:1px solid #edf1f6;padding:15px 0;font-size:13px}.details dt{color:#71839b}.details dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.danger{background:#fff0f1;color:#cf3e4d;border-radius:12px;padding:13px;min-height:48px}.bar-row{display:grid;grid-template-columns:1fr 1.15fr 22px;gap:10px;align-items:center;margin:14px 0;font-size:12px}.track{background:#edf2f8;height:12px;border-radius:5px;overflow:hidden}.fill{height:100%;background:#0969e8;border-radius:5px}.fill.red{background:#f46a74}.fill.green{background:#36b97b}.summary{display:grid;grid-template-columns:1fr 1fr;gap:10px}.summary .card{margin:0}.summary strong{display:block;margin-top:10px;font-size:16px}.chart{width:100%;height:140px;overflow:visible}.legend{display:flex;justify-content:center;gap:15px;font-size:11px;color:#71839b;margin-top:12px}.dot{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:5px}.settings-row{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:57px;text-align:left;background:white;color:#29425f;border-bottom:1px solid #edf2f7}.settings-row:last-child{border:0}.manage-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid #eef2f6;gap:10px}.toast{position:fixed;bottom:95px;left:50%;transform:translateX(-50%);background:#163250;color:white;padding:12px 22px;border-radius:12px;z-index:50;max-width:90%;font-size:13px}.hint{font-size:12px;color:#71839b;line-height:1.5}.confirm{position:fixed;inset:0;background:#10243c66;display:grid;place-items:center;padding:25px;z-index:40}.confirm .card{max-width:390px;width:100%}.period-label{margin:24px 0 8px;font-size:12px;font-weight:650;color:#71839b}@media(min-width:650px){#app{margin:28px auto;border-radius:28px;min-height:calc(100dvh - 56px);box-shadow:0 15px 70px #17395c15}nav{bottom:28px;border-radius:0 0 28px 28px}body{background:radial-gradient(ellipse at 25% 0,#e5efff,transparent 65%),#eef2f8}}
/* Colorful behavior cards keep readable labels and explicit selection indicators. */
[data-behavior-type] .behavior{--tile-bg:#fff0f1;--tile-icon:#ffe0e4;--tile-color:#b8374e;position:relative;min-height:105px;background:var(--tile-bg);border:1px solid transparent;color:#29425f;font-weight:600;border-radius:16px;padding:14px 7px 12px;transition:background .15s,border-color .15s,box-shadow .15s}
[data-behavior-type] .behavior .glyph{display:grid;place-items:center;width:38px;height:38px;margin:0 auto 10px;border-radius:12px;background:var(--tile-icon);color:var(--tile-color);font-size:22px;font-weight:500}
[data-behavior-type=negative] .behavior:nth-child(7n+2){--tile-bg:#f2edff;--tile-icon:#e5dbfb;--tile-color:#6e4db0}
[data-behavior-type=negative] .behavior:nth-child(7n+3){--tile-bg:#fff4e5;--tile-icon:#ffe5bd;--tile-color:#975d14}
[data-behavior-type=negative] .behavior:nth-child(7n+4){--tile-bg:#ffedf4;--tile-icon:#ffd9e9;--tile-color:#ae3d72}
[data-behavior-type=negative] .behavior:nth-child(7n+5){--tile-bg:#edf3ff;--tile-icon:#dce7ff;--tile-color:#466ca6}
[data-behavior-type=negative] .behavior:nth-child(7n+6){--tile-bg:#fff0e9;--tile-icon:#ffddcc;--tile-color:#b2522f}
[data-behavior-type=negative] .behavior:nth-child(7n){--tile-bg:#eef1f7;--tile-icon:#dfe6f0;--tile-color:#586d89}
[data-behavior-type=positive] .behavior{--tile-bg:#eaf7ee;--tile-icon:#cfead8;--tile-color:#23794c}
[data-behavior-type=positive] .behavior:nth-child(6n+2){--tile-bg:#e8f7f3;--tile-icon:#caeae0;--tile-color:#21765e}
[data-behavior-type=positive] .behavior:nth-child(6n+3){--tile-bg:#e9f7f7;--tile-icon:#cdebec;--tile-color:#237278}
[data-behavior-type=positive] .behavior:nth-child(6n+4){--tile-bg:#f2f7e7;--tile-icon:#e2edc7;--tile-color:#647b28}
[data-behavior-type=positive] .behavior:nth-child(6n+5){--tile-bg:#eef6ed;--tile-icon:#d9ead4;--tile-color:#4a7941}
[data-behavior-type=positive] .behavior:nth-child(6n){--tile-bg:#ecf4f1;--tile-icon:#d4e7de;--tile-color:#467662}
[data-behavior-type] .behavior.selected.negative{border:2px solid #dc4651;padding:13px 6px 11px;box-shadow:0 0 0 3px #dc465112;color:#962f39;background:var(--tile-bg)}
[data-behavior-type] .behavior.selected.positive{border:2px solid #12844b;padding:13px 6px 11px;box-shadow:0 0 0 3px #12844b12;color:#166c42;background:var(--tile-bg)}
[data-behavior-type] .behavior.selected:after{content:'✓';position:absolute;top:7px;right:7px;width:17px;height:17px;display:grid;place-items:center;background:#dc4651;color:white;border-radius:50%;font-size:10px;font-weight:700}
[data-behavior-type=positive] .behavior.selected:after{background:#12844b}
.tracking-badge{display:inline-block;color:#275fa1;background:#edf4ff;border-radius:6px;padding:4px 7px;font-size:11px;margin-top:5px}.response-pattern{padding:14px 0;border-bottom:1px solid #edf2f8}.response-pattern:last-child{border:0}.response-pattern strong{font-size:14px}.response-pattern p{margin:9px 0}.confirm{overflow:auto}.confirm .card{max-height:calc(100dvh - 50px);overflow:auto}header{padding-top:calc(30px + env(safe-area-inset-top))}#app{padding-bottom:calc(100px + env(safe-area-inset-bottom))}.content{padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}.empty .symbol svg{width:40px;height:40px}input[type=date],input[type=time]{min-width:0}nav{padding-left:max(15px,env(safe-area-inset-left));padding-right:max(15px,env(safe-area-inset-right))}@media(max-width:360px){.content{padding-left:16px;padding-right:16px}header{padding-left:16px;padding-right:16px}h1{font-size:25px}.choice{overflow-wrap:anywhere}}
.positive-overview{display:flex;flex-direction:column;gap:6px;padding:17px 19px;background:#edf8f2;border:1px solid #d4ebdd;border-radius:15px;margin:14px 0;color:#166c42}.positive-overview strong{font-size:20px}.positive-overview span{font-size:12px}.button-setting{padding:15px 0;border-bottom:1px solid #edf2f8}.button-setting:last-child{border:0}.button-setting strong{display:block;font-size:14px;margin-bottom:10px;overflow-wrap:anywhere}.button-controls{display:flex;gap:7px}.button-controls .secondary{min-width:44px;min-height:44px;padding:8px 12px;font-size:12px}.button-controls .secondary:disabled{opacity:.35}
.button-controls{flex-wrap:wrap}.button-controls .danger{min-height:44px;padding:8px 12px;font-size:12px}

.weekly-snippet{background:#f0f9f4;border-color:#d9eee1}.weekly-snippet>strong{font-size:29px;color:#166c42;letter-spacing:-.6px}.weekly-change{font-size:13px;margin:10px 0 15px;font-weight:600}.weekly-change.up{color:#16834e}.weekly-change.down{color:#926024}.weekly-change.same{color:#60758c}.weekly-counts{font-size:13px;color:#345d49;margin:13px 0 5px}

.recorder-line{display:block;margin-top:6px}

.tutorial-card{max-width:430px!important;padding:23px}.tutorial-card>p{font-size:14px}.tutorial-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.tutorial-heading .eyebrow{letter-spacing:1px;font-size:10px;margin:0}.tutorial-list{padding-left:21px;font-size:14px;line-height:1.6}.tutorial-list li{margin:14px 0}.tutorial-note{background:#eef5ff;padding:15px;border-radius:13px;font-size:13px;margin:19px 0}.tutorial-note p{margin:7px 0 0}.tutorial-card .actions{margin-bottom:0}.tutorial-card h2{font-size:23px;margin:13px 0}
