@import"https://fonts.googleapis.com/css2?family=Kalam:wght@400;700&family=ZCOOL+KuaiLe&display=swap";:root{--night-ink: #2B2A4C;--chalk-mustard: #D9A441;--clay-orange: #C97B5E;--warm-paper: #F3ECDD;--midnight-shadow: #1B1A31;--chalk-dim: #CFC4AD;--mist-line: #7A725F;--soft-black: #11101C}*{box-sizing:border-box}html{min-height:100%;background:var(--night-ink);color:var(--warm-paper)}body{min-height:100%;margin:0;font-family:ZCOOL KuaiLe,Kaiti SC,STKaiti,Hiragino Sans GB,PingFang SC,system-ui,sans-serif;background:radial-gradient(circle at top left,color-mix(in srgb,var(--clay-orange) 24%,transparent),transparent 32rem),linear-gradient(160deg,var(--night-ink),var(--midnight-shadow))}.svgDefs{position:absolute;width:0;height:0;overflow:hidden}button,input,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.appShell{width:min(100%,36rem);min-height:100dvh;margin:0 auto;padding:1rem}.setupShell{display:grid;align-items:center}.setupPanel,.recordComposer,.recordTask,.freeRecord,.timelineItem,.reflectionBox,.bigCard{position:relative}.sketchPanel{border:.14rem solid var(--warm-paper);border-radius:1.3rem .65rem 1.6rem .85rem;box-shadow:.35rem .35rem 0 var(--soft-black)}.setupPanel{padding:1.25rem;background:color-mix(in srgb,var(--midnight-shadow) 72%,transparent)}.eyebrow,.timerLabel,.sectionHeading span,.bigCard span,.timeline time{color:var(--chalk-dim);font-size:.84rem}h1,h2,p{margin:0}h1{margin-top:.35rem;font-size:clamp(3rem,18vw,5.6rem);line-height:.9;text-shadow:.09rem .09rem 0 var(--clay-orange)}h2,h3{font-size:1.28rem}h3{margin:0}.setupCopy{margin:1rem 0 1.3rem;color:var(--chalk-dim);line-height:1.7}.setupForm,.contentStack,.recordPanel,.reviewPage,.drawPanel{display:grid;gap:1rem}.fieldLine{display:grid;gap:.45rem}.fieldLine span,.reflectionBox span{color:var(--chalk-dim);font-size:.92rem}input,textarea{width:100%;border:.12rem dashed var(--mist-line);border-radius:.8rem 1.15rem .75rem .95rem;padding:.9rem;background:color-mix(in srgb,var(--warm-paper) 8%,transparent);color:var(--warm-paper);outline:none}textarea{min-height:6rem;resize:vertical;line-height:1.55}input:focus,textarea:focus{border-color:var(--chalk-mustard)}.topBar{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:-1rem -1rem 1rem;padding:.85rem 1rem;background:color-mix(in srgb,var(--night-ink) 88%,transparent);-webkit-backdrop-filter:blur(.75rem);backdrop-filter:blur(.75rem);border-bottom:.08rem dashed var(--mist-line)}.timerText{display:block;margin-top:.1rem;font-size:1.45rem}.quietButton,.primaryButton,.secondaryButton,.cameraButton,.tabButton{cursor:pointer;color:var(--warm-paper)}.quietButton{border:.08rem dashed var(--mist-line);border-radius:999rem;padding:.55rem .8rem;background:transparent;color:var(--chalk-dim)}.primaryButton,.secondaryButton,.cameraButton{min-height:3.6rem;border:.14rem solid var(--soft-black);border-radius:1.1rem .7rem 1.2rem .8rem;padding:.95rem 1rem;font-weight:800;box-shadow:.24rem .24rem 0 var(--soft-black)}.primaryButton{background:var(--chalk-mustard);color:var(--soft-black)}.secondaryButton,.cameraButton{display:grid;place-items:center;background:var(--clay-orange);color:var(--soft-black)}.roleTabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-bottom:1rem}.tabButton{display:grid;gap:.18rem;min-height:4rem;border:.1rem dashed var(--mist-line);border-radius:1rem .7rem .95rem .8rem;padding:.65rem .4rem;background:color-mix(in srgb,var(--warm-paper) 7%,transparent);text-align:center}.tabButton span{overflow:hidden;color:var(--chalk-dim);font-size:.78rem;text-overflow:ellipsis;white-space:nowrap}.tabButton strong{font-size:1rem}.tabButton.active{border-color:var(--chalk-mustard);background:color-mix(in srgb,var(--chalk-mustard) 24%,var(--night-ink))}.sectionHeading{display:flex;align-items:end;justify-content:space-between;gap:1rem}.bigCard{display:grid;align-content:center;min-height:17rem;padding:1.35rem;background:repeating-linear-gradient(166deg,transparent 0 1.7rem,color-mix(in srgb,var(--warm-paper) 5%,transparent) 1.74rem 1.82rem),color-mix(in srgb,var(--warm-paper) 10%,transparent)}.bigCard p{font-size:clamp(2rem,12vw,3.5rem);font-weight:900;line-height:1.12}.bigCard span{margin-top:1.4rem}.reminder{position:sticky;top:4.6rem;z-index:2;margin:0 0 1rem;border:.12rem dashed var(--chalk-mustard);border-radius:1rem .75rem 1.15rem .85rem;padding:.85rem;background:var(--clay-orange);color:var(--soft-black);font-weight:800}.recordComposer{display:grid;gap:.85rem;padding:1rem;background:color-mix(in srgb,var(--warm-paper) 8%,transparent)}.taskList{display:grid;gap:.75rem}.recordTask{overflow:hidden;background:color-mix(in srgb,var(--midnight-shadow) 72%,transparent)}.recordTask.completed{border-color:color-mix(in srgb,var(--chalk-mustard) 72%,var(--warm-paper));background:color-mix(in srgb,var(--chalk-mustard) 12%,var(--midnight-shadow))}.taskHeader{display:grid;grid-template-columns:2rem minmax(0,1fr);align-items:center;gap:.65rem;width:100%;min-height:4.2rem;border:0;padding:.85rem;background:transparent;color:var(--warm-paper);text-align:left}.taskCheck{display:grid;place-items:center;width:1.6rem;height:1.6rem;border:.1rem dashed var(--chalk-mustard);border-radius:50%;color:var(--chalk-mustard);font-weight:900}.freeRecord{display:grid;gap:.85rem;padding:.85rem;background:color-mix(in srgb,var(--warm-paper) 7%,transparent)}.freeRecord .recordComposer,.recordTask .recordComposer{margin:0 .85rem .85rem;border:.1rem dashed var(--mist-line);border-radius:.9rem .65rem 1rem .75rem}.freeRecord .recordComposer{margin:0}.recordPreview{display:grid;gap:.55rem;margin:0 .85rem .85rem;border:.1rem dashed var(--mist-line);border-radius:.9rem .65rem 1rem .75rem;padding:.85rem;background:color-mix(in srgb,var(--warm-paper) 7%,transparent)}.recordPreview img{width:100%;max-height:12rem;border:.1rem solid var(--warm-paper);border-radius:.9rem .55rem 1rem .7rem;object-fit:cover}.recordPreview p{color:var(--chalk-dim);line-height:1.5}.recordPreview time,.taskTag{color:var(--chalk-dim);font-size:.84rem}.cameraButton input{display:none}.photoPreview,.timeline img{width:100%;border:.1rem solid var(--warm-paper);border-radius:.9rem .55rem 1rem .7rem;object-fit:cover}.photoPreview{max-height:18rem}.timeline{display:grid;gap:.85rem;margin:0;padding:0;list-style:none}.timeline.compact{gap:.65rem}.timelineItem{display:grid;grid-template-columns:4.4rem minmax(0,1fr);gap:.75rem;padding:.85rem;background:color-mix(in srgb,var(--midnight-shadow) 70%,transparent)}.timelineItem p{margin-top:.28rem;color:var(--chalk-dim);line-height:1.5}.taskTag{display:inline-block;margin-top:.35rem;border:.08rem dashed var(--chalk-mustard);border-radius:999rem;padding:.25rem .5rem;color:var(--chalk-mustard)}.timelineItem img{margin-top:.45rem;max-height:12rem}.emptyLine{border:.1rem dashed var(--mist-line);border-radius:.9rem 1.25rem .8rem 1rem;padding:1rem;color:var(--chalk-dim)}.reflectionGrid{display:grid;gap:.85rem}.reflectionBox{display:grid;gap:.55rem;padding:.85rem;background:color-mix(in srgb,var(--warm-paper) 7%,transparent)}@media(min-width:48rem){.appShell{padding-block:1.5rem}.topBar{border:.08rem dashed var(--mist-line);border-radius:0 0 1rem 1rem}}.sketchPanel,.recordTask,.freeRecord,.timelineItem,.reflectionBox,.bigCard{border:0;box-shadow:none}.setupPanel{display:grid;gap:1rem;padding:.35rem 0 1.25rem;background:transparent}.setupPanel h1,.sectionHeading h2,.freeRecord h3,.tabButton strong,.primaryButton,.secondaryButton,.cameraButton,.drawButton,.recordButton,.startButton{font-family:ZCOOL KuaiLe,Kaiti SC,cursive}.setupPanel h1{font-size:clamp(3.4rem,19vw,5.8rem)}.setupCopy{margin:0 0 .25rem;max-width:26rem}.compassWrap{position:relative;width:min(100%,21rem);aspect-ratio:1;margin:.4rem auto .6rem}.compassSvg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible}.compassOuter,.compassInner,.compassTick{fill:none;stroke:var(--warm-paper);stroke-linecap:round;stroke-linejoin:round}.compassOuter{stroke-width:3.3;opacity:.88}.compassInner{stroke-width:1.45;opacity:.45}.compassTick{stroke-width:2.1;opacity:.72}.compassNeedle{transform-box:fill-box;transform-origin:center;animation:compassSpin 3.35s cubic-bezier(.12,.76,.16,1) forwards}.needleHead{fill:var(--chalk-mustard)}.needleTail{fill:var(--clay-orange)}.needleHub{fill:var(--warm-paper)}@keyframes compassSpin{0%{transform:rotate(0)}to{transform:rotate(var(--needle-angle))}}.compassWord{position:absolute;color:var(--warm-paper);font-size:1.18rem;transform:translate(-50%,-50%) rotate(var(--word-rotate));white-space:nowrap}.word1{left:50%;top:2%;--word-rotate: -5deg}.word2{left:84%;top:16%;--word-rotate: 7deg}.word3{left:94%;top:50%;--word-rotate: -3deg}.word4{left:84%;top:84%;--word-rotate: 5deg}.word5{left:50%;top:98%;--word-rotate: -6deg}.word6{left:16%;top:84%;--word-rotate: 4deg}.word7{left:6%;top:50%;--word-rotate: -4deg}.word8{left:16%;top:16%;--word-rotate: 6deg}.setupForm{gap:1.15rem}.notebookLine{position:relative;display:grid;gap:.15rem;padding-bottom:.42rem}.notebookLine1{transform:rotate(-.4deg)}.notebookLine2{transform:rotate(.35deg)}.notebookLine3{transform:rotate(-.2deg)}.notebookLine span{color:var(--chalk-dim);font-size:1rem}.notebookLine input{border:0;border-radius:0;padding:.2rem 0 .35rem;background:transparent;font-size:1.65rem}.chalkUnderline{position:absolute;right:0;bottom:0;left:0;width:100%;height:.42rem;overflow:visible}.chalkUnderline path{fill:none;stroke:var(--warm-paper);stroke-width:1.7;stroke-linecap:round;filter:url(#chalkRough);opacity:.74}.durationChips{display:flex;justify-content:center;gap:1rem;padding:.25rem 0}.durationChip{display:grid;place-items:center;width:4.25rem;aspect-ratio:1;border:.12rem solid var(--chalk-dim);border-radius:48% 52% 46% 54%;background:transparent;color:var(--chalk-dim);font-family:Kalam,ZCOOL KuaiLe,cursive;font-size:1.35rem;font-weight:700}.durationChip:nth-child(1){transform:rotate(-4deg)}.durationChip:nth-child(2){transform:rotate(2deg)}.durationChip:nth-child(3){transform:rotate(5deg)}.durationChip.selected{border-color:var(--chalk-mustard);border-width:.2rem;color:var(--chalk-mustard)}.startButton,.drawButton,.recordButton{min-height:3.8rem;border:.16rem solid var(--clay-orange);border-radius:40% 56% 44% 52%/24% 36% 28% 42%;padding:.75rem 1rem;background:transparent;color:var(--warm-paper);font-size:1.55rem;font-weight:700;transform:rotate(-1deg)}.startButton{margin-top:.2rem}.topBar{align-items:flex-start;border-bottom:0;background:color-mix(in srgb,var(--night-ink) 82%,transparent)}.timerLabel{display:block;transform:rotate(-1deg)}.timerText{font-family:Kalam,ZCOOL KuaiLe,cursive;font-size:2.25rem;line-height:1}.quietButton{border:0;border-bottom:.11rem dashed var(--clay-orange);border-radius:0;padding:.25rem .05rem;color:var(--clay-orange);transform:rotate(1deg)}.roleTabs{position:relative;gap:0;margin:.2rem 0 1.15rem;border-bottom:.1rem solid color-mix(in srgb,var(--warm-paper) 34%,transparent)}.tabButton{position:relative;min-height:3.6rem;border:0;border-radius:0;background:transparent}.tabButton.active{border-color:transparent;background:transparent}.tabButton.active strong{color:var(--chalk-mustard)}.tabWave{position:absolute;right:18%;bottom:-.3rem;left:18%;height:.7rem;overflow:visible}.tabWave path{fill:none;stroke:var(--chalk-mustard);stroke-width:2.3;stroke-linecap:round;filter:url(#chalkRough)}.sectionHeading h2{font-size:1.65rem}.drawnFrame{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;overflow:visible}.drawnPath{fill:color-mix(in srgb,var(--warm-paper) 7%,transparent);stroke:var(--warm-paper);stroke-width:1.35;opacity:.82;filter:url(#chalkRough)}.drawnPath.compact{stroke-width:1.7}.bigCard{min-height:17rem;background:transparent}.cardTextLayer{position:relative;z-index:1;display:grid;align-content:center;min-height:17rem;padding:1.45rem;transform:rotate(-.45deg)}.bigCard p{font-size:clamp(2.2rem,12vw,3.75rem)}.directionDraw{border-color:var(--chalk-mustard);transform:rotate(1deg)}.actionDraw{border-color:var(--clay-orange);transform:rotate(-1deg)}.recordTask,.freeRecord{overflow:visible;background:transparent}.taskHeader{position:relative;z-index:1;grid-template-columns:2.3rem minmax(0,1fr);min-height:4.8rem;padding:1rem 1.1rem}.taskCheck{width:2rem;height:2rem;border:0}.taskCheck svg{width:100%;height:100%;overflow:visible;filter:url(#chalkRough)}.taskCheck circle,.taskCheck path{fill:none;stroke:var(--chalk-mustard);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.recordTask.completed .taskHeader{color:var(--chalk-dim)}.recordTask.completed .drawnPath{stroke:var(--chalk-mustard);opacity:.78}.freeRecord{padding:1rem}.recordComposer{position:relative;z-index:1;background:transparent}.freeRecord .recordComposer,.recordTask .recordComposer,.recordPreview{border:0;background:transparent}textarea,input{border:0}textarea{border-bottom:.11rem solid var(--mist-line);border-radius:0;background:transparent}textarea::placeholder,input::placeholder{color:color-mix(in srgb,var(--chalk-dim) 58%,transparent)}.cameraButton,.recordButton{border-color:var(--clay-orange);background:transparent;color:var(--warm-paper);box-shadow:none}.recordPreview{position:relative;z-index:1}.timelineItem,.reflectionBox{border:.12rem solid var(--warm-paper);border-radius:42% 55% 46% 52%/12% 18% 15% 16%}@media(min-width:48rem){.topBar{border:0}}
