/* Flowspace — Study OS · styles.css — part 1: Tailwind utilities (compiled, no CDN) · part 2: Flowspace styles */
/* ---- Tailwind utilities (compiled) ---- */
*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter,system-ui,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:JetBrains Mono,ui-monospace,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.\!container{width:100%!important}.container{width:100%}@media (min-width:640px){.\!container{max-width:640px!important}.container{max-width:640px}}@media (min-width:768px){.\!container{max-width:768px!important}.container{max-width:768px}}@media (min-width:1024px){.\!container{max-width:1024px!important}.container{max-width:1024px}}@media (min-width:1280px){.\!container{max-width:1280px!important}.container{max-width:1280px}}@media (min-width:1536px){.\!container{max-width:1536px!important}.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.collapse{visibility:collapse}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.inset-3{inset:.75rem}.bottom-0{bottom:0}.bottom-2\.5{bottom:.625rem}.bottom-4{bottom:1rem}.left-0{left:0}.left-1\/2{left:50%}.left-2\.5{left:.625rem}.left-3{left:.75rem}.right-0{right:0}.right-2{right:.5rem}.right-2\.5{right:.625rem}.right-4{right:1rem}.top-0{top:0}.top-0\.5{top:.125rem}.top-2{top:.5rem}.top-2\.5{top:.625rem}.top-20{top:5rem}.top-3{top:.75rem}.top-full{top:100%}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.z-\[60\]{z-index:60}.z-\[70\]{z-index:70}.z-\[75\]{z-index:75}.z-\[80\]{z-index:80}.z-\[85\]{z-index:85}.z-\[95\]{z-index:95}.col-span-2{grid-column:span 2/span 2}.col-span-full{grid-column:1/-1}.m-3{margin:.75rem}.-mx-1{margin-left:-.25rem;margin-right:-.25rem}.-mx-2{margin-left:-.5rem;margin-right:-.5rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem;margin-bottom:.25rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.-mb-2{margin-bottom:-.5rem}.-ml-2{margin-left:-.5rem}.mb-1{margin-bottom:.25rem}.mb-1\.5{margin-bottom:.375rem}.mb-2{margin-bottom:.5rem}.mb-2\.5{margin-bottom:.625rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.ml-1{margin-left:.25rem}.ml-3{margin-left:.75rem}.ml-5{margin-left:1.25rem}.ml-auto{margin-left:auto}.mr-1{margin-right:.25rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-1\.5{margin-top:.375rem}.mt-10{margin-top:2.5rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-auto{margin-top:auto}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.contents{display:contents}.\!hidden{display:none!important}.hidden{display:none}.aspect-\[4\/3\]{aspect-ratio:4/3}.aspect-square{aspect-ratio:1/1}.h-1\.5{height:.375rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-16{height:4rem}.h-2{height:.5rem}.h-2\.5{height:.625rem}.h-24{height:6rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-9{height:2.25rem}.h-\[18px\]{height:18px}.h-\[30px\]{height:30px}.h-full{height:100%}.h-px{height:1px}.max-h-40{max-height:10rem}.max-h-72{max-height:18rem}.max-h-\[40vh\]{max-height:40vh}.max-h-\[70vh\]{max-height:70vh}.max-h-\[92vh\]{max-height:92vh}.max-h-\[calc\(100\%-16px\)\]{max-height:calc(100% - 16px)}.min-h-\[1em\]{min-height:1em}.min-h-\[430px\]{min-height:430px}.min-h-full{min-height:100%}.w-1{width:.25rem}.w-1\.5{width:.375rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-2{width:.5rem}.w-2\.5{width:.625rem}.w-20{width:5rem}.w-24{width:6rem}.w-28{width:7rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-32{width:8rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-60{width:15rem}.w-64{width:16rem}.w-7{width:1.75rem}.w-9{width:2.25rem}.w-\[18px\]{width:18px}.w-\[210px\]{width:210px}.w-\[300px\]{width:300px}.w-full{width:100%}.min-w-0{min-width:0}.min-w-\[150px\]{min-width:150px}.min-w-\[180px\]{min-width:180px}.min-w-\[48px\]{min-width:48px}.min-w-\[56px\]{min-width:56px}.min-w-\[8px\]{min-width:8px}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.max-w-\[480px\]{max-width:480px}.max-w-\[60\%\]{max-width:60%}.max-w-\[90vw\]{max-width:90vw}.max-w-\[calc\(100\%-16px\)\]{max-width:calc(100% - 16px)}.max-w-full{max-width:100%}.max-w-lg{max-width:32rem}.max-w-md{max-width:28rem}.max-w-xl{max-width:36rem}.max-w-xs{max-width:20rem}.flex-1{flex:1 1 0%}.flex-shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.border-collapse{border-collapse:collapse}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.translate-x-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-full{--tw-translate-x:100%}.scale-110{--tw-scale-x:1.1;--tw-scale-y:1.1}.scale-110,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize-none{resize:none}.resize{resize:both}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-2\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-x-3{-moz-column-gap:.75rem;column-gap:.75rem}.gap-x-4{-moz-column-gap:1rem;column-gap:1rem}.gap-x-5{-moz-column-gap:1.25rem;column-gap:1.25rem}.gap-y-1{row-gap:.25rem}.gap-y-6{row-gap:1.5rem}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem*var(--tw-space-y-reverse))}.space-y-1\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.375rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem*var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))}.space-y-2\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.625rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.625rem*var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem*var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.space-y-5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem*var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem*var(--tw-space-y-reverse))}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px*var(--tw-divide-y-reverse))}.divide-slate-100>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(241 245 249/var(--tw-divide-opacity,1))}.self-stretch{align-self:stretch}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis}.truncate,.whitespace-nowrap{white-space:nowrap}.whitespace-pre-line{white-space:pre-line}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-\[4px\]{border-radius:4px}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-l-2{border-left-width:2px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-dashed{border-style:dashed}.border-indigo-200{--tw-border-opacity:1;border-color:rgb(199 210 254/var(--tw-border-opacity,1))}.border-indigo-400{--tw-border-opacity:1;border-color:rgb(129 140 248/var(--tw-border-opacity,1))}.border-indigo-500{--tw-border-opacity:1;border-color:rgb(99 102 241/var(--tw-border-opacity,1))}.border-slate-100{--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity,1))}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1))}.border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1))}.border-slate-400{--tw-border-opacity:1;border-color:rgb(148 163 184/var(--tw-border-opacity,1))}.border-transparent{border-color:transparent}.border-violet-200{--tw-border-opacity:1;border-color:rgb(221 214 254/var(--tw-border-opacity,1))}.border-violet-300{--tw-border-opacity:1;border-color:rgb(196 181 253/var(--tw-border-opacity,1))}.border-white\/10{border-color:hsla(0,0%,100%,.1)}.border-white\/15{border-color:hsla(0,0%,100%,.15)}.\!border-l-indigo-500{--tw-border-opacity:1!important;border-left-color:rgb(99 102 241/var(--tw-border-opacity,1))!important}.\!border-l-indigo-500\/50{border-left-color:rgba(99,102,241,.5)!important}.border-t-indigo-600{--tw-border-opacity:1;border-top-color:rgb(79 70 229/var(--tw-border-opacity,1))}.border-t-violet-600{--tw-border-opacity:1;border-top-color:rgb(124 58 237/var(--tw-border-opacity,1))}.bg-emerald-50{--tw-bg-opacity:1;background-color:rgb(236 253 245/var(--tw-bg-opacity,1))}.bg-emerald-600{--tw-bg-opacity:1;background-color:rgb(5 150 105/var(--tw-bg-opacity,1))}.bg-indigo-100{--tw-bg-opacity:1;background-color:rgb(224 231 255/var(--tw-bg-opacity,1))}.bg-indigo-400{--tw-bg-opacity:1;background-color:rgb(129 140 248/var(--tw-bg-opacity,1))}.bg-indigo-50{--tw-bg-opacity:1;background-color:rgb(238 242 255/var(--tw-bg-opacity,1))}.bg-indigo-50\/60{background-color:rgba(238,242,255,.6)}.bg-indigo-500{--tw-bg-opacity:1;background-color:rgb(99 102 241/var(--tw-bg-opacity,1))}.bg-indigo-500\/10{background-color:rgba(99,102,241,.1)}.bg-indigo-600{--tw-bg-opacity:1;background-color:rgb(79 70 229/var(--tw-bg-opacity,1))}.bg-indigo-950\/30{background-color:rgba(30,27,75,.3)}.bg-rose-50{--tw-bg-opacity:1;background-color:rgb(255 241 242/var(--tw-bg-opacity,1))}.bg-rose-600{--tw-bg-opacity:1;background-color:rgb(225 29 72/var(--tw-bg-opacity,1))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.bg-slate-100\/70{background-color:rgba(241,245,249,.7)}.bg-slate-200{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity,1))}.bg-slate-300{--tw-bg-opacity:1;background-color:rgb(203 213 225/var(--tw-bg-opacity,1))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-slate-900{--tw-bg-opacity:1;background-color:rgb(15 23 42/var(--tw-bg-opacity,1))}.bg-slate-950{--tw-bg-opacity:1;background-color:rgb(2 6 23/var(--tw-bg-opacity,1))}.bg-slate-950\/40{background-color:rgba(2,6,23,.4)}.bg-slate-950\/60{background-color:rgba(2,6,23,.6)}.bg-transparent{background-color:transparent}.bg-violet-100{--tw-bg-opacity:1;background-color:rgb(237 233 254/var(--tw-bg-opacity,1))}.bg-violet-50\/40{background-color:rgba(245,243,255,.4)}.bg-violet-600{--tw-bg-opacity:1;background-color:rgb(124 58 237/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-white\/10{background-color:hsla(0,0%,100%,.1)}.bg-white\/15{background-color:hsla(0,0%,100%,.15)}.bg-white\/90{background-color:hsla(0,0%,100%,.9)}.bg-white\/95{background-color:hsla(0,0%,100%,.95)}.fill-current{fill:currentColor}.object-cover{-o-object-fit:cover;object-fit:cover}.object-top{-o-object-position:top;object-position:top}.p-0\.5{padding:.125rem}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-2\.5{padding:.625rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-0\.5{padding-left:.125rem;padding-right:.125rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-3\.5{padding-left:.875rem;padding-right:.875rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-7{padding-left:1.75rem;padding-right:1.75rem}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.pb-2{padding-bottom:.5rem}.pl-5{padding-left:1.25rem}.pl-8{padding-left:2rem}.pl-9{padding-left:2.25rem}.pr-1{padding-right:.25rem}.pr-3{padding-right:.75rem}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pt-2\.5{padding-top:.625rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.font-hand{font-family:Caveat,cursive}.font-mono{font-family:JetBrains Mono,ui-monospace,monospace}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.text-7xl{font-size:4.5rem;line-height:1}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[12px\]{font-size:12px}.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:9px}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.normal-case{text-transform:none}.italic{font-style:italic}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.leading-3{line-height:.75rem}.leading-4{line-height:1rem}.leading-5{line-height:1.25rem}.leading-6{line-height:1.5rem}.leading-7{line-height:1.75rem}.leading-none{line-height:1}.leading-tight{line-height:1.25}.tracking-\[\.18em\]{letter-spacing:.18em}.tracking-\[\.25em\]{letter-spacing:.25em}.tracking-\[\.2em\]{letter-spacing:.2em}.tracking-normal{letter-spacing:0}.tracking-tight{letter-spacing:-.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.text-amber-500{--tw-text-opacity:1;color:rgb(245 158 11/var(--tw-text-opacity,1))}.text-amber-600{--tw-text-opacity:1;color:rgb(217 119 6/var(--tw-text-opacity,1))}.text-emerald-500{--tw-text-opacity:1;color:rgb(16 185 129/var(--tw-text-opacity,1))}.text-emerald-600{--tw-text-opacity:1;color:rgb(5 150 105/var(--tw-text-opacity,1))}.text-emerald-700{--tw-text-opacity:1;color:rgb(4 120 87/var(--tw-text-opacity,1))}.text-indigo-200{--tw-text-opacity:1;color:rgb(199 210 254/var(--tw-text-opacity,1))}.text-indigo-300{--tw-text-opacity:1;color:rgb(165 180 252/var(--tw-text-opacity,1))}.text-indigo-500{--tw-text-opacity:1;color:rgb(99 102 241/var(--tw-text-opacity,1))}.text-indigo-600{--tw-text-opacity:1;color:rgb(79 70 229/var(--tw-text-opacity,1))}.text-indigo-700{--tw-text-opacity:1;color:rgb(67 56 202/var(--tw-text-opacity,1))}.text-rose-500{--tw-text-opacity:1;color:rgb(244 63 94/var(--tw-text-opacity,1))}.text-rose-600{--tw-text-opacity:1;color:rgb(225 29 72/var(--tw-text-opacity,1))}.text-slate-100{--tw-text-opacity:1;color:rgb(241 245 249/var(--tw-text-opacity,1))}.text-slate-300{--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity,1))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity,1))}.text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.text-violet-400{--tw-text-opacity:1;color:rgb(167 139 250/var(--tw-text-opacity,1))}.text-violet-500{--tw-text-opacity:1;color:rgb(139 92 246/var(--tw-text-opacity,1))}.text-violet-600{--tw-text-opacity:1;color:rgb(124 58 237/var(--tw-text-opacity,1))}.text-violet-700{--tw-text-opacity:1;color:rgb(109 40 217/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.underline{text-decoration-line:underline}.line-through{text-decoration-line:line-through}.underline-offset-2{text-underline-offset:2px}.accent-indigo-600{accent-color:#4f46e5}.accent-violet-600{accent-color:#7c3aed}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-80{opacity:.8}.opacity-90{opacity:.9}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-2xl{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-lg,.shadow-md{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-sm,.shadow-xl{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color)}.shadow-indigo-500\/20{--tw-shadow-color:rgba(99,102,241,.2);--tw-shadow:var(--tw-shadow-colored)}.shadow-violet-500\/20{--tw-shadow-color:rgba(139,92,246,.2);--tw-shadow:var(--tw-shadow-colored)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-indigo-400{--tw-ring-opacity:1;--tw-ring-color:rgb(129 140 248/var(--tw-ring-opacity,1))}.ring-indigo-500{--tw-ring-opacity:1;--tw-ring-color:rgb(99 102 241/var(--tw-ring-opacity,1))}.ring-rose-400{--tw-ring-opacity:1;--tw-ring-color:rgb(251 113 133/var(--tw-ring-opacity,1))}.ring-violet-400{--tw-ring-opacity:1;--tw-ring-color:rgb(167 139 250/var(--tw-ring-opacity,1))}.ring-offset-2{--tw-ring-offset-width:2px}.blur{--tw-blur:blur(8px)}.blur,.drop-shadow{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow{--tw-drop-shadow:drop-shadow(0 1px 2px rgba(0,0,0,.1)) drop-shadow(0 1px 1px rgba(0,0,0,.06))}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-sm{--tw-backdrop-blur:blur(4px)}.backdrop-blur-sm,.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.hover\:border-indigo-300:hover{--tw-border-opacity:1;border-color:rgb(165 180 252/var(--tw-border-opacity,1))}.hover\:border-indigo-400:hover{--tw-border-opacity:1;border-color:rgb(129 140 248/var(--tw-border-opacity,1))}.hover\:border-indigo-500:hover{--tw-border-opacity:1;border-color:rgb(99 102 241/var(--tw-border-opacity,1))}.hover\:border-slate-300:hover{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1))}.hover\:border-violet-400:hover{--tw-border-opacity:1;border-color:rgb(167 139 250/var(--tw-border-opacity,1))}.hover\:bg-indigo-50:hover{--tw-bg-opacity:1;background-color:rgb(238 242 255/var(--tw-bg-opacity,1))}.hover\:bg-indigo-50\/40:hover{background-color:rgba(238,242,255,.4)}.hover\:bg-indigo-500:hover{--tw-bg-opacity:1;background-color:rgb(99 102 241/var(--tw-bg-opacity,1))}.hover\:bg-indigo-700:hover{--tw-bg-opacity:1;background-color:rgb(67 56 202/var(--tw-bg-opacity,1))}.hover\:bg-rose-50:hover{--tw-bg-opacity:1;background-color:rgb(255 241 242/var(--tw-bg-opacity,1))}.hover\:bg-rose-700:hover{--tw-bg-opacity:1;background-color:rgb(190 18 60/var(--tw-bg-opacity,1))}.hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.hover\:bg-slate-200:hover{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity,1))}.hover\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.hover\:bg-violet-50:hover{--tw-bg-opacity:1;background-color:rgb(245 243 255/var(--tw-bg-opacity,1))}.hover\:bg-violet-700:hover{--tw-bg-opacity:1;background-color:rgb(109 40 217/var(--tw-bg-opacity,1))}.hover\:bg-white:hover{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.hover\:bg-white\/10:hover{background-color:hsla(0,0%,100%,.1)}.hover\:bg-white\/15:hover{background-color:hsla(0,0%,100%,.15)}.hover\:bg-white\/20:hover{background-color:hsla(0,0%,100%,.2)}.hover\:text-emerald-600:hover{--tw-text-opacity:1;color:rgb(5 150 105/var(--tw-text-opacity,1))}.hover\:text-indigo-600:hover{--tw-text-opacity:1;color:rgb(79 70 229/var(--tw-text-opacity,1))}.hover\:text-rose-600:hover{--tw-text-opacity:1;color:rgb(225 29 72/var(--tw-text-opacity,1))}.hover\:text-slate-600:hover{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity,1))}.hover\:text-violet-600:hover{--tw-text-opacity:1;color:rgb(124 58 237/var(--tw-text-opacity,1))}.hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.hover\:underline:hover{text-decoration-line:underline}.focus\:bg-slate-100:focus{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.focus\:bg-slate-50:focus{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-indigo-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(99 102 241/var(--tw-ring-opacity,1))}.focus\:ring-violet-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(139 92 246/var(--tw-ring-opacity,1))}.focus-visible\:ring-2:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-indigo-500:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(99 102 241/var(--tw-ring-opacity,1))}.disabled\:opacity-40:disabled{opacity:.4}.group:hover .group-hover\:scale-105{--tw-scale-x:1.05;--tw-scale-y:1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity,1))}.has-\[\:checked\]\:border-indigo-500:has(:checked){--tw-border-opacity:1;border-color:rgb(99 102 241/var(--tw-border-opacity,1))}.has-\[\:checked\]\:bg-indigo-50\/60:has(:checked){background-color:rgba(238,242,255,.6)}.dark\:divide-slate-800:is(.dark *)>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(30 41 59/var(--tw-divide-opacity,1))}.dark\:border-indigo-800:is(.dark *){--tw-border-opacity:1;border-color:rgb(55 48 163/var(--tw-border-opacity,1))}.dark\:border-slate-700:is(.dark *){--tw-border-opacity:1;border-color:rgb(51 65 85/var(--tw-border-opacity,1))}.dark\:border-slate-800:is(.dark *){--tw-border-opacity:1;border-color:rgb(30 41 59/var(--tw-border-opacity,1))}.dark\:border-violet-800:is(.dark *){--tw-border-opacity:1;border-color:rgb(91 33 182/var(--tw-border-opacity,1))}.dark\:bg-emerald-950\/20:is(.dark *){background-color:rgba(2,44,34,.2)}.dark\:bg-emerald-950\/30:is(.dark *){background-color:rgba(2,44,34,.3)}.dark\:bg-indigo-950\/30:is(.dark *){background-color:rgba(30,27,75,.3)}.dark\:bg-indigo-950\/40:is(.dark *){background-color:rgba(30,27,75,.4)}.dark\:bg-indigo-950\/50:is(.dark *){background-color:rgba(30,27,75,.5)}.dark\:bg-rose-950\/30:is(.dark *){background-color:rgba(76,5,25,.3)}.dark\:bg-slate-600:is(.dark *){--tw-bg-opacity:1;background-color:rgb(71 85 105/var(--tw-bg-opacity,1))}.dark\:bg-slate-700:is(.dark *){--tw-bg-opacity:1;background-color:rgb(51 65 85/var(--tw-bg-opacity,1))}.dark\:bg-slate-800:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:bg-slate-800\/50:is(.dark *){background-color:rgba(30,41,59,.5)}.dark\:bg-slate-800\/60:is(.dark *){background-color:rgba(30,41,59,.6)}.dark\:bg-slate-800\/70:is(.dark *){background-color:rgba(30,41,59,.7)}.dark\:bg-slate-900:is(.dark *){--tw-bg-opacity:1;background-color:rgb(15 23 42/var(--tw-bg-opacity,1))}.dark\:bg-slate-900\/50:is(.dark *){background-color:rgba(15,23,42,.5)}.dark\:bg-slate-900\/90:is(.dark *){background-color:rgba(15,23,42,.9)}.dark\:bg-slate-900\/95:is(.dark *){background-color:rgba(15,23,42,.95)}.dark\:bg-slate-950:is(.dark *){--tw-bg-opacity:1;background-color:rgb(2 6 23/var(--tw-bg-opacity,1))}.dark\:bg-violet-950\/10:is(.dark *){background-color:rgba(46,16,101,.1)}.dark\:bg-violet-950\/50:is(.dark *){background-color:rgba(46,16,101,.5)}.dark\:bg-violet-950\/60:is(.dark *){background-color:rgba(46,16,101,.6)}.dark\:bg-white:is(.dark *){--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.dark\:text-amber-400:is(.dark *){--tw-text-opacity:1;color:rgb(251 191 36/var(--tw-text-opacity,1))}.dark\:text-emerald-300:is(.dark *){--tw-text-opacity:1;color:rgb(110 231 183/var(--tw-text-opacity,1))}.dark\:text-emerald-400:is(.dark *){--tw-text-opacity:1;color:rgb(52 211 153/var(--tw-text-opacity,1))}.dark\:text-indigo-300:is(.dark *){--tw-text-opacity:1;color:rgb(165 180 252/var(--tw-text-opacity,1))}.dark\:text-indigo-400:is(.dark *){--tw-text-opacity:1;color:rgb(129 140 248/var(--tw-text-opacity,1))}.dark\:text-rose-400:is(.dark *){--tw-text-opacity:1;color:rgb(251 113 133/var(--tw-text-opacity,1))}.dark\:text-slate-200:is(.dark *){--tw-text-opacity:1;color:rgb(226 232 240/var(--tw-text-opacity,1))}.dark\:text-slate-300:is(.dark *){--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity,1))}.dark\:text-slate-400:is(.dark *){--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.dark\:text-slate-700:is(.dark *){--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.dark\:text-slate-900:is(.dark *){--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.dark\:text-violet-300:is(.dark *){--tw-text-opacity:1;color:rgb(196 181 253/var(--tw-text-opacity,1))}.dark\:ring-offset-slate-900:is(.dark *){--tw-ring-offset-color:#0f172a}.dark\:hover\:border-indigo-700:hover:is(.dark *){--tw-border-opacity:1;border-color:rgb(67 56 202/var(--tw-border-opacity,1))}.dark\:hover\:border-slate-700:hover:is(.dark *){--tw-border-opacity:1;border-color:rgb(51 65 85/var(--tw-border-opacity,1))}.dark\:hover\:bg-indigo-950\/20:hover:is(.dark *){background-color:rgba(30,27,75,.2)}.dark\:hover\:bg-indigo-950\/40:hover:is(.dark *){background-color:rgba(30,27,75,.4)}.dark\:hover\:bg-indigo-950\/50:hover:is(.dark *){background-color:rgba(30,27,75,.5)}.dark\:hover\:bg-rose-950\/30:hover:is(.dark *){background-color:rgba(76,5,25,.3)}.dark\:hover\:bg-slate-700:hover:is(.dark *){--tw-bg-opacity:1;background-color:rgb(51 65 85/var(--tw-bg-opacity,1))}.dark\:hover\:bg-slate-800:hover:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:hover\:bg-slate-800\/50:hover:is(.dark *){background-color:rgba(30,41,59,.5)}.dark\:hover\:bg-slate-800\/60:hover:is(.dark *){background-color:rgba(30,41,59,.6)}.dark\:hover\:bg-slate-800\/80:hover:is(.dark *){background-color:rgba(30,41,59,.8)}.dark\:hover\:bg-violet-950\/30:hover:is(.dark *){background-color:rgba(46,16,101,.3)}.dark\:hover\:text-slate-200:hover:is(.dark *){--tw-text-opacity:1;color:rgb(226 232 240/var(--tw-text-opacity,1))}.dark\:focus\:bg-slate-800:focus:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.group:hover .dark\:group-hover\:text-slate-200:is(.dark *){--tw-text-opacity:1;color:rgb(226 232 240/var(--tw-text-opacity,1))}.dark\:has-\[\:checked\]\:bg-indigo-950\/30:has(:checked):is(.dark *){background-color:rgba(30,27,75,.3)}@media (min-width:640px){.sm\:col-span-2{grid-column:span 2/span 2}.sm\:col-span-3{grid-column:span 3/span 3}.sm\:inline{display:inline}.sm\:w-40{width:10rem}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:grid-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}.sm\:text-base{font-size:1rem;line-height:1.5rem}}@media (min-width:768px){.md\:inline{display:inline}.md\:flex-row{flex-direction:row}.md\:items-end{align-items:flex-end}.md\:justify-between{justify-content:space-between}.md\:text-9xl{font-size:8rem;line-height:1}}@media (min-width:1024px){.lg\:col-span-2{grid-column:span 2/span 2}.lg\:col-span-3{grid-column:span 3/span 3}.lg\:w-48{width:12rem}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:grid-cols-\[minmax\(0\2c 1\.3fr\)_minmax\(0\2c \.7fr\)\]{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}}@media (min-width:1280px){.xl\:w-72{width:18rem}.xl\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.xl\:grid-cols-\[minmax\(0\2c 1fr\)_290px\]{grid-template-columns:minmax(0,1fr) 290px}.xl\:flex-row{flex-direction:row}.xl\:items-center{align-items:center}}@media (min-width:1536px){.\32xl\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}
/* ---- end Tailwind ---- */
:root { box-sizing: border-box; padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
html, body { height: 100%; margin: 0; }
body { font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; display: flex; overflow: hidden; color: #0f172a; background: #f8fafc; }
.dark body { color: #f1f5f9; background: #020617; }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 9999px; }
.dark ::-webkit-scrollbar-thumb { background: #475569; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
.animate-fade-in { animation: fadeIn 0.2s ease-out forwards; }
.utility-clock { font-variant-numeric: tabular-nums; letter-spacing: -0.04em; }
.timer-ring { font-variant-numeric: tabular-nums; }
.utility-pill { min-width: 118px; }

/* ---- Notes & layout ---- */
#sidebar { transition: width .25s ease; }
#sidebar > * { min-width: 16rem; }
#sidebar.is-collapsed { width: 0 !important; min-width: 0; border-right-width: 0 !important; overflow: hidden; }
body.focus-mode #sidebar, body.focus-mode .app-header { display: none !important; }
.no-scrollbar { scrollbar-width: none; } .no-scrollbar::-webkit-scrollbar { display: none; }
.ne-btn, .ne-tool { flex-shrink: 0; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; color: #475569; transition: background .15s, color .15s; }
.dark .ne-btn, .dark .ne-tool { color: #cbd5e1; }
.ne-btn:hover, .ne-tool:hover { background: #f1f5f9; } .dark .ne-btn:hover, .dark .ne-tool:hover { background: #1e293b; }
.ne-tool.is-active, .dark .ne-tool.is-active { background: #4f46e5; color: #fff; }
.ne-btn:disabled { opacity: .3; pointer-events: none; }
.ne-sep { flex-shrink: 0; width: 1px; height: 22px; background: #e2e8f0; margin: 0 4px; } .dark .ne-sep { background: #334155; }
.ne-swatch { flex-shrink: 0; width: 22px; height: 22px; border-radius: 999px; border: 2px solid transparent; box-shadow: inset 0 0 0 1px rgba(15,23,42,.18); transition: transform .12s; }
.ne-swatch.is-active { border-color: #6366f1; transform: scale(1.1); }
.ne-chip { flex-shrink: 0; height: 30px; padding: 0 10px; border-radius: 9px; font-size: 11px; font-weight: 600; color: #475569; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.dark .ne-chip { color: #cbd5e1; }
.ne-chip:hover { background: #f1f5f9; } .dark .ne-chip:hover { background: #1e293b; }
.ne-chip.is-active { background: #eef2ff; color: #4338ca; } .dark .ne-chip.is-active { background: rgba(99,102,241,.22); color: #c7d2fe; }
input[type=color].ne-color { -webkit-appearance: none; appearance: none; flex-shrink: 0; width: 22px; height: 22px; border: 0; padding: 0; border-radius: 999px; cursor: pointer; background: conic-gradient(#f87171,#fbbf24,#34d399,#60a5fa,#a78bfa,#f472b6,#f87171); }
input[type=color].ne-color::-webkit-color-swatch-wrapper { padding: 0; }
input[type=color].ne-color::-webkit-color-swatch { border: 0; opacity: 0; }
input[type=color].ne-color::-moz-color-swatch { border: 0; opacity: 0; }
#ne-stage { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
#ne-live { touch-action: none; }
.k-card { touch-action: pan-y; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.k-col.k-over { outline: 2px solid #6366f1; outline-offset: 2px; }
.k-col { transition: outline-color .12s; }
#ne-textedit { position: absolute; z-index: 15; border: 0; margin: 0; padding: 0; background: rgba(99,102,241,.06); outline: 1.5px dashed rgba(99,102,241,.7); outline-offset: 4px; resize: none; overflow: hidden; white-space: pre-wrap; overflow-wrap: break-word; -webkit-user-select: text; user-select: text; }
.hover-reveal { opacity: 1; }
@media (hover: hover) { .hover-reveal { opacity: 0; } .group:hover .hover-reveal { opacity: 1; } }
.note-card .thumb { transition: transform .18s ease, box-shadow .18s ease; }
.note-card:hover .thumb { transform: translateY(-2px); box-shadow: 0 12px 24px -14px rgba(15,23,42,.45); }
@media (prefers-reduced-motion: reduce) { .note-card .thumb, #sidebar { transition: none; } }













/* =====================================================================
   THEME — "Planner Light" and "Lightblack Dark"
   Paper-planner surfaces, 24 px grid paper, ink-blue accents, mono labels,
   handwritten (Caveat) touches. Variable names are shared by every module.
   ===================================================================== */
:root {
  --bg-app: #F7F5F0; --bg-sidebar: #EFECE6; --bg-card: #FFFFFF; --paper: #FBF9F5;
  --border-color: #E2DDD5; --text-main: #2C2A29; --text-muted: #78716C; --grid-line: rgba(120,113,108,.07);
  --ink: #2F4A8A; --ink-soft: rgba(47,74,138,.14); --stabilo: rgba(96,165,250,.32); --postit: #FEF3C7;
  --surface: var(--bg-card); --surface-strong: #FFFFFF; --surface-soft: rgba(0,0,0,.015);
  --field: #FBFAF7; --tint: rgba(0,0,0,.04); --hover: rgba(0,0,0,.045);
  --line: var(--border-color); --line-strong: #D6D0C6;
}
.dark {
  --bg-app: #121316; --bg-sidebar: #17181C; --bg-card: #1A1C23; --paper: #16171C;
  --border-color: #262932; --text-main: #F3F4F6; --text-muted: #9CA3AF; --grid-line: rgba(255,255,255,.03);
  --ink: #93B4F5; --ink-soft: rgba(147,180,245,.16); --stabilo: rgba(96,165,250,.26); --postit: rgba(245,158,11,.14);
  --surface: var(--bg-card); --surface-strong: #1D1F27; --surface-soft: rgba(255,255,255,.01);
  --field: #15161B; --tint: rgba(255,255,255,.05); --hover: rgba(255,255,255,.05);
  --line: var(--border-color); --line-strong: #323643;
}
body, .dark body {
  background-color: var(--bg-app); color: var(--text-main);
  background-image: linear-gradient(to right, var(--grid-line) 1px, transparent 1px), linear-gradient(to bottom, var(--grid-line) 1px, transparent 1px);
  background-size: 24px 24px; transition: background-color .2s ease, color .2s ease;
}
/* the old glow layer becomes a muted ambient glow, dark mode only */
.glow-bg { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.glow-bg .orb { display: none; }
.dark .glow-bg::before { content: ''; position: absolute; width: 60vmax; height: 60vmax; left: -20vmax; top: -30vmax; border-radius: 50%; background: radial-gradient(circle, rgba(99,102,241,.10), transparent 65%); }
#sidebar, body > main { position: relative; z-index: 1; }
body > main, #notes-editor, [class~="dark:bg-slate-950"] { background: transparent !important; }

/* surfaces: crisp paper cards */
[class~="dark:bg-slate-900"] { background-color: var(--bg-card) !important; }
#sidebar { background-color: var(--bg-sidebar) !important; border-color: var(--border-color) !important; }
.app-header { background-color: var(--bg-card) !important; border-color: var(--border-color) !important; }
[class~="dark:bg-slate-900"][class~="shadow-sm"], .planner-card { box-shadow: 0 1px 3px rgba(0,0,0,.03) !important; }
.fixed > [class~="dark:bg-slate-900"], #task-panel, #note-menu, #ne-pop, #tp-note-results,
[class~="dark:bg-slate-900/95"], [class~="dark:bg-slate-900/90"] { background-color: var(--surface-strong) !important; box-shadow: 0 24px 48px -24px rgba(0,0,0,.35); }
[class~="dark:bg-slate-900/50"], [class~="bg-slate-100/70"] { background-color: var(--surface-soft) !important; }
[class~="rounded-3xl"] { border-radius: 16px !important; }

/* fields, tiles, hovers */
[class~="dark:bg-slate-800"], html:not(.dark) [class~="bg-slate-50"] { background-color: var(--field) !important; }
.dark [class~="dark:bg-slate-800/60"], .dark [class~="dark:bg-slate-800/50"], .dark [class~="dark:bg-slate-800/70"] { background-color: rgba(255,255,255,.03) !important; }
.dark [class~="dark:bg-slate-700"] { background-color: rgba(255,255,255,.1) !important; }
html:not(.dark) [class~="bg-slate-100"] { background-color: var(--tint) !important; }
[class~="hover:bg-slate-50"]:hover, [class~="hover:bg-slate-100"]:hover, .dark [class~="dark:hover:bg-slate-800"]:hover, .dark [class~="dark:hover:bg-slate-800/60"]:hover, .dark [class~="dark:hover:bg-slate-800/50"]:hover { background-color: var(--hover) !important; }

/* ink & paper lines */
[class~="border-slate-200"], [class~="border-slate-100"], .dark [class~="dark:border-slate-800"] { border-color: var(--border-color) !important; }
[class~="border-slate-300"], .dark [class~="dark:border-slate-700"] { border-color: var(--line-strong) !important; }
.dark [class~="dark:divide-slate-800"] > * + * { border-color: var(--border-color) !important; }
.text-slate-500, .text-slate-400, .dark .text-slate-500, .dark .text-slate-400, .dark [class~="dark:text-slate-400"] { color: var(--text-muted) !important; }

/* notebook typography: mono labels, handwritten accents */
.font-hand { font-family: Caveat, 'Segoe Print', cursive; font-weight: 600; }
.fs-label, [class~="uppercase"][class~="tracking-wider"], [class~="uppercase"][class~="tracking-widest"] { font-family: 'JetBrains Mono', ui-monospace, monospace !important; letter-spacing: .08em; }
.fs-label { font-size: 10px; font-weight: 600; text-transform: uppercase; color: var(--text-muted); }

/* covers (hero, plan card): ink-blue notebook covers in light, dark paper in dark */
[class~="bg-slate-950"][class~="rounded-3xl"] {
  background: linear-gradient(135deg, rgba(255,255,255,.05) 0 1px, transparent 1px) 0 0/22px 22px, linear-gradient(160deg, #26345A, #1B2440) !important;
  border: 1px solid rgba(147,180,245,.18); color: #F3F4F6;
}
.dark [class~="bg-slate-950"][class~="rounded-3xl"] { background: linear-gradient(160deg, #1D2029, #16181E) !important; border-color: var(--border-color); }
#cos-toast, #ne-selbar, #ne-replaybar { background: #1F2230 !important; border: 1px solid rgba(255,255,255,.08); }
::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb, .dark ::-webkit-scrollbar-thumb { background: var(--border-color); border-radius: 4px; }

/* notes chrome */
.ne-btn:hover, .ne-tool:hover, .dark .ne-btn:hover, .dark .ne-tool:hover, .ne-chip:hover, .dark .ne-chip:hover { background: var(--hover); }
.ne-sep, .dark .ne-sep { background: var(--line-strong); }
.ne-btn.is-on { background: #eef2ff; color: #4338ca; } .dark .ne-btn.is-on { background: rgba(129,140,248,.2); color: #c7d2fe; }
.ne-size { width: 46px; height: 30px; flex-shrink: 0; border-radius: 9px; text-align: center; font-size: 12px; font-weight: 600; background: var(--field); border: 1px solid var(--line-strong); color: inherit; outline: none; -moz-appearance: textfield; }
.ne-size:focus { box-shadow: 0 0 0 2px #6366f1; }
.ne-size::-webkit-outer-spin-button, .ne-size::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
#ne-text-handle { position: absolute; z-index: 16; width: 8px; border-radius: 999px; background: #6366f1; cursor: ew-resize; box-shadow: 0 0 0 2px rgba(255,255,255,.8); touch-action: none; }
#ne-text-handle::after { content: ''; position: absolute; inset: -6px -8px; }

/* sidebar index + active courses + theme switch */
.nav-btn { font-size: 13px !important; }
.nav-btn[class~="bg-indigo-50"] { border: 1px solid rgba(99,102,241,.22); box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.fs-course { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 10px; border-radius: 8px; border: 1px solid var(--border-color); background: var(--tint); font: 11px 'JetBrains Mono', monospace; }
.fs-course b { font-weight: 700; } .fs-course span { font-size: 10px; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.theme-switch { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; border-radius: 10px; background: var(--tint); font-size: 12px; font-weight: 500; transition: background .15s; }
.theme-switch:hover { background: var(--hover); }
.theme-switch kbd { font: 10px 'JetBrains Mono', monospace; opacity: .6; background: var(--tint); padding: 1px 6px; border-radius: 5px; }

/* Assignments — planner board */
.planner-card { background: var(--bg-card); border: 1px solid var(--border-color); transition: transform .2s cubic-bezier(.16,1,.3,1), border-color .2s, box-shadow .2s; }
.k-telemetry { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); border-radius: 12px; overflow: hidden; }
.k-telemetry > div { padding: 16px; display: flex; flex-direction: column; justify-content: center; }
.k-telemetry > div + div { border-left: 1px solid var(--border-color); }
.k-telemetry span { font: 600 10px 'JetBrains Mono', monospace; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); margin-bottom: 4px; }
.k-telemetry b { font: 700 24px 'JetBrains Mono', monospace; }
.k-telemetry .is-indigo { background: rgba(99,102,241,.03); } .k-telemetry .is-indigo span, .k-telemetry .is-indigo b { color: #6366f1; }
.k-telemetry .is-amber { background: rgba(245,158,11,.03); } .k-telemetry .is-amber span, .k-telemetry .is-amber b { color: #d97706; }
.k-telemetry .is-emerald { background: rgba(16,185,129,.03); } .k-telemetry .is-emerald span, .k-telemetry .is-emerald b { color: #059669; }
.dark .k-telemetry .is-amber span, .dark .k-telemetry .is-amber b { color: #fbbf24; } .dark .k-telemetry .is-emerald span, .dark .k-telemetry .is-emerald b { color: #34d399; } .dark .k-telemetry .is-indigo span, .dark .k-telemetry .is-indigo b { color: #818cf8; }
@media (max-width: 760px) { .k-telemetry { grid-template-columns: repeat(2, minmax(0,1fr)); } .k-telemetry > div + div { border-left: 0; border-top: 1px solid var(--border-color); } }
.k-board { display: flex; gap: 24px; overflow-x: auto; padding-bottom: 16px; }
.k-col { flex: 1 1 300px; min-width: 280px; display: flex; flex-direction: column; border-radius: 12px; }
.k-col-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; padding: 0 4px; }
.k-col-title { font: 700 12px 'JetBrains Mono', monospace; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); }
.k-count { font: 12px 'JetBrains Mono', monospace; padding: 1px 8px; border-radius: 6px; border: 1px solid var(--border-color); background: var(--tint); color: var(--text-muted); }
.k-col[data-kcol="inprogress"] .k-col-title, .k-col[data-kcol="inprogress"] .k-count { color: #4f46e5; } .dark .k-col[data-kcol="inprogress"] .k-col-title, .dark .k-col[data-kcol="inprogress"] .k-count { color: #818cf8; }
.k-col[data-kcol="inprogress"] .k-count { background: rgba(99,102,241,.1); border-color: rgba(99,102,241,.2); }
.k-col[data-kcol="completed"] .k-col-title, .k-col[data-kcol="completed"] .k-count { color: #059669; } .dark .k-col[data-kcol="completed"] .k-col-title, .dark .k-col[data-kcol="completed"] .k-count { color: #34d399; }
.k-col[data-kcol="completed"] .k-count { background: rgba(16,185,129,.1); border-color: rgba(16,185,129,.2); }
.notebook-column { flex: 1; min-height: 420px; border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 12px; background: rgba(0,0,0,.015); border: 1px dashed var(--border-color); }
.dark .notebook-column { background: rgba(255,255,255,.01); }
.k-col.k-over .notebook-column { border-color: #6366f1; background: rgba(99,102,241,.05); }
.k-card.planner-card:hover { border-color: rgba(99,102,241,.4); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,.06) !important; }
.k-card.is-done { opacity: .75; } .k-card.is-done:hover { opacity: 1; }
.k-prio { display: inline-flex; align-items: center; gap: 4px; font: 600 9px 'JetBrains Mono', monospace; text-transform: uppercase; padding: 2px 8px; border-radius: 5px; border: 1px solid; }
.k-prio.is-rose { color: #e11d48; background: rgba(244,63,94,.1); border-color: rgba(244,63,94,.2); }
.k-prio.is-amber { color: #d97706; background: rgba(245,158,11,.1); border-color: rgba(245,158,11,.2); }
.k-prio.is-slate { color: var(--text-muted); background: var(--tint); border-color: var(--border-color); }
.dark .k-prio.is-rose { color: #fb7185; } .dark .k-prio.is-amber { color: #fbbf24; }
.k-pulse { width: 6px; height: 6px; border-radius: 999px; background: #f43f5e; animation: kPulse 1.6s ease-in-out infinite; }
@keyframes kPulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .k-pulse { animation: none; } }
.k-course { color: var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); padding: 1px 6px; border-radius: 4px; font-weight: 600; }
.k-bar { height: 4px; border-radius: 999px; background: var(--tint); overflow: hidden; } .k-bar i { display: block; height: 100%; border-radius: 999px; }
.k-more { padding: 2px; border-radius: 6px; color: var(--text-muted); } .k-more:hover { color: var(--text-main); background: var(--hover); }
.seg { display: flex; gap: 4px; padding: 4px; border-radius: 10px; background: var(--tint); border: 1px solid var(--border-color); }
.seg button { padding: 6px 12px; border-radius: 7px; font-size: 12px; font-weight: 500; color: var(--text-muted); }
.seg button:hover { color: var(--text-main); }
.seg button.is-active { background: var(--bg-card); color: var(--text-main); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.08); }

/* ---- Timetable calendar ---- */
.tt-grid { display: grid; min-width: max-content; }
.tt-corner { border-bottom: 1px solid var(--line); }
.tt-dayhead { position: relative; padding: 12px 8px 10px; text-align: center; border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); transition: background .2s; }
.tt-dayhead:hover { background: var(--hover); }
.tt-dayhead.is-selected { background: linear-gradient(to bottom, rgba(99,102,241,.10), transparent); }
.tt-dayhead.is-selected::after { content: ''; position: absolute; left: 22%; right: 22%; bottom: -1px; height: 2px; border-radius: 2px; background: #6366f1; }
.tt-dayhead.is-past .tt-date, .tt-dayhead.is-past .tt-dow { opacity: .45; }
.tt-dow { display: block; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; opacity: .55; }
.tt-date { display: flex; align-items: center; justify-content: center; font-size: 19px; font-weight: 700; width: 38px; height: 38px; margin: 4px auto 6px; border-radius: 13px; font-variant-numeric: tabular-nums; }
.tt-dayhead.is-today .tt-date { color: #fff; background: linear-gradient(135deg, #6366f1, #a855f7); box-shadow: 0 10px 24px -8px rgba(124,58,237,.9); }
.tt-dayload { display: block; height: 3px; width: 60%; margin: 0 auto 5px; border-radius: 3px; background: var(--line); overflow: hidden; }
.tt-dayload i { display: block; height: 100%; border-radius: 3px; }
.tt-dayhead em { display: block; font-style: normal; font-size: 10px; opacity: .55; font-variant-numeric: tabular-nums; }
.tt-times { position: relative; }
.tt-times span { position: absolute; right: 10px; transform: translateY(-50%); font-size: 10px; font-weight: 600; opacity: .45; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.tt-times span:first-child { transform: none; }
.tt-times .tt-now-label { opacity: 1; right: 4px; padding: 2px 6px; border-radius: 7px; background: #f43f5e; color: #fff; font-weight: 700; box-shadow: 0 6px 14px -4px rgba(244,63,94,.8); z-index: 7; }
.tt-col { position: relative; border-left: 1px solid var(--line); cursor: cell;
  background-image: linear-gradient(to bottom, var(--line) 1px, transparent 1px), repeating-linear-gradient(to right, var(--line) 0 3px, transparent 3px 7px);
  background-size: 100% var(--px), 100% 1px; background-position: 0 0, 0 calc(var(--px) / 2); background-repeat: repeat, repeat-y; }
.tt-col { background-image: linear-gradient(to bottom, var(--line) 1px, transparent 1px, transparent calc(50% - .5px), rgba(148,163,184,.14) calc(50% - .5px), rgba(148,163,184,.14) calc(50% + .5px), transparent calc(50% + .5px)); background-size: 100% var(--px); }
.tt-col.is-weekend { background-color: rgba(148,163,184,.05); }
.tt-col.is-today { background-color: rgba(99,102,241,.06); box-shadow: inset 0 0 0 1px rgba(99,102,241,.18); }
.tt-col.is-pastday::before, .tt-past { content: ''; position: absolute; left: 0; right: 0; top: 0; pointer-events: none; z-index: 1;
  background: repeating-linear-gradient(135deg, rgba(148,163,184,.07) 0 6px, transparent 6px 12px); }
.tt-col.is-pastday::before { bottom: 0; }
.tt-ghost { position: absolute; left: 4px; right: 4px; border-radius: 12px; border: 1.5px dashed rgba(99,102,241,.55); background: rgba(99,102,241,.08); color: #6366f1; font-size: 11px; font-weight: 700; padding: 6px 9px; pointer-events: none; z-index: 1; font-variant-numeric: tabular-nums; }
.dark .tt-ghost { color: #a5b4fc; }
.tt-block { position: absolute; border-radius: 14px; padding: 7px 9px 7px 12px; color: #fff; overflow: hidden; cursor: grab; touch-action: pan-y; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; z-index: 2;
  box-shadow: 0 14px 26px -16px var(--glow), 0 2px 6px -2px rgba(15,23,42,.35), inset 0 1px 0 rgba(255,255,255,.25); transition: box-shadow .18s, transform .18s, opacity .18s; }
.tt-block::before { content: ''; position: absolute; left: 4px; top: 7px; bottom: 7px; width: 3px; border-radius: 3px; background: rgba(255,255,255,.7); }
.tt-block::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(120% 70% at 100% 0%, rgba(255,255,255,.22), transparent 55%); pointer-events: none; }
.tt-block:hover, .tt-block:focus-visible { transform: translateY(-1px); box-shadow: 0 18px 32px -14px var(--glow), 0 0 0 2px rgba(255,255,255,.6) inset; outline: none; z-index: 3; }
.tt-kind { display: flex; align-items: center; gap: 4px; font-size: 8.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.85); }
.tt-kind svg { width: 11px; height: 11px; stroke-width: 2.4; }
.tt-block b { display: block; font-size: 12px; line-height: 1.25; font-weight: 700; color: #fff; margin-top: 3px; letter-spacing: -.005em; }
.tt-time { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin-top: 5px; font-size: 10px; color: #fff; }
.tt-pill { padding: 1px 7px; border-radius: 999px; background: rgba(255,255,255,.2); font-weight: 700; font-variant-numeric: tabular-nums; backdrop-filter: blur(4px); }
.tt-room { opacity: .9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.tt-task { display: block; margin-top: 4px; font-size: 10px; color: rgba(255,255,255,.88); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-block.is-short { padding: 4px 9px 4px 12px; display: flex; align-items: center; gap: 6px; }
.tt-block.is-short::before { top: 5px; bottom: 5px; }
.tt-block.is-short .tt-kind, .tt-block.is-short .tt-room, .tt-block.is-short .tt-task { display: none; }
.tt-block.is-short b { margin: 0; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.tt-block.is-short .tt-time { margin: 0; flex-shrink: 0; }
.tt-block.is-past { opacity: .58; filter: saturate(.75); }
.tt-block.is-once { outline: 1.5px dashed rgba(255,255,255,.7); outline-offset: -5px; }
.tt-block.is-dragging { opacity: .96; cursor: grabbing; z-index: 30; transform: scale(1.02); box-shadow: 0 28px 46px -18px var(--glow), inset 0 0 0 2px rgba(255,255,255,.75); }
.tt-resize { position: absolute; left: 0; right: 0; bottom: 0; height: 10px; cursor: ns-resize; z-index: 2; }
.tt-resize::after { content: ''; position: absolute; left: 50%; bottom: 3px; width: 22px; height: 3px; margin-left: -11px; border-radius: 2px; background: rgba(255,255,255,.8); opacity: 0; transition: opacity .15s; }
.tt-block:hover .tt-resize::after { opacity: 1; }
.tt-now { position: absolute; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, #f43f5e, #fb7185); z-index: 6; pointer-events: none; box-shadow: 0 0 12px rgba(244,63,94,.9); }
.tt-now::before { content: ''; position: absolute; left: -6px; top: -5px; width: 12px; height: 12px; border-radius: 50%; background: #f43f5e; box-shadow: 0 0 0 4px rgba(244,63,94,.25); }
.tt-load { display: flex; align-items: center; gap: 10px; text-align: left; padding: 10px 12px; border-radius: 18px; border: 1px solid var(--line); background: var(--field); transition: border-color .2s, transform .2s, box-shadow .2s; }
.tt-load:hover { border-color: rgba(99,102,241,.45); transform: translateY(-1px); }
.tt-load.is-selected { border-color: #6366f1; box-shadow: 0 0 0 1px #6366f1 inset, 0 12px 26px -18px rgba(99,102,241,.9); }
.tt-ring { width: 42px; height: 42px; flex-shrink: 0; transform: rotate(-90deg); }
.tt-ring-bg { fill: none; stroke: var(--line-strong); stroke-width: 4; }
.tt-ring-fg { fill: none; stroke-width: 4; stroke-linecap: round; transition: stroke-dasharray .6s ease; }
.tt-load-day { display: block; font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; opacity: .6; white-space: nowrap; }
.tt-load-h { display: block; font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.2; }
.tt-load-lvl { display: block; font-size: 10px; font-weight: 700; }
.tt-gap { display: inline-flex; align-items: center; gap: 8px; padding: 7px 8px 7px 11px; border-radius: 14px; border: 1px dashed rgba(124,58,237,.45); background: rgba(124,58,237,.06); font-size: 12px; transition: background .15s, border-color .15s, transform .15s; }
.tt-gap:hover { background: rgba(124,58,237,.14); border-style: solid; transform: translateY(-1px); }
.tt-gap-plus { width: 22px; height: 22px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #7c3aed, #c026d3); color: #fff; font-weight: 700; box-shadow: 0 6px 14px -6px rgba(124,58,237,.9); }
@media (prefers-reduced-motion: reduce) { .tt-block, .tt-load, .tt-gap, .tt-ring-fg { transition: none; } }

.tt-gap.is-info { cursor: default; border-style: solid; border-color: var(--line-strong); background: var(--tint); padding-right: 12px; }
.tt-gap.is-info:hover { background: var(--tint); }

/* ---- Schedule v3: summary cards, day/month views, side panels ---- */
.tt-navbox { display: flex; align-items: center; gap: 2px; padding: 3px; border-radius: 10px; background: var(--bg-card); border: 1px solid var(--border-color); }
.tt-count:not(:empty) { margin-left: 4px; font: 600 10px 'JetBrains Mono', monospace; padding: 1px 6px; border-radius: 6px; background: rgba(99,102,241,.12); color: #4f46e5; }
.tt-summary { display: grid; grid-template-columns: 1.35fr 1fr 1fr 1fr; gap: 16px; }
@media (max-width: 1180px) { .tt-summary { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px) { .tt-summary { grid-template-columns: minmax(0,1fr); } }
.tt-sum { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 16px 18px; border-radius: 12px; text-align: left; }
button.tt-sum:hover { border-color: rgba(99,102,241,.4); }
.tt-sum .dash-v { margin-top: 10px; }
.tt-sum.is-amber .dash-k, .tt-sum.is-amber .dash-v { color: #d97706; } .dark .tt-sum.is-amber .dash-k, .dark .tt-sum.is-amber .dash-v { color: #fbbf24; }
.tt-sum.is-rose .dash-k, .tt-sum.is-rose .dash-v { color: #e11d48; }
.tt-sum.is-indigo .dash-k { color: #4f46e5; } .dark .tt-sum.is-indigo .dash-k { color: #818cf8; }
.tt-sum-link { margin-top: auto; padding-top: 8px; font-size: 11px; font-weight: 600; color: #6366f1; opacity: 0; transition: opacity .15s; }
button.tt-sum:hover .tt-sum-link, button.tt-sum:focus-visible .tt-sum-link { opacity: 1; }
.tt-donut { width: 72px; height: 72px; flex-shrink: 0; }
.tt-donut text { font: 700 13px 'JetBrains Mono', monospace; fill: currentColor; }
.tt-legs { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.tt-leg { display: flex; align-items: center; gap: 7px; font-size: 11.5px; color: var(--text-muted); }
.tt-leg i { width: 8px; height: 8px; border-radius: 999px; flex-shrink: 0; }
.tt-leg b { margin-left: auto; font: 600 11px 'JetBrains Mono', monospace; color: var(--text-main); }
.tt-bars { display: flex; align-items: flex-end; gap: 2px; height: 28px; }
.tt-bars i { width: 5px; border-radius: 2px; background: #818cf8; opacity: .85; }
/* week view: empty day invite */
.tt-addblock { position: absolute; left: 8px; right: 8px; height: 120px; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border: 1.5px dashed var(--line-strong); border-radius: 12px; color: var(--text-muted); background: color-mix(in srgb, var(--bg-card) 70%, transparent); font-size: 11px; text-align: center; transition: border-color .15s, color .15s; }
.tt-addblock b { font-size: 12px; color: var(--text-main); } .tt-addblock span { font-size: 10px; }
.tt-addblock:hover { border-color: #6366f1; color: #6366f1; }
/* day view: free time + lunch from the planner rules */
.tt-free, .tt-lunch { position: absolute; left: 10px; right: 10px; z-index: 1; border-radius: 10px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 12px; font-size: 11px; overflow: hidden; }
.tt-free { border: 1.5px dashed rgba(16,185,129,.55); background: rgba(16,185,129,.06); color: #059669; }
.tt-free { align-items: flex-start; padding-top: 3px; line-height: 1.4; }
.tt-free em { font-style: normal; font-weight: 700; opacity: 0; transition: opacity .15s; }
.tt-free:hover { background: rgba(16,185,129,.12); } .tt-free:hover em { opacity: 1; }
.dark .tt-free { color: #34d399; }
.tt-lunch { justify-content: flex-start; border: 1px dashed var(--line-strong); color: var(--text-muted); background: repeating-linear-gradient(135deg, transparent 0 6px, var(--tint) 6px 12px); pointer-events: none; }
.tt-grid.is-day .tt-block b { font-size: 14px; }
/* month view */
.tt-month { padding: 14px; min-width: 640px; }
.tt-mdow, .tt-mgrid { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 6px; }
.tt-mdow span { font: 600 10px 'JetBrains Mono', monospace; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); padding: 0 6px 6px; }
.tt-mcell { min-height: 96px; display: flex; flex-direction: column; gap: 5px; padding: 8px; border-radius: 10px; border: 1px solid var(--border-color); background: var(--bg-card); text-align: left; min-width: 0; transition: border-color .15s; }
.tt-mcell:hover { border-color: rgba(99,102,241,.45); }
.tt-mcell.is-out { opacity: .45; }
.tt-mcell.is-today { border-color: #6366f1; box-shadow: inset 0 0 0 1px #6366f1; }
.tt-mhead { display: flex; align-items: baseline; justify-content: space-between; }
.tt-mhead b { font: 700 13px 'JetBrains Mono', monospace; } .tt-mcell.is-today .tt-mhead b { color: #6366f1; }
.tt-mhead em { font: 10px 'JetBrains Mono', monospace; font-style: normal; color: var(--text-muted); }
.tt-mkinds { display: flex; flex-wrap: wrap; gap: 6px; font: 10px 'JetBrains Mono', monospace; color: var(--text-muted); }
.tt-mkinds span { display: inline-flex; align-items: center; gap: 3px; } .tt-mkinds i { width: 7px; height: 7px; border-radius: 999px; }
.tt-mdue { font-size: 10.5px; font-weight: 600; color: #b45309; background: var(--postit); border-radius: 5px; padding: 1px 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dark .tt-mdue { color: #fcd34d; }
.tt-mmore { font-size: 10px; color: var(--text-muted); }
/* next up + mini month */
.tt-nu-ico { width: 30px; height: 30px; border-radius: 8px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: var(--c); background: color-mix(in srgb, var(--c) 13%, transparent); }
.tt-nu-when { flex-shrink: 0; font: 600 10.5px 'JetBrains Mono', monospace; color: var(--text-muted); }
.tt-mini { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 2px; text-align: center; }
.tt-mini > span { font: 600 9.5px 'JetBrains Mono', monospace; color: var(--text-muted); padding: 4px 0; }
.tt-mini-d { position: relative; height: 32px; border-radius: 8px; font: 12px 'JetBrains Mono', monospace; }
.tt-mini-d:hover { background: var(--hover); }
.tt-mini-d.is-out { opacity: .35; }
.tt-mini-d.is-week { background: rgba(99,102,241,.08); border-radius: 0; }
.tt-mini-d.is-today { background: #4f46e5; color: #fff; border-radius: 8px; font-weight: 700; }
.tt-mini-d i, .tt-mini-key i { position: absolute; left: 50%; bottom: 3px; width: 4px; height: 4px; margin-left: -2px; border-radius: 999px; background: #6366f1; }
.tt-mini-d i.is-due, .tt-mini-key i.is-due { background: #f59e0b; }
.tt-mini-d.is-today i { background: #fff; }
.tt-mini-key { display: flex; gap: 14px; margin-top: 8px; font-size: 10px; color: var(--text-muted); }
.tt-mini-key span { position: relative; padding-left: 9px; } .tt-mini-key i { left: 2px; bottom: auto; top: 6px; }
.tt-aibadge { font: 600 10px 'JetBrains Mono', monospace; color: var(--text-muted); padding: 2px 8px; border-radius: 6px; border: 1px solid var(--border-color); max-width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-aibadge:hover { color: #6366f1; }
/* Assignments: Due soon column */
.k-col[data-kcol="duesoon"] .k-col-title, .k-col[data-kcol="duesoon"] .k-count { color: #d97706; } .dark .k-col[data-kcol="duesoon"] .k-col-title, .dark .k-col[data-kcol="duesoon"] .k-count { color: #fbbf24; }
.k-col[data-kcol="duesoon"] .k-count { background: rgba(245,158,11,.1); border-color: rgba(245,158,11,.25); }
.k-col[data-kcol="duesoon"] .notebook-column { border-color: rgba(245,158,11,.35); background: rgba(245,158,11,.025); }
.k-col[data-kcol="duesoon"] .k-card { border-left: 2px solid #f59e0b !important; }
.k-state { font: 600 9px 'JetBrains Mono', monospace; text-transform: uppercase; color: var(--text-muted); padding: 2px 6px; border-radius: 5px; background: var(--tint); white-space: nowrap; }
.k-col { flex: 1 1 260px; min-width: 250px; }
.tp-soon { display: flex; align-items: center; gap: 8px; margin-top: 8px; padding: 8px 10px; border-radius: 10px; font-size: 11px; background: rgba(245,158,11,.1); color: #b45309; }
.dark .tp-soon { color: #fcd34d; }
.tp-soon span { flex: 1; } .tp-soon button { font-weight: 700; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
.tp-soon.is-off { background: var(--tint); color: var(--text-muted); }
/* Assignments: tasks closed automatically when their deadline passed */
.tp-soon.is-closed { background: rgba(244,63,94,.09); color: #be123c; } .dark .tp-soon.is-closed { color: #fda4af; }
.k-state.is-auto { color: #e11d48; background: rgba(244,63,94,.1); } .dark .k-state.is-auto { color: #fb7185; }

/* ---- Study Lab (progressive disclosure workspace) ---- */
.lab { position: relative; display: flex; height: 100%; overflow: hidden; }
.lab-side { width: 260px; flex-shrink: 0; display: flex; flex-direction: column; border-right: 1px solid var(--line); background: var(--surface); transition: margin-left .25s ease, opacity .2s; }
.lab.side-closed .lab-side { margin-left: -260px; opacity: 0; pointer-events: none; }
.lab-main { flex: 1; min-width: 0; display: flex; }
.lab-stage { flex: 1; min-width: 0; overflow-y: auto; transition: flex-basis .3s ease; }
.lab-source { width: 0; overflow: hidden; border-left: 1px solid var(--line); background: var(--surface-strong); transition: width .3s ease; display: flex; flex-direction: column; }
.lab.source-open .lab-source { width: 50%; }
.lab-drawer { position: absolute; top: 0; right: 0; bottom: 0; width: min(440px, 92%); transform: translateX(105%); transition: transform .28s cubic-bezier(.2,.8,.2,1); background: var(--surface-strong); -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); border-left: 1px solid var(--line); box-shadow: -24px 0 48px -32px rgba(15,23,42,.5); display: flex; flex-direction: column; z-index: 20; }
.lab.drawer-open .lab-drawer { transform: none; }
.lab-drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 14px 16px; border-bottom: 1px solid var(--line); font-size: 13px; }
.lab-drawer-body { flex: 1; overflow-y: auto; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.lab-drawer-foot { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--line); }
.lab-bar { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 6px; padding: 10px 18px; background: var(--surface); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border-bottom: 1px solid var(--line); }
.lab-act { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 11px; border-radius: 10px; font-size: 12px; font-weight: 600; color: inherit; opacity: .8; transition: background .15s, opacity .15s; white-space: nowrap; }
.lab-act:hover { background: var(--hover); opacity: 1; }
.lab-act.is-on { background: rgba(124,58,237,.12); color: #7c3aed; opacity: 1; }
.dark .lab-act.is-on { color: #c4b5fd; }
.lab-act.is-primary { background: linear-gradient(135deg,#7c3aed,#6366f1); color: #fff; opacity: 1; box-shadow: 0 8px 20px -10px rgba(124,58,237,.8); }
@media (max-width: 1100px) { .lab-act span { display: none; } }
.lab-doc-wrap { padding: 36px 32px 96px; }
.lab-doc, .lab-home, .lab-job { max-width: 800px; margin: 0 auto; }
.lab-doc { background: #FAFAFA; color: #1f2430; border-radius: 22px; padding: 48px 56px; box-shadow: 0 1px 0 rgba(255,255,255,.7) inset, 0 24px 60px -40px rgba(49,46,129,.45); border: 1px solid var(--line); }
.dark .lab-doc { background: #1B1B22; color: #e6e4f0; box-shadow: 0 24px 60px -36px rgba(0,0,0,.9); }
@media (max-width: 700px) { .lab-doc { padding: 28px 22px; } .lab-doc-wrap { padding: 20px 12px 80px; } }
.lab-doc-head h1 { font: 700 30px/1.2 Inter, system-ui, sans-serif; letter-spacing: -.02em; }
.lab-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; font-size: 11px; opacity: .6; }
.lab-meta span { display: inline-flex; align-items: center; gap: 5px; }
.lab-notice { display: flex; gap: 8px; margin-top: 14px; padding: 10px 12px; border-radius: 12px; font-size: 11px; line-height: 1.5; background: rgba(245,158,11,.1); color: #b45309; }
.dark .lab-notice { color: #fcd34d; }
.lab-toc { display: flex; flex-wrap: wrap; gap: 6px; margin: 22px 0 8px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.lab-toc a { font: 600 11px Inter, sans-serif; padding: 5px 10px; border-radius: 999px; background: rgba(124,58,237,.08); color: #6d28d9; }
.dark .lab-toc a { color: #c4b5fd; background: rgba(167,139,250,.12); }
.lab-md { font-family: Lora, Merriweather, Georgia, serif; font-size: 17px; line-height: 1.85; }
.lab-md h1, .lab-md h2, .lab-md h3, .lab-md h4 { font-family: Inter, system-ui, sans-serif; letter-spacing: -.01em; line-height: 1.3; scroll-margin-top: 70px; border-radius: 8px; transition: background .6s; }
.lab-md h1 { font-size: 23px; font-weight: 700; margin: 42px 0 12px; }
.lab-md h2 { font-size: 19px; font-weight: 700; margin: 30px 0 10px; }
.lab-md h3 { font-size: 16px; font-weight: 700; margin: 24px 0 8px; }
.lab-md p { margin: 0 0 16px; }
.lab-md ul, .lab-md ol { margin: 0 0 16px; padding-left: 1.4em; }
.lab-md ul { list-style: disc; } .lab-md ol { list-style: decimal; }
.lab-md li { margin: 6px 0; } .lab-md li::marker { color: #8b5cf6; }
.lab-md blockquote { margin: 0 0 16px; padding: 4px 0 4px 16px; border-left: 3px solid #8b5cf6; opacity: .9; font-style: italic; }
.lab-md code, .lab-code, .lab-math { font-family: 'JetBrains Mono', ui-monospace, Menlo, monospace; font-size: .82em; }
.lab-md code { padding: 2px 6px; border-radius: 6px; background: rgba(124,58,237,.08); }
.lab-code { display: block; margin: 0 0 18px; padding: 14px 16px; border-radius: 12px; background: #16161d; color: #e4e2f5; overflow-x: auto; line-height: 1.6; font-size: 13px; }
.lab-md hr { margin: 28px 0; border: 0; border-top: 1px solid var(--line); }
.lab-table { overflow-x: auto; margin: 0 0 18px; }
.lab-md table { width: 100%; border-collapse: collapse; font-family: Inter, sans-serif; font-size: 13px; line-height: 1.5; }
.lab-md th, .lab-md td { border: 1px solid var(--line-strong); padding: 7px 10px; text-align: left; vertical-align: top; }
.lab-md th { background: rgba(124,58,237,.06); }
.lab-term { font-weight: 700; background: linear-gradient(transparent 62%, rgba(139,92,246,.22) 62%); cursor: pointer; border-radius: 2px; }
.lab-term:hover { background: rgba(139,92,246,.22); }
.lab-cardcount { margin-left: 8px; font: 700 10px Inter, sans-serif; padding: 2px 7px; border-radius: 999px; background: rgba(245,158,11,.14); color: #b45309; vertical-align: middle; }
.lab-cardcount:empty { display: none; }
.lab-flash { animation: labFlash 1.6s ease; }
@keyframes labFlash { 0%, 30% { background: rgba(139,92,246,.25); box-shadow: 0 0 0 6px rgba(139,92,246,.25); } 100% { background: transparent; box-shadow: none; } }
.lab-src-bar { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--line); }
.lab-src-body { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.lab-src-page { position: relative; border-radius: 10px; background: #fff; box-shadow: 0 8px 24px -16px rgba(15,23,42,.5); min-height: 120px; }
.lab-src-page canvas { display: block; border-radius: 10px; }
.lab-src-page.is-text { padding: 20px 22px; color: #1f2430; font: 13px/1.7 Inter, sans-serif; }
.lab-src-page.is-text p { margin: 0 0 10px; }
.lab-src-pno { position: absolute; top: 8px; right: 10px; font: 600 10px Inter, sans-serif; color: #64748b; background: rgba(255,255,255,.9); padding: 2px 7px; border-radius: 999px; z-index: 1; }
mark.lab-hit { background: #fde047; border-radius: 3px; padding: 0 2px; }
.lab-home h2 { line-height: 1.15; }
.lab-dropzone { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 38px 20px; border-radius: 22px; border: 2px dashed rgba(139,92,246,.45); background: rgba(139,92,246,.05); transition: background .15s, border-color .15s; }
.lab-dropzone:hover, .lab-dropzone.is-over { background: rgba(139,92,246,.1); border-color: #8b5cf6; }
.lab-dropzone b { font-size: 15px; } .lab-dropzone > span:last-child { font-size: 11px; opacity: .6; }
.lab-drop-icon { width: 48px; height: 48px; border-radius: 16px; display: flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(135deg,#6366f1,#a855f7,#ec4899); box-shadow: 0 12px 28px -12px rgba(168,85,247,.9); margin-bottom: 6px; }
.lab-flow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
@media (max-width: 800px) { .lab-flow { grid-template-columns: repeat(2, 1fr); } }
.lab-flow-step { position: relative; padding: 14px; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); }
.lab-flow-step > span { width: 30px; height: 30px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: rgba(124,58,237,.1); color: #7c3aed; margin-bottom: 10px; }
.lab-flow-step b { display: block; font-size: 12px; } .lab-flow-step em { display: block; font-style: normal; font-size: 10px; opacity: .6; margin-top: 2px; }
.lab-flow-arrow { position: absolute; right: -9px; top: 50%; transform: translateY(-50%); font-style: normal; opacity: .35; z-index: 1; }
.lab-recent { display: flex; gap: 12px; padding: 12px 14px; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); font-size: 13px; transition: border-color .15s; }
.lab-recent:hover { border-color: #8b5cf6; }
.lab-steps { margin: 28px 0; display: flex; flex-direction: column; gap: 14px; }
.lab-steps li { display: flex; gap: 12px; align-items: flex-start; opacity: .45; }
.lab-steps li.is-done, .lab-steps li.is-active { opacity: 1; }
.lab-steps b { display: block; font-size: 13px; } .lab-steps em { display: block; font-style: normal; font-size: 11px; opacity: .65; }
.lab-step-dot { width: 26px; height: 26px; border-radius: 999px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font: 700 11px Inter, sans-serif; border: 2px solid var(--line-strong); }
.lab-steps .is-done .lab-step-dot { background: #10b981; border-color: #10b981; color: #fff; }
.lab-steps .is-active .lab-step-dot { border-color: #8b5cf6; color: #8b5cf6; animation: labPulse 1.4s ease infinite; }
@keyframes labPulse { 50% { box-shadow: 0 0 0 6px rgba(139,92,246,.18); } }
.lab-skel { display: flex; flex-direction: column; gap: 12px; padding: 26px; border-radius: 20px; border: 1px solid var(--line); background: var(--surface); }
.lab-skel i, .lab-card-skel i { display: block; height: 11px; border-radius: 6px; background: linear-gradient(90deg, rgba(139,92,246,.08), rgba(139,92,246,.22), rgba(139,92,246,.08)); background-size: 200% 100%; animation: labShimmer 1.3s linear infinite; }
.lab-card-skel { display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: 14px; border: 1px solid var(--line); margin-bottom: 10px; }
@keyframes labShimmer { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .lab-skel i, .lab-card-skel i, .lab-step-dot, .lab-flash { animation: none !important; } }
.lab-mini { padding: 12px; border-radius: 14px; border: 1px solid var(--line); background: var(--field); transition: opacity .15s; }
.lab-mini.is-off { opacity: .45; }
.lab-type { display: inline-flex; align-items: center; font: 800 9px Inter, sans-serif; letter-spacing: .08em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; color: var(--c); background: color-mix(in srgb, var(--c) 14%, transparent); white-space: nowrap; }
.lab-edit { width: 100%; resize: none; overflow: hidden; background: transparent; border: 1px solid transparent; border-radius: 8px; padding: 4px 6px; font-size: 12px; line-height: 1.5; color: inherit; outline: none; }
.lab-edit.is-front { font-weight: 600; }
.lab-edit:focus, .lab-edit:hover { border-color: var(--line-strong); background: var(--surface-strong); }
.lab-tags { width: 100%; margin-top: 6px; background: transparent; border: 0; font-size: 10px; color: #8b5cf6; outline: none; padding: 2px 6px; }
.lab-switch { position: relative; width: 32px; height: 18px; flex-shrink: 0; cursor: pointer; }
.lab-switch input { position: absolute; opacity: 0; }
.lab-switch i { position: absolute; inset: 0; border-radius: 999px; background: #cbd5e1; transition: background .15s; }
.lab-switch i::after { content: ''; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 999px; background: #fff; transition: transform .15s; box-shadow: 0 1px 3px rgba(0,0,0,.2); }
.lab-switch input:checked + i { background: #8b5cf6; } .lab-switch input:checked + i::after { transform: translateX(14px); }
.lab-switch input:focus-visible + i { outline: 2px solid #8b5cf6; outline-offset: 2px; }
.lab-msg { font-size: 12.5px; line-height: 1.65; padding: 10px 12px; border-radius: 14px; max-width: 92%; }
.lab-msg.user { align-self: flex-end; background: #7c3aed; color: #fff; }
.lab-msg.assistant { align-self: flex-start; background: var(--field); border: 1px solid var(--line); }
.lab-msg p { margin: 0 0 8px; } .lab-msg p:last-child { margin: 0; } .lab-msg ul, .lab-msg ol { padding-left: 1.2em; margin: 0 0 8px; } .lab-msg ul { list-style: disc; } .lab-msg ol { list-style: decimal; }
.lab-msg-by { display: block; margin-top: 6px; font-size: 9px; opacity: .5; }
/* immersive review */
.lab-review { position: fixed; inset: 0; z-index: 70; display: flex; flex-direction: column; color: #f1efff; background: radial-gradient(120% 90% at 20% 0%, rgba(99,102,241,.35), transparent 55%), radial-gradient(90% 80% at 100% 100%, rgba(168,85,247,.3), transparent 60%), #0b0a1c; animation: labFade .25s ease; }
@keyframes labFade { from { opacity: 0; } }
body.lab-reviewing { overflow: hidden; }
.lab-review.hidden, #tab-studylab.hidden { display: none !important; }
.lab-rv-top { display: flex; align-items: center; justify-content: space-between; padding: 18px 24px; }
.lab-rv-x { width: 36px; height: 36px; border-radius: 12px; background: rgba(255,255,255,.08); font-size: 14px; }
.lab-rv-x:hover, .lab-rv-link:hover { background: rgba(255,255,255,.16); }
.lab-rv-link { display: inline-flex; gap: 6px; align-items: center; height: 36px; padding: 0 12px; border-radius: 12px; background: rgba(255,255,255,.08); font-size: 12px; font-weight: 600; }
.lab-rv-progress { height: 3px; margin: 0 24px; border-radius: 3px; background: rgba(255,255,255,.1); overflow: hidden; }
.lab-rv-progress i { display: block; height: 100%; background: linear-gradient(90deg,#818cf8,#c084fc); transition: width .3s; }
.lab-rv-stage { flex: 1; display: flex; align-items: center; justify-content: center; padding: 24px; overflow-y: auto; }
.lab-rv-card { width: min(760px, 100%); min-height: 380px; padding: 48px 52px; border-radius: 28px; text-align: center; background: linear-gradient(160deg, rgba(255,255,255,.1), rgba(255,255,255,.03)); border: 1px solid rgba(255,255,255,.14); box-shadow: 0 40px 90px -40px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.12); cursor: pointer; display: flex; flex-direction: column; justify-content: center; }
.lab-rv-card.is-flipped, .lab-rv-card.is-done { cursor: default; }
.lab-rv-front { font: 600 24px/1.5 Inter, system-ui, sans-serif; letter-spacing: -.01em; }
.lab-rv-back { margin-top: 26px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.14); font: 17px/1.75 Lora, Georgia, serif; color: #dcd9f5; text-align: left; animation: labFade .25s ease; }
.lab-rv-back p { margin: 0 0 10px; }
.lab-rv-hint { margin-top: 30px; font-size: 12px; opacity: .5; }
.lab-review kbd { font: 700 10px 'JetBrains Mono', monospace; padding: 2px 6px; border-radius: 6px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); }
.cloze { display: inline-block; min-width: 3em; padding: 0 10px; border-radius: 8px; background: rgba(129,140,248,.25); color: #c7d2fe; }
.cloze.is-open { background: rgba(52,211,153,.2); color: #6ee7b7; }
.lab-rv-grades { display: grid; grid-template-columns: repeat(4, minmax(0, 150px)); justify-content: center; gap: 10px; padding: 0 24px 34px; transition: opacity .2s; }
.lab-rv-grades.is-hidden { opacity: 0; pointer-events: none; }
.lab-grade { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 12px 8px; border-radius: 16px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); transition: background .15s, transform .15s; }
.lab-grade:hover { background: color-mix(in srgb, var(--c) 30%, transparent); transform: translateY(-2px); }
.lab-grade b { font-size: 13px; color: var(--c); } .lab-grade span { font-size: 10px; opacity: .6; }
@media (max-width: 640px) { .lab-rv-card { padding: 30px 22px; min-height: 300px; } .lab-rv-front { font-size: 19px; } .lab-rv-grades { grid-template-columns: repeat(4, 1fr); } }
/* two answers: Repeat / Mastered */
.lab-rv-grades.is-two { grid-template-columns: repeat(2, minmax(0, 230px)); gap: 14px; }
.lab-rv-grades.is-two .lab-grade { padding: 16px 12px; gap: 4px; }
.lab-rv-grades.is-two .lab-grade b { font-size: 16px; } .lab-rv-grades.is-two .lab-grade span { font-size: 11px; }
@media (max-width: 640px) { .lab-rv-grades.is-two { grid-template-columns: repeat(2, 1fr); } }
/* brand */
.fs-logo { width: 40px; height: 40px; flex-shrink: 0; filter: drop-shadow(0 8px 16px rgba(139,92,246,.45)); }
.fs-word { font-weight: 800; letter-spacing: -.03em; background: linear-gradient(100deg, #4f46e5 0%, #8b5cf6 45%, #db2777 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dark .fs-word { background-image: linear-gradient(100deg, #a5b4fc 0%, #c4b5fd 45%, #f9a8d4 100%); }
/* ---- Study Lab v2: library tree, dock, callouts, recall checks, math ---- */
.lab-tree { margin-bottom: 4px; }
.lab-tree-subject { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 12px; font-size: 12px; cursor: pointer; }
.lab-tree-subject:hover { background: var(--hover); }
.lab-tree-emoji { width: 20px; text-align: center; font-size: 15px; line-height: 1; }
.lab-tree-kids { position: relative; margin-left: 19px; padding-left: 10px; border-left: 1px solid var(--line-strong); }
.lab-tree-item { position: relative; width: 100%; display: flex; align-items: center; gap: 7px; padding: 5px 8px; border-radius: 9px; font-size: 11.5px; text-align: left; color: inherit; opacity: .85; }
.lab-tree-item::before { content: ''; position: absolute; left: -10px; top: 50%; width: 8px; border-top: 1px solid var(--line-strong); }
.lab-tree-item:hover { background: var(--hover); opacity: 1; }
.lab-tree-item.is-active { background: rgba(124,58,237,.12); color: #6d28d9; opacity: 1; font-weight: 600; }
.dark .lab-tree-item.is-active { color: #c4b5fd; }
.lab-tree-ico { width: 16px; text-align: center; font-size: 12px; flex-shrink: 0; }
.lab-tree-badge { font: 700 9px Inter, sans-serif; padding: 1px 6px; border-radius: 999px; background: var(--tint); opacity: .8; }
.lab-tree-badge.is-due { background: rgba(245,158,11,.18); color: #b45309; opacity: 1; }
.dark .lab-tree-badge.is-due { color: #fcd34d; }
.lab-stage { position: relative; }
.lab-dock { position: sticky; bottom: 0; z-index: 6; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 auto; width: fit-content; max-width: calc(100% - 32px); padding: 8px; border-radius: 18px; transform: translateY(-18px);
  background: var(--surface-strong); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border: 1px solid var(--line); box-shadow: 0 18px 40px -22px rgba(49,46,129,.55); }
.lab-dock-btn { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 16px; border-radius: 12px; font-size: 12.5px; font-weight: 700; color: inherit; transition: background .15s, transform .15s; }
.lab-dock-btn:hover { background: var(--hover); transform: translateY(-1px); }
.lab-dock-btn.is-primary { color: #fff; background: linear-gradient(135deg,#7c3aed,#6366f1); box-shadow: 0 10px 22px -12px rgba(124,58,237,.9); }
.lab-dock-btn span { font-size: 14px; }
.lab-title { font: 800 30px/1.2 Inter, system-ui, sans-serif !important; letter-spacing: -.025em; margin: 0 0 8px !important; }
.lab-docmeta { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 4px; font: 600 11px Inter, sans-serif; }
.lab-docmeta span { padding: 4px 10px; border-radius: 999px; background: rgba(124,58,237,.08); color: #6d28d9; }
.dark .lab-docmeta span { background: rgba(167,139,250,.12); color: #c4b5fd; }
.lab-md h2 { font-size: 21px; font-weight: 800; margin: 44px 0 14px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.lab-callout { margin: 0 0 18px; padding: 14px 16px 4px; border-radius: 14px; border: 1px solid; font-size: 15.5px; }
.lab-callout-title { display: block; margin-bottom: 6px; font: 700 12.5px Inter, sans-serif; }
.lab-callout.is-insight { background: rgba(99,102,241,.07); border-color: rgba(99,102,241,.25); }
.lab-callout.is-insight .lab-callout-title { color: #4f46e5; }
.lab-callout.is-warning { background: rgba(245,158,11,.08); border-color: rgba(245,158,11,.3); }
.lab-callout.is-warning .lab-callout-title { color: #b45309; }
.lab-callout.is-example, .lab-callout.is-tip { background: rgba(16,185,129,.07); border-color: rgba(16,185,129,.25); }
.lab-callout.is-example .lab-callout-title, .lab-callout.is-tip .lab-callout-title { color: #047857; }
.lab-callout.is-definition, .lab-callout.is-note { background: rgba(14,165,233,.07); border-color: rgba(14,165,233,.25); }
.lab-callout.is-definition .lab-callout-title, .lab-callout.is-note .lab-callout-title { color: #0369a1; }
.dark .lab-callout .lab-callout-title { filter: brightness(1.6); }
.lab-math-block { margin: 6px 0 18px; padding: 14px 18px; border-radius: 14px; background: rgba(124,58,237,.05); overflow-x: auto; text-align: center; font-size: 1.05em; }
.lab-math { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .9em; }
.lab-math[data-done] { font-family: inherit; font-size: 1em; }
.lab-math math { font-size: 1.08em; }
.lab-recall { position: relative; margin: 0 0 14px; padding: 16px 18px; border-radius: 16px; cursor: pointer; border: 1px dashed rgba(139,92,246,.5); background: linear-gradient(135deg, rgba(139,92,246,.06), rgba(236,72,153,.04)); transition: border-color .15s, box-shadow .15s; }
.lab-recall:hover, .lab-recall:focus-visible { border-color: #8b5cf6; box-shadow: 0 10px 26px -18px rgba(139,92,246,.9); outline: none; }
.lab-recall-tag { display: block; font: 800 10px Inter, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #8b5cf6; margin-bottom: 4px; }
.lab-recall-q { display: block; font: 700 15px/1.5 Inter, sans-serif; }
.lab-recall-a { display: none; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); font-size: 15px; }
.lab-recall.is-open .lab-recall-a { display: block; }
.lab-recall-hint { display: block; margin-top: 6px; font: 11px Inter, sans-serif; opacity: .5; }
.lab-recall.is-open .lab-recall-hint { display: none; }
.lab-recall-actions { display: flex; gap: 6px; margin-top: 10px; }
.lab-recall-actions button, .lab-chipbtn { font: 700 10.5px Inter, sans-serif; padding: 5px 10px; border-radius: 999px; background: rgba(124,58,237,.1); color: #6d28d9; }
.dark .lab-recall-actions button, .dark .lab-chipbtn { color: #c4b5fd; background: rgba(167,139,250,.14); }
.lab-recall-actions button:disabled { opacity: .55; }
.lab-group { display: flex; justify-content: space-between; align-items: center; margin: 6px 2px -2px; font: 700 10.5px Inter, sans-serif; opacity: .75; }
.lab-group span { font-size: 10px; padding: 1px 7px; border-radius: 999px; background: var(--tint); }
.lab-table-sm table { font-size: 11px; }
.lab-table-sm th, .lab-table-sm td { padding: 5px 7px; }
.lab-mini .lab-table { max-height: 220px; overflow: auto; border-radius: 10px; }
.lab-mini .lab-table table { width: 100%; border-collapse: collapse; }
.lab-mini .lab-table th, .lab-mini .lab-table td { border: 1px solid var(--line-strong); text-align: left; vertical-align: top; }
.lab-mini .lab-table th { position: sticky; top: 0; background: var(--surface-strong); }
/* ---- Bullet-journal notes: dot-grid paper, framed handwritten headings, Stabilo-blue accents ---- */
.lab-doc.bj { background-color: var(--paper) !important; color: var(--text-main); border: 1px solid var(--border-color); border-radius: 14px;
  background-image: radial-gradient(circle, rgba(120,113,108,.30) 1px, transparent 1.4px); background-size: 22px 22px; background-position: 11px 11px;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 20px 44px -34px rgba(44,42,41,.5); }
.dark .lab-doc.bj { background-image: linear-gradient(to bottom, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 100% 28px; background-position: 0 14px; box-shadow: 0 20px 44px -30px rgba(0,0,0,.8); }
.bj .lab-md { font-family: Inter, system-ui, sans-serif; font-size: 15.5px; line-height: 1.75; }
.bj .lab-title, .bj .lab-doc-head > h1 { display: inline; font-family: Caveat, 'Segoe Print', cursive !important; font-weight: 700 !important; font-size: 44px !important; line-height: 1.15 !important; letter-spacing: 0 !important; color: var(--ink);
  background: linear-gradient(transparent 60%, var(--stabilo) 60%, var(--stabilo) 90%, transparent 90%); padding: 0 6px; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.bj .lab-doc-head { margin-bottom: 6px; } .bj .lab-doc-head .lab-docmeta { margin-top: 12px; }
.bj .lab-docmeta span, .bj .lab-toc a { font-family: 'JetBrains Mono', monospace; font-weight: 500; font-size: 10.5px; background: transparent; color: var(--ink); border: 1px solid var(--ink-soft); }
.bj .lab-toc { border-bottom: 1px dashed var(--line-strong); }
.bj .lab-md h2 { border: 0; margin: 42px 0 16px; padding: 0; line-height: 1; }
.bj-frame { display: inline-block; font-family: Caveat, 'Segoe Print', cursive; font-weight: 700; font-size: 30px; line-height: 1.1; color: var(--ink); padding: 5px 18px 7px;
  border: 2px solid var(--ink); border-radius: 255px 15px 225px 15px / 15px 225px 15px 255px; background: var(--paper); box-shadow: 3px 3px 0 var(--ink-soft); transform: rotate(-.6deg); }
.bj .lab-md h2:nth-of-type(even) .bj-frame { transform: rotate(.5deg); border-radius: 15px 225px 15px 255px / 255px 15px 225px 15px; }
.bj .lab-md h3 { font-family: Caveat, 'Segoe Print', cursive; font-size: 25px; font-weight: 700; color: var(--ink); margin: 26px 0 8px; }
.bj .lab-md h3 { background: linear-gradient(transparent 62%, var(--stabilo) 62%); display: inline-block; padding: 0 4px; }
.bj .lab-md p { margin: 0 0 12px; }
.bj .lab-md ul { list-style: none; padding-left: 2px; margin: 0 0 14px; }
.bj .lab-md ul > li { position: relative; padding-left: 24px; margin: 7px 0; }
.bj .lab-md ul > li::before { content: ''; position: absolute; left: 5px; top: .62em; width: 8px; height: 8px; border-radius: 2px; transform: rotate(45deg); background: #60A5FA; box-shadow: 0 0 0 2px rgba(96,165,250,.25); }
.bj .lab-md ul ul > li::before { background: transparent; border: 1.5px solid #60A5FA; box-shadow: none; width: 7px; height: 7px; }
.bj .lab-md ol { padding-left: 1.6em; } .bj .lab-md ol > li::marker { color: var(--ink); font: 600 13px 'JetBrains Mono', monospace; }
.bj .lab-md strong { font-weight: 700; background: linear-gradient(transparent 60%, var(--stabilo) 60%); padding: 0 1px; }
.bj .lab-term { background: linear-gradient(transparent 60%, var(--stabilo) 60%); }
.bj .lab-term:hover { background: var(--stabilo); }
.bj-tag { display: inline-flex; align-items: center; padding: 0 9px; margin: 0 1px; border-radius: 999px; font: 600 12.5px/1.65 Inter, sans-serif; color: var(--ink);
  background: rgba(96,165,250,.13) !important; border: 1px solid rgba(96,165,250,.45); vertical-align: 1px; cursor: pointer; white-space: nowrap; }
.bj-tag:hover { background: rgba(96,165,250,.25) !important; }
.bj .lab-md table { font-family: Inter, sans-serif; border-collapse: separate; border-spacing: 0; border: 1.5px solid var(--ink); border-radius: 10px; overflow: hidden; }
.bj .lab-md th { background: rgba(96,165,250,.14); color: var(--ink); font-weight: 700; font-size: 12px; }
.bj .lab-md th, .bj .lab-md td { border: 0; border-bottom: 1px dashed var(--line-strong); border-right: 1px dashed var(--line-strong); }
.bj .lab-md tr > :last-child { border-right: 0; } .bj .lab-md tbody tr:last-child td { border-bottom: 0; }
.bj .lab-callout { border-style: dashed; border-width: 1.5px; border-radius: 4px 14px 4px 14px; font-size: 14.5px; transform: rotate(-.25deg); }
.bj .lab-callout.is-warning { background: var(--postit); }
.bj .lab-callout-title { font-family: Caveat, cursive; font-size: 21px; }
.bj .lab-recall { border-color: var(--ink); border-style: dashed; background: rgba(96,165,250,.05); border-radius: 12px; }
.bj .lab-recall-tag { font-family: Caveat, cursive; font-size: 17px; letter-spacing: 0; text-transform: none; color: var(--ink); }
.bj .lab-md blockquote { border-left-color: var(--ink); }
.bj .lab-math-block { background: rgba(96,165,250,.07); border: 1px dashed var(--ink-soft); }
.bj .lab-cardcount { font-family: 'JetBrains Mono', monospace; vertical-align: 6px; }

/* ---- Dashboard (simple, planner style) ---- */
.dash-act { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 10px; font-size: 12px; font-weight: 600; border: 1px solid var(--border-color); background: var(--bg-card); transition: border-color .15s, background .15s; }
.dash-act:hover { border-color: rgba(99,102,241,.45); }
.dash-act.is-primary { background: #4f46e5; border-color: #4f46e5; color: #fff; } .dash-act.is-primary:hover { background: #6366f1; }
.dash-strip { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border-radius: 12px; overflow: hidden; }
.dash-cell { padding: 16px 18px; min-width: 0; text-align: left; display: block; width: 100%; transition: background .15s; }
button.dash-cell:hover { background: var(--hover); }
.dash-cell + .dash-cell { border-left: 1px solid var(--border-color); }
@media (max-width: 900px) { .dash-strip { grid-template-columns: repeat(2, minmax(0,1fr)); } .dash-cell:nth-child(3) { border-left: 0; } .dash-cell:nth-child(n+3) { border-top: 1px solid var(--border-color); } }
.dash-k { display: flex; align-items: center; gap: 6px; font: 600 10px 'JetBrains Mono', monospace; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); }
.dash-v { font: 700 24px/1.15 'JetBrains Mono', monospace; margin-top: 8px; }
.dash-t { font-size: 13px; font-weight: 600; margin-top: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-s { font-size: 11px; color: var(--text-muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-cell.is-amber .dash-k, .dash-cell.is-amber .dash-v { color: #d97706; } .dark .dash-cell.is-amber .dash-k, .dark .dash-cell.is-amber .dash-v { color: #fbbf24; }
.dash-cell.is-rose .dash-k, .dash-cell.is-rose .dash-v { color: #e11d48; } .dark .dash-cell.is-rose .dash-k, .dark .dash-cell.is-rose .dash-v { color: #fb7185; }
.dash-cell.is-indigo .dash-k, .dash-cell.is-indigo .dash-v { color: #4f46e5; } .dark .dash-cell.is-indigo .dash-k, .dark .dash-cell.is-indigo .dash-v { color: #818cf8; }
.dash-row { display: flex; align-items: center; gap: 12px; width: 100%; padding: 9px 10px; border-radius: 10px; text-align: left; transition: background .15s; }
.dash-row:hover { background: var(--hover); }
.dash-row.is-past { opacity: .5; }
.dash-time { width: 96px; flex-shrink: 0; font: 12px 'JetBrains Mono', monospace; color: var(--text-muted); }
.dash-bar { width: 4px; align-self: stretch; min-height: 30px; border-radius: 4px; background: var(--c); flex-shrink: 0; }
.dash-row b { display: block; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-row small { display: block; font-size: 11px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-pill { flex-shrink: 0; font: 600 10px 'JetBrains Mono', monospace; padding: 2px 8px; border-radius: 6px; }
.dash-pill.is-now { color: #fff; background: #f43f5e; } .dash-pill.is-done { color: #059669; background: rgba(16,185,129,.12); }
.dash-now { display: flex; align-items: center; gap: 8px; margin: 2px 10px; font: 600 10px 'JetBrains Mono', monospace; color: #f43f5e; }
.dash-now::after { content: ''; flex: 1; border-top: 2px solid #f43f5e; }
.dash-week { display: flex; align-items: flex-end; gap: 5px; }
.dash-week span { display: flex; flex-direction: column; align-items: center; gap: 3px; font: 9px 'JetBrains Mono', monospace; color: var(--text-muted); }
.dash-week i { display: block; width: 12px; border-radius: 3px; background: var(--line-strong); min-height: 2px; }
.dash-week .is-today i { background: #6366f1; } .dash-week .is-today { color: #6366f1; font-weight: 700; }
.dash-link { font-size: 11px; font-weight: 600; color: #6366f1; } .dash-link:hover { text-decoration: underline; }
.dash-empty { padding: 18px; border-radius: 10px; border: 1px dashed var(--border-color); font-size: 12px; color: var(--text-muted); text-align: center; }
.dash-empty .font-hand { display: block; font-size: 22px; color: var(--ink); margin-bottom: 2px; }
.dash-tile { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 10px; border: 1px solid var(--border-color); text-align: left; min-width: 0; transition: border-color .15s, transform .15s; }
.dash-tile:hover { border-color: rgba(99,102,241,.45); transform: translateY(-1px); }
.dash-tile .dash-ico { width: 36px; height: 36px; border-radius: 9px; display: flex; align-items: center; justify-content: center; font-size: 17px; background: var(--tint); flex-shrink: 0; }
.dash-tile b { display: block; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-tile small { display: block; font-size: 10.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* ---- Phones: the sidebar becomes a slide-in drawer (☰ in the header) ---- */
#nav-scrim { display: none; }
@media (max-width: 767px) {
  #sidebar { position: fixed !important; top: 0; bottom: 0; left: 0; z-index: 60; width: 16rem !important; transform: translateX(-105%); transition: transform .25s ease; box-shadow: 0 0 40px rgba(0,0,0,.25); }
  body.nav-open #sidebar { transform: none; }
  body.nav-open #nav-scrim { display: block; position: fixed; inset: 0; z-index: 55; background: rgba(15,23,42,.38); }
  .app-header { padding-left: 14px !important; padding-right: 14px !important; }
  #view-container.p-6 { padding: 16px !important; }
  .dash-act { flex: 1 1 auto; justify-content: center; }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) { #sidebar { transition: none; } }

/* destructive icon buttons */
.ne-btn.is-danger:hover { color: #e11d48; background: rgba(244,63,94,.1); }

/* ---- Plan My Day ---- */
.pd-modal { overflow: hidden; }
.pd-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 20px 24px 14px; border-bottom: 1px solid var(--line); }
.pd-body { flex: 1; overflow-y: auto; padding: 16px 24px 20px; }
.pd-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 14px 24px; border-top: 1px solid var(--line); }
.pd-step { padding: 14px 0; border-bottom: 1px dashed var(--line); } .pd-step:last-child { border-bottom: 0; }
.pd-step-head { display: flex; align-items: center; gap: 10px; font-size: 13px; margin-bottom: 10px; }
.pd-num { width: 22px; height: 22px; flex-shrink: 0; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font: 700 11px Inter, sans-serif; border: 1.5px solid var(--line-strong); color: var(--text-muted); }
.pd-num.is-done { background: #7c3aed; border-color: #7c3aed; color: #fff; }
.pd-step-body { padding-left: 32px; }
.pd-hint { font-size: 11px; color: var(--text-muted); margin-top: 8px; line-height: 1.5; }
.pd-fixed { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 8px; font-size: 11px; background: var(--tint); border: 1px solid var(--border-color); }
.pd-fixed b { font: 600 10.5px 'JetBrains Mono', monospace; }
.pd-profiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.pd-breaks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 720px) { .pd-profiles, .pd-breaks { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pd-step-body { padding-left: 0; } }
.pd-card { display: flex; flex-direction: column; gap: 2px; text-align: left; padding: 10px 11px; border-radius: 12px; border: 1.5px solid var(--border-color); background: var(--bg-card); transition: border-color .15s, background .15s; }
.pd-card:hover { border-color: rgba(124,58,237,.45); }
.pd-card.is-active { border-color: #7c3aed; background: rgba(124,58,237,.07); }
.pd-card b { font-size: 12.5px; } .pd-time { font: 600 10.5px 'JetBrains Mono', monospace; color: #7c3aed; } .dark .pd-time { color: #c4b5fd; }
.pd-card em { font-style: normal; font-size: 10px; color: var(--text-muted); line-height: 1.35; margin-top: 2px; }
.pd-matrix { display: grid; grid-template-columns: repeat(24, minmax(0, 1fr)); gap: 2px; margin-top: 10px; touch-action: none; user-select: none; }
.pd-hour { height: 34px; border-radius: 5px; background: var(--tint); border: 1px solid var(--border-color); font: 600 8.5px 'JetBrains Mono', monospace; color: var(--text-muted); display: flex; align-items: flex-end; justify-content: center; padding-bottom: 2px; }
.pd-hour.is-on { background: #7c3aed; border-color: #7c3aed; color: #ede9fe; }
.pd-task { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 12px; border: 1px solid var(--border-color); background: var(--bg-card); }
.pd-task.is-off { opacity: .55; }
.pd-check { position: relative; width: 18px; height: 18px; flex-shrink: 0; cursor: pointer; }
.pd-check input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.pd-check span { position: absolute; inset: 0; border-radius: 6px; border: 1.5px solid var(--line-strong); background: var(--field); }
.pd-check input:checked + span { background: #7c3aed; border-color: #7c3aed; }
.pd-check input:checked + span::after { content: ''; position: absolute; left: 5px; top: 1.5px; width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.pd-check input:focus-visible + span { outline: 2px solid #7c3aed; outline-offset: 2px; }
.pd-mins { display: flex; align-items: center; gap: 3px; font-size: 10px; color: var(--text-muted); }
.pd-mins input { width: 54px; height: 28px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--field); text-align: center; font: 600 11px 'JetBrains Mono', monospace; color: inherit; }
.pd-sel { height: 28px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--field); font-size: 10.5px; padding: 0 4px; color: inherit; max-width: 128px; }
@media (max-width: 720px) { .pd-task { flex-wrap: wrap; } .pd-task > .min-w-0 { flex-basis: calc(100% - 30px); } }
.pd-add { display: flex; align-items: center; gap: 6px; margin-top: 8px; }
.pd-add input { height: 32px; border-radius: 9px; border: 1px dashed var(--line-strong); background: transparent; padding: 0 10px; font-size: 11.5px; color: inherit; }
.pd-add input:first-child { flex: 1; min-width: 0; } .pd-add input[type=number] { width: 58px; text-align: center; }
.pd-badge { display: inline-flex; align-items: center; gap: 4px; font: 600 10px Inter, sans-serif; padding: 3px 9px; border-radius: 999px; background: var(--tint); color: var(--text-muted); white-space: nowrap; }
.pd-badge.is-ai { background: rgba(124,58,237,.1); color: #6d28d9; } .dark .pd-badge.is-ai { color: #c4b5fd; }
.pd-controls { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.pd-controls button { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 10px; font-size: 11.5px; font-weight: 600; border: 1px solid var(--border-color); background: var(--bg-card); }
.pd-controls button:hover { border-color: rgba(124,58,237,.45); }
.pd-controls button.is-on { border-color: rgba(16,185,129,.5); color: #059669; } .dark .pd-controls button.is-on { color: #34d399; }
.pd-inline { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -2px 0 12px; padding: 8px 10px; border-radius: 12px; background: rgba(124,58,237,.06); font-size: 11.5px; }
.pd-inline span { font-weight: 600; margin-right: 2px; }
.pd-inline button { height: 28px; padding: 0 10px; border-radius: 8px; background: #7c3aed; color: #fff; font-size: 11px; font-weight: 700; }
.pd-inline button.is-ghost { background: transparent; color: var(--text-muted); }
.pd-inline input { height: 28px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--field); padding: 0 6px; font: 600 11px 'JetBrains Mono', monospace; color: inherit; }
.pd-alert { margin-bottom: 12px; padding: 12px 14px; border-radius: 14px; border: 1px solid rgba(244,63,94,.3); background: rgba(244,63,94,.06); font-size: 12px; }
.pd-alert > b { color: #be123c; } .dark .pd-alert > b { color: #fda4af; }
.pd-alert p { margin-top: 6px; font-size: 10.5px; color: var(--text-muted); }
.pd-alert-row { display: flex; align-items: center; gap: 8px; margin-top: 7px; }
.pd-alert-row em { font-style: normal; font-size: 10.5px; color: var(--text-muted); margin-left: 4px; }
.pd-alert-row button { flex-shrink: 0; font-size: 10.5px; font-weight: 700; padding: 4px 10px; border-radius: 8px; background: var(--bg-card); border: 1px solid var(--border-color); }
.pd-timeline { display: flex; flex-direction: column; gap: 5px; }
.pd-row { display: flex; align-items: stretch; gap: 10px; padding: 7px 10px; border-radius: 12px; border: 1px solid var(--border-color); background: var(--bg-card); }
.pd-row.is-past { opacity: .5; }
.pd-t { width: 46px; flex-shrink: 0; font: 600 11px/1.35 'JetBrains Mono', monospace; }
.pd-t em { font-style: normal; font-weight: 400; color: var(--text-muted); }
.pd-bar { width: 4px; flex-shrink: 0; border-radius: 4px; background: var(--c, #7c3aed); }
.pd-cell { flex: 1; min-width: 0; } .pd-cell b { display: block; font-size: 12.5px; } .pd-cell small { display: block; font-size: 10.5px; color: var(--text-muted); margin-top: 1px; }
.pd-step1 { color: #6d28d9 !important; } .dark .pd-step1 { color: #c4b5fd !important; }
.pd-row.is-fixed { --c: #64748b; background: repeating-linear-gradient(135deg, transparent 0 7px, var(--tint) 7px 14px); }
.pd-row.is-study { --c: #7c3aed; } .pd-row.pd-cx-high { --c: #e11d48; } .pd-row.pd-cx-medium { --c: #f59e0b; } .pd-row.pd-cx-low { --c: #10b981; }
.pd-row.is-study .pd-check { align-self: center; }
.pd-row.is-done .pd-cell b { text-decoration: line-through; opacity: .6; }
.pd-row.is-break { --c: #10b981; border-style: dashed; background: rgba(16,185,129,.04); padding-top: 5px; padding-bottom: 5px; }
.pd-row.is-break.is-long { background: rgba(16,185,129,.09); }
.pd-row.is-break .pd-cell b { font-size: 11.5px; color: #047857; } .dark .pd-row.is-break .pd-cell b { color: #6ee7b7; }
.pd-now { display: flex; align-items: center; gap: 8px; margin: 2px 0; font: 600 10px 'JetBrains Mono', monospace; color: #f43f5e; }
.pd-now::after { content: ''; flex: 1; border-top: 2px solid #f43f5e; }
.pd-guard { display: flex; gap: 8px; margin-top: 12px; padding: 10px 12px; border-radius: 12px; font-size: 11px; line-height: 1.5; background: rgba(99,102,241,.06); color: var(--text-muted); }

/* ---- Sketchnote study notes: banner headers, highlighters, callouts, bubbles, flow diagrams ---- */
.bj .lab-md h2 .bj-frame, .bj .lab-md h2:nth-of-type(even) .bj-frame {
  display: block; transform: none; border: 0; border-radius: 0; box-shadow: none; padding: 7px 34px 9px; font-size: 28px; color: #14532d;
  background: linear-gradient(180deg, #bbf7d0, #86efac); clip-path: polygon(0 0, 100% 0, 97.5% 50%, 100% 100%, 0 100%, 2.5% 50%); }
.dark .bj .lab-md h2 .bj-frame { color: #dcfce7; background: linear-gradient(180deg, rgba(34,197,94,.34), rgba(22,163,74,.26)); }
mark.bj-hl { color: inherit; padding: 0 2px; border-radius: 2px; background: linear-gradient(transparent 18%, rgba(253,224,71,.8) 18%, rgba(253,224,71,.8) 88%, transparent 88%); }
.dark mark.bj-hl { background: linear-gradient(transparent 18%, rgba(250,204,21,.34) 18%, rgba(250,204,21,.34) 88%, transparent 88%); }
.bj-tag { border: 0 !important; border-radius: 3px; padding: 0 3px; font-weight: 700; background: linear-gradient(transparent 45%, rgba(134,239,172,.75) 45%) !important; }
.bj-tag:hover { background: rgba(134,239,172,.75) !important; }
.dark .bj-tag { background: linear-gradient(transparent 45%, rgba(74,222,128,.32) 45%) !important; }
.bj .lab-md ul > li.is-star::before { content: '★'; background: none; box-shadow: none; border: 0; transform: none; width: auto; height: auto; top: -.05em; left: 1px; color: #f59e0b; font-size: 16px; }
.bj .lab-md ul > li.is-star { font-weight: 600; }
.lab-callout-kind { display: block; margin: -4px 0 6px; font: 700 9.5px Inter, sans-serif; letter-spacing: .08em; text-transform: uppercase; opacity: .6; }
.lab-callout.is-key { background: rgba(124,58,237,.07); border-color: rgba(124,58,237,.35); border-radius: 18px; border-width: 2px; }
.lab-callout.is-key .lab-callout-title { color: #6d28d9; }
.lab-callout.is-exam { background: rgba(37,99,235,.07); border-color: rgba(37,99,235,.3); }
.lab-callout.is-exam .lab-callout-title { color: #1d4ed8; }
.lab-callout.is-mistake { background: rgba(244,63,94,.06); border-color: rgba(244,63,94,.3); }
.lab-callout.is-mistake .lab-callout-title { color: #be123c; }
.lab-callout.is-remember { background: var(--postit); border-color: rgba(245,158,11,.4); }
.lab-callout.is-remember .lab-callout-title { color: #b45309; }
.lab-callout.is-deepdive { background: var(--tint); border-color: var(--line-strong); }
.lab-callout.is-deepdive .lab-callout-title { color: var(--text-muted); }
.bj-bubble { position: relative; max-width: 78%; margin: 6px 0 28px 18px; padding: 12px 20px; border: 2px solid var(--ink); border-radius: 50% / 44%; background: var(--paper); font: 600 20px/1.35 Caveat, 'Segoe Print', cursive; color: var(--ink); text-align: center; }
.bj-bubble p { margin: 0 !important; }
.bj-bubble::before, .bj-bubble::after { content: ''; position: absolute; border: 2px solid var(--ink); border-radius: 999px; background: var(--paper); }
.bj-bubble::before { width: 13px; height: 13px; left: 16%; bottom: -17px; }
.bj-bubble::after { width: 8px; height: 8px; left: 11%; bottom: -27px; }
.bj-flow { margin: 4px 0 20px; padding: 14px 16px; border-radius: 14px; border: 1.5px dashed var(--ink-soft); background: rgba(96,165,250,.05); }
.bj-flow figcaption { font: 700 20px Caveat, 'Segoe Print', cursive; color: var(--ink); margin-bottom: 8px; }
.bj-flow-steps { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 4px; }
.bj-node { display: inline-block; padding: 7px 12px; border: 2px solid var(--ink); border-radius: 12px 4px 12px 4px; background: var(--paper); font: 600 13px/1.35 Inter, sans-serif; box-shadow: 2px 2px 0 var(--ink-soft); }
.bj-flow-steps > i { font-style: normal; font-size: 20px; font-weight: 700; color: var(--ink); padding: 0 2px; }

/* =====================================================================
   PHONE LAYOUT (below 768px)
   A native-app feel: a floating tab bar with a glowing Study Lab button,
   a slim header, a gradient welcome card, swipeable card rows,
   and pop-ups that slide up from the bottom as sheets.
   ===================================================================== */
.mdock, .m-avatar { display: none; }
@keyframes fsSheetUp { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes fsDockIn { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes fsDockOut { to { transform: translateY(140%); opacity: 0; } }
@keyframes fsOrb { 0%, 100% { box-shadow: 0 10px 24px -8px rgba(124,58,237,.75), 0 0 0 0 rgba(168,85,247,.35); } 50% { box-shadow: 0 12px 28px -8px rgba(219,39,119,.7), 0 0 0 7px rgba(168,85,247,0); } }

@media (max-width: 767px) {
  html, body { height: 100%; }
  body { height: 100dvh; overscroll-behavior-y: none; -webkit-tap-highlight-color: transparent; }

  /* ---- slim header ---- */
  .app-header { height: auto !important; min-height: 56px; padding-top: env(safe-area-inset-top) !important; }
  .app-header button[onclick="toggleSidebar()"]:not(.m-avatar) { display: none; }
  .app-header #current-view-title { font-size: 17px; letter-spacing: -.02em; }
  .app-header .utility-pill { padding: 5px 10px !important; border-radius: 999px !important; }
  .app-header .utility-pill #topbar-time { font-size: 13px; }
  .app-header #topbar-status { display: none; }
  .app-header > div:last-child { gap: 6px !important; }
  .m-avatar { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 999px; font-size: 20px; background: linear-gradient(135deg, #eef2ff, #fae8ff); border: 1px solid rgba(99,102,241,.25); }
  .dark .m-avatar { background: linear-gradient(135deg, rgba(99,102,241,.25), rgba(217,70,239,.18)); }

  /* room for the tab bar */
  #view-container { padding-bottom: calc(104px + env(safe-area-inset-bottom)) !important; scroll-behavior: smooth; }
  #view-container.overflow-hidden { padding-bottom: 0 !important; }

  /* ---- floating tab bar ---- */
  .mdock { display: flex; position: fixed; left: 12px; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 45; height: 64px; padding: 0 6px; align-items: stretch; border-radius: 24px;
    background: rgba(255,255,255,.82); border: 1px solid rgba(15,23,42,.08); box-shadow: 0 18px 40px -18px rgba(30,27,75,.45), 0 2px 6px rgba(15,23,42,.06);
    -webkit-backdrop-filter: blur(18px) saturate(1.6); backdrop-filter: blur(18px) saturate(1.6); animation: fsDockIn .45s cubic-bezier(.2,.9,.3,1) both; }
  .dark .mdock { background: rgba(22,24,33,.8); border-color: rgba(255,255,255,.08); box-shadow: 0 18px 40px -16px rgba(0,0,0,.8); }
  .mdock-btn { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; color: #64748b; font: 600 10px/1 Inter, system-ui, sans-serif; letter-spacing: .01em; position: relative; transition: color .2s; }
  .dark .mdock-btn { color: #8b93a7; }
  .mdock-btn svg { width: 21px; height: 21px; stroke-width: 1.9; transition: transform .25s cubic-bezier(.2,.9,.3,1.4); }
  .mdock-btn::before { content: ''; position: absolute; top: 9px; width: 44px; height: 30px; border-radius: 12px; background: rgba(99,102,241,.12); transform: scale(.4); opacity: 0; transition: transform .25s cubic-bezier(.2,.9,.3,1.3), opacity .2s; z-index: -1; }
  .mdock-btn.is-active { color: #4f46e5; }
  .dark .mdock-btn.is-active { color: #a5b4fc; }
  .mdock-btn.is-active::before { transform: none; opacity: 1; }
  .mdock-btn.is-active svg { transform: translateY(-1px) scale(1.06); }
  .mdock-btn:active svg { transform: scale(.88); }
  .mdock-btn.is-lab::before { display: none; }
  .mdock-orb { width: 50px; height: 50px; margin-top: -26px; margin-bottom: 1px; border-radius: 18px; display: flex; align-items: center; justify-content: center; color: #fff; border: 3px solid #f8f7f4;
    background: linear-gradient(135deg, #4f46e5 0%, #8b5cf6 55%, #ec4899 100%); animation: fsOrb 3.2s ease-in-out infinite; transition: transform .25s cubic-bezier(.2,.9,.3,1.4), border-radius .25s; }
  .dark .mdock-orb { border-color: #0f1117; }
  .mdock-orb svg { width: 22px; height: 22px; }
  .mdock-btn.is-lab.is-active .mdock-orb { transform: translateY(-2px) rotate(-6deg); border-radius: 50%; }
  .mdock-btn.is-lab:active .mdock-orb { transform: scale(.9); }
  body.nav-open .mdock, body.lab-reviewing .mdock, body.fs-noteedit .mdock { animation: fsDockOut .25s ease both; pointer-events: none; }

  .app-header .utility-pill { min-width: 0 !important; }
  .dash-row { gap: 10px; padding: 9px 6px; }
  .dash-time { flex-shrink: 0; font-size: 11px !important; min-width: 0 !important; width: auto !important; }
  #dash-today .dash-pill.is-done { display: none; }   /* faded rows already say "done"; keeps the "now" pill */

  .planner-card { border-radius: 20px !important; }

  /* ---- Schedule: compact toolbar + swipeable summary cards ---- */
  #tab-timetable > div:first-child { gap: 8px !important; }
  #tab-timetable > div:first-child > div { width: 100%; }
  #tab-timetable > div:first-child > div:first-child { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; }
  #tab-timetable > div:first-child > div:first-child > .seg { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; }
  #tab-timetable .tt-navbox { min-width: 0; justify-content: space-between; }
  #tab-timetable .tt-navbox > div { min-width: 0 !important; flex: 1; }
  #tab-timetable .tt-navbox > div > * { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #tab-timetable .seg [data-ttview="week"] { display: none; }
  #tab-timetable > div:first-child > div:last-child { display: grid !important; grid-template-columns: auto auto auto minmax(0, 1fr); }
  #tab-timetable .dash-act[title^="Download"], #tab-timetable .dash-act[title^="Add your timetable"] { font-size: 0; gap: 0; }
  #tab-timetable .dash-act.is-primary { justify-content: center; }
  .tt-summary { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px !important; margin: 0 -16px; padding: 2px 16px 6px; scroll-padding-inline: 16px; scrollbar-width: none; }
  .tt-summary::-webkit-scrollbar, .k-telemetry::-webkit-scrollbar, .k-board::-webkit-scrollbar, #notes-format-filter::-webkit-scrollbar { display: none; }
  .tt-summary > * { flex: 0 0 74%; scroll-snap-align: start; min-height: 0 !important; }

  /* ---- Tasks: counter chips + swipeable columns ---- */
  #tab-kanban > div:first-child > div { width: 100%; justify-content: space-between; }
  .k-telemetry { display: flex !important; overflow-x: auto; gap: 8px; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; margin: 0 -16px; padding: 0 16px 2px !important; scrollbar-width: none; }
  .k-telemetry > div { flex: 0 0 auto; min-width: 100px; padding: 10px 14px !important; border: 1px solid var(--border-color) !important; border-radius: 16px; background: var(--bg-card); }
  .k-board { gap: 12px !important; margin: 0 -16px; padding: 0 16px 8px !important; scroll-snap-type: x mandatory; scroll-padding-inline: 16px; scrollbar-width: none; }
  .k-telemetry { scroll-padding-inline: 16px; }
  #tab-kanban > div:first-child > div { flex-wrap: nowrap !important; }
  #tab-kanban button[onclick="openAddAssignmentModal()"] { width: 40px; height: 40px; padding: 0 !important; justify-content: center; border-radius: 14px; flex-shrink: 0; }
  #tab-kanban button[onclick="openAddAssignmentModal()"] span { display: none; }
  #tab-kanban button[onclick="openAddAssignmentModal()"] svg { width: 18px !important; height: 18px !important; }
  .k-col { flex: 0 0 86% !important; min-width: 0 !important; scroll-snap-align: center; }
  .k-board { align-items: flex-start; }
  .notebook-column { min-height: 150px; }

  /* ---- Notes: one-line filters ---- */
  #notes-format-filter { flex-wrap: nowrap !important; overflow-x: auto; max-width: 100%; scrollbar-width: none; }
  #notes-format-filter .ne-chip { flex-shrink: 0; }
  #notes-grid { gap: 14px 12px !important; }

  /* ---- Study Lab: readable note on a small screen ---- */
  .lab-side { position: absolute; top: 0; bottom: 0; left: 0; z-index: 30; width: min(84%, 320px); box-shadow: 0 0 60px rgba(15,23,42,.3); }
  .lab.side-closed .lab-side { margin-left: calc(-1 * min(84%, 320px)); }
  .lab-stage { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
  .lab-dock { position: fixed; left: 50%; bottom: calc(84px + env(safe-area-inset-bottom)); z-index: 40; margin: 0; transform: translateX(-50%) !important; flex-wrap: nowrap; max-width: calc(100% - 40px); padding: 5px; border-radius: 16px; }
  .lab-dock-btn { height: 36px; padding: 0 12px; font-size: 12px; white-space: nowrap; }
  body.nav-open .lab-dock, body.lab-reviewing .lab-dock { display: none; }
  .lab-doc { padding: 26px 18px !important; border-radius: 20px; }
  .lab-doc-wrap { padding: 12px 10px 40px !important; }
  .bj .lab-title, .bj .lab-doc-head > h1 { font-size: 34px !important; }
  .bj .lab-md h2 .bj-frame, .bj .lab-md h2:nth-of-type(even) .bj-frame { font-size: 23px; padding: 6px 26px 8px; }
  .bj-bubble { max-width: 100%; margin-left: 6px; font-size: 18px; }
  .bj-flow-steps { flex-direction: column; align-items: stretch; gap: 2px; }
  .bj-flow-steps > i { align-self: center; transform: rotate(90deg); line-height: 1; padding: 0; }
  .bj-node { font-size: 12.5px; padding: 8px 12px; text-align: center; }
  .lab-home h1, .lab-home h2 { font-size: 30px !important; }

  /* ---- pop-ups become bottom sheets ---- */
  #modal-ui, #modal-tt, #modal-assignment, #modal-add-flashcard, #modal-avatar, #modal-new-note, #modal-global-ai, #modal-simulation { align-items: flex-end !important; padding: 0 !important; }
  #modal-ui > div, #modal-tt > div, #modal-assignment > div, #modal-add-flashcard > div, #modal-avatar > div, #modal-new-note > div, #modal-global-ai > div, #modal-simulation > div {
    position: relative; width: 100% !important; max-width: none !important; margin: 0 !important; border-radius: 28px 28px 0 0 !important; max-height: 94dvh; overflow-y: auto;
    padding-bottom: calc(22px + env(safe-area-inset-bottom)) !important; animation: fsSheetUp .32s cubic-bezier(.2,.9,.3,1) both; }
  #modal-ui > div::before, #modal-tt > div::before, #modal-assignment > div::before, #modal-add-flashcard > div::before, #modal-avatar > div::before, #modal-new-note > div::before, #modal-global-ai > div::before {
    content: ''; position: absolute; top: 8px; left: 50%; width: 40px; height: 5px; margin-left: -20px; border-radius: 99px; background: rgba(100,116,139,.35); }
  #modal-ui > .pd-modal { overflow: hidden; padding-bottom: 0 !important; }
  .pd-head { padding: 22px 18px 12px; } .pd-body { padding: 12px 18px 18px; } .pd-foot { padding: 12px 18px calc(12px + env(safe-area-inset-bottom)); }
  .pd-foot > span:first-child { flex-basis: 100%; }
  .pd-row { padding: 7px 8px; gap: 8px; } .pd-t { width: 40px; font-size: 10.5px; }

  /* comfortable taps, and no zoom-in when typing on iPhone */
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]), select, textarea { font-size: 16px !important; }
  .ne-btn { min-width: 36px; min-height: 36px; }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .mdock, .mdock-orb, #modal-ui > div, #modal-tt > div, #modal-assignment > div, #modal-add-flashcard > div, #modal-avatar > div, #modal-new-note > div { animation: none !important; }
}

/* ---- source labels and the coverage checklist in AI notes ---- */
.lab-callout.is-context { background: rgba(14,165,233,.06); border: 1.5px dashed rgba(14,165,233,.45); }
.lab-callout.is-context .lab-callout-title { color: #0369a1; }
.dark .lab-callout.is-context .lab-callout-title { color: #7dd3fc; }
.lab-callout.is-unclear { background: rgba(245,158,11,.08); border-color: rgba(245,158,11,.5); }
.lab-callout.is-unclear .lab-callout-title { color: #b45309; }
.dark .lab-callout.is-unclear .lab-callout-title { color: #fcd34d; }
.bj .lab-md ul > li.is-check { padding-left: 28px; }
.bj .lab-md ul > li.is-check::before { content: ''; left: 2px; top: .3em; width: 16px; height: 16px; border-radius: 5px; transform: none; background: transparent; box-shadow: none; border: 1.5px solid #f59e0b; }
.bj .lab-md ul > li.is-check.is-done::before { content: '✓'; border-color: #10b981; background: rgba(16,185,129,.14); color: #059669; font: 700 11px/14px Inter, sans-serif; text-align: center; }
.dark .bj .lab-md ul > li.is-check.is-done::before { color: #34d399; }
.bj .lab-md ul > li.is-check:not(.is-done) { color: #b45309; }
.dark .bj .lab-md ul > li.is-check:not(.is-done) { color: #fcd34d; }

/* Ask AI: actions under an error message */
.lab-msg-actions { display: flex; gap: 6px; margin-top: 8px; }
.lab-msg-actions button { padding: 5px 10px; border-radius: 9px; font-size: 11px; font-weight: 600; border: 1px solid var(--border-color); background: var(--bg-card); color: var(--text-main); }
.lab-msg-actions button:first-child { background: #7c3aed; border-color: #7c3aed; color: #fff; }

/* ---- accuracy check: "Check this" callouts, page links, the check badge and its list of fixes ---- */
.lab-callout.is-verify { background: rgba(244,63,94,.06); border: 1.5px dashed rgba(244,63,94,.5); }
.lab-callout.is-verify .lab-callout-title { color: #be123c; }
.dark .lab-callout.is-verify .lab-callout-title { color: #fda4af; }
.lab-pg { display: inline-flex; align-items: center; margin: 0 1px; padding: 0 6px; height: 18px; border-radius: 6px; vertical-align: 1px; font: 600 10px/18px 'JetBrains Mono', monospace; color: #6d28d9; background: rgba(124,58,237,.09); border: 1px solid rgba(124,58,237,.25); cursor: pointer; }
.lab-pg:hover { background: rgba(124,58,237,.18); }
.dark .lab-pg { color: #c4b5fd; }
.lab-audit { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px; font-size: 11px; font-weight: 600; color: #047857; background: rgba(16,185,129,.12); }
.lab-audit:hover { background: rgba(16,185,129,.2); }
.lab-audit.is-off { color: #b45309; background: rgba(245,158,11,.14); }
.dark .lab-audit { color: #6ee7b7; } .dark .lab-audit.is-off { color: #fcd34d; }
.lab-fixes { display: flex; flex-direction: column; gap: 10px; max-height: 50vh; overflow-y: auto; margin: 10px 0; }
.lab-fix { padding: 10px 12px; border-radius: 12px; border: 1px solid var(--border-color); background: var(--bg-card); }
.lab-fix-kind { display: inline-block; font: 700 10px Inter, sans-serif; letter-spacing: .04em; text-transform: uppercase; color: var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); padding: 2px 8px; border-radius: 999px; }
.lab-fix p { margin: 6px 0; font-size: 12px; }
.lab-fix del, .lab-fix ins { display: block; font: 11px/1.5 'JetBrains Mono', monospace; padding: 4px 8px; border-radius: 6px; white-space: pre-wrap; word-break: break-word; text-decoration: none; }
.lab-fix del { background: rgba(244,63,94,.08); color: #9f1239; }
.lab-fix ins { margin-top: 4px; background: rgba(16,185,129,.1); color: #065f46; }
.dark .lab-fix del { color: #fda4af; } .dark .lab-fix ins { color: #6ee7b7; }

/* ---- Assignments board: frameless columns ----
   A faint glass surface instead of a dashed outline, one glowing status bar on top,
   soft ambient shadows, and edges that light up on hover or while dragging. */
:root { --k-surface: rgba(255,255,255,.55); --k-surface-hover: rgba(255,255,255,.78); --k-edge: rgba(28,25,23,.07); --k-edge-hover: rgba(28,25,23,.16); --k-shadow: 0 14px 34px -16px rgba(68,48,20,.22); --k-card-shadow: 0 6px 18px -10px rgba(68,48,20,.25); }
.dark { --k-surface: rgba(255,255,255,.025); --k-surface-hover: rgba(255,255,255,.04); --k-edge: rgba(255,255,255,.07); --k-edge-hover: rgba(255,255,255,.16); --k-shadow: 0 16px 40px -12px rgba(0,0,0,.55); --k-card-shadow: 0 10px 24px -12px rgba(0,0,0,.6); }
.k-col { --k-accent: #94a3b8; }
.k-col[data-kcol="inprogress"] { --k-accent: #8b5cf6; }
.k-col[data-kcol="duesoon"] { --k-accent: #f59e0b; }
.k-col[data-kcol="completed"] { --k-accent: #10b981; }

.k-col .notebook-column, .k-col[data-kcol="duesoon"] .notebook-column {
  position: relative; border: 1px solid var(--k-edge); border-radius: 16px; padding: 16px 12px 12px;
  background: var(--k-surface); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: var(--k-shadow); transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}
/* the status bar: a short glowing line on the top edge only */
.k-col .notebook-column::before {
  content: ''; position: absolute; top: -1px; left: 18px; right: 18px; height: 2px; border-radius: 0 0 2px 2px;
  background: var(--k-accent); box-shadow: 0 0 14px 1px color-mix(in srgb, var(--k-accent) 55%, transparent); opacity: .9;
}
.k-col:hover .notebook-column { border-color: var(--k-edge-hover); background: var(--k-surface-hover); }
/* dragging a card over a column lights it in its status colour */
.k-col.k-over { outline: none; }
.k-col.k-over .notebook-column, .k-col[data-kcol="duesoon"].k-over .notebook-column {
  border-color: color-mix(in srgb, var(--k-accent) 60%, transparent); background: color-mix(in srgb, var(--k-accent) 7%, var(--k-surface));
  box-shadow: var(--k-shadow), 0 0 0 3px color-mix(in srgb, var(--k-accent) 18%, transparent);
}
.k-col-head { padding: 0 8px; }
.k-count { border-color: transparent; }

/* cards: nearly borderless at rest, the edge lights up on hover */
.k-col .k-card.planner-card { border-color: var(--k-edge); box-shadow: var(--k-card-shadow) !important; }
.k-col .k-card.planner-card:hover { border-color: color-mix(in srgb, var(--k-accent) 45%, transparent); box-shadow: var(--k-card-shadow), 0 0 0 1px color-mix(in srgb, var(--k-accent) 25%, transparent) !important; }
.k-col[data-kcol="duesoon"] .k-card { border-left: 2px solid color-mix(in srgb, #f59e0b 80%, transparent) !important; }

@media (prefers-reduced-motion: reduce) { .k-col .notebook-column { transition: none; } }

/* ---- deep accuracy check: AI-labelled boxes, part list, sections that need review ---- */
.lab-callout.is-explain { background: rgba(13,148,136,.06); border: 1.5px dashed rgba(13,148,136,.5); }
.lab-callout.is-explain .lab-callout-title { color: #0f766e; }
.dark .lab-callout.is-explain .lab-callout-title { color: #5eead4; }
.lab-callout.is-practice { background: rgba(147,51,234,.06); border: 1.5px dashed rgba(147,51,234,.45); }
.lab-callout.is-practice .lab-callout-title { color: #7e22ce; }
.dark .lab-callout.is-practice .lab-callout-title { color: #d8b4fe; }
.lab-parts { display: flex; flex-direction: column; gap: 4px; max-height: 190px; overflow: auto; }
.lab-part { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 8px; align-items: baseline; padding: 6px 10px; border-radius: 10px; background: rgba(16,185,129,.08); font-size: 11.5px; }
.lab-part span { color: #047857; font-weight: 700; }
.lab-part b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lab-part em { font-style: normal; color: var(--text-muted, #64748b); white-space: nowrap; }
.lab-part.is-bad { background: rgba(245,158,11,.14); }
.lab-part.is-bad span, .lab-part.is-bad em { color: #b45309; }
.dark .lab-part span { color: #6ee7b7; } .dark .lab-part.is-bad span, .dark .lab-part.is-bad em { color: #fcd34d; }
.lab-review-flag { display: inline-block; margin-left: 10px; padding: 2px 9px; border-radius: 999px; font: 600 11px/1.5 Inter, system-ui, sans-serif; letter-spacing: 0; color: #b45309; background: rgba(245,158,11,.18); vertical-align: middle; cursor: help; }
.dark .lab-review-flag { color: #fcd34d; }

.lab-callout.is-proof { background: rgba(37,99,235,.05); border-color: rgba(37,99,235,.3); }
.lab-callout.is-proof .lab-callout-title { color: #1d4ed8; }
.dark .lab-callout.is-proof .lab-callout-title { color: #93c5fd; }

/* ---- First-run setup, timetable import, "your next move" ---- */
.ob { position: fixed; inset: 0; z-index: 90; overflow-y: auto; color: var(--text-main); background-color: var(--bg-app);
  background-image: radial-gradient(62vmax 62vmax at 8% -12%, rgba(99,102,241,.17), transparent 62%), radial-gradient(52vmax 52vmax at 104% 104%, rgba(236,72,153,.13), transparent 62%); }
.ob button:focus-visible, .ob input:focus-visible, .ob select:focus-visible, .imp-drop:focus-within { outline: 2px solid #6366f1; outline-offset: 2px; }
.ob-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; max-width: 900px; margin: 0 auto; padding: 18px 24px; }
.ob-brand { display: flex; align-items: center; gap: 10px; font-size: 18px; }
.ob-brand .fs-logo { width: 34px; height: 34px; }
.ob-skip { font-size: 13px; font-weight: 600; color: var(--text-muted); padding: 8px 12px; border-radius: 10px; }
.ob-skip:hover { color: var(--text-main); background: var(--hover); }
.ob-body { max-width: 680px; margin: 0 auto; padding: 4vh 24px 56px; }
.ob-body.is-enter { animation: fadeIn .28s ease-out; }
.ob-dots { display: flex; gap: 6px; margin-bottom: 22px; }
.ob-dots i { width: 26px; height: 4px; border-radius: 4px; background: var(--line-strong); }
.ob-dots i.is-on { background: #6366f1; }
.ob-h1 { font-size: clamp(30px, 5.4vw, 44px); font-weight: 800; letter-spacing: -.035em; line-height: 1.08; }
.ob-lead { font-size: 16px; line-height: 1.5; color: var(--text-muted); margin-top: 10px; }
.ob-q { font-size: 14px; font-weight: 700; margin: 30px 0 12px; }
.ob-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.ob-grid.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ob-card { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 16px; border-radius: 16px; border: 1.5px solid var(--border-color); background: var(--bg-card); text-align: left; transition: border-color .15s, transform .15s, box-shadow .15s; }
.ob-card:hover { border-color: rgba(99,102,241,.5); transform: translateY(-1px); }
.ob-card.is-on { border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,.18); }
.ob-card b { font-size: 13.5px; line-height: 1.3; }
.ob-card small { font-size: 12px; line-height: 1.45; color: var(--text-muted); }
.ob-emoji { font-size: 26px; line-height: 1; }
.ob-checks { display: flex; flex-wrap: wrap; gap: 8px; }
.ob-check { display: inline-flex; align-items: center; gap: 9px; padding: 10px 14px; border-radius: 12px; border: 1.5px solid var(--border-color); background: var(--bg-card); font-size: 13px; font-weight: 600; transition: border-color .15s; }
.ob-check i { width: 18px; height: 18px; border-radius: 6px; border: 1.5px solid var(--line-strong); display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 12px; line-height: 1; color: #fff; }
.ob-check.is-on { border-color: rgba(99,102,241,.55); }
.ob-check.is-on i { background: #6366f1; border-color: #6366f1; }
.ob-check.is-on i::after { content: '✓'; }
.ob-seg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ob-seg button { padding: 12px 14px; border-radius: 14px; border: 1.5px solid var(--border-color); background: var(--bg-card); text-align: left; transition: border-color .15s, box-shadow .15s; }
.ob-seg button b { display: block; font-size: 13px; }
.ob-seg button span { display: block; font: 11px 'JetBrains Mono', monospace; color: var(--text-muted); margin-top: 3px; }
.ob-seg button.is-on { border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,.18); }
.ob-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 34px; }
.ob-primary { height: 48px; padding: 0 24px; border-radius: 14px; font-size: 15px; font-weight: 700; color: #fff; background: linear-gradient(100deg, #4f46e5, #8b5cf6 60%, #db2777); box-shadow: 0 14px 28px -14px rgba(124,58,237,.8); transition: filter .15s, transform .15s; }
.ob-primary:hover { filter: brightness(1.08); } .ob-primary:active { transform: scale(.98); }
.ob-ghost { height: 48px; padding: 0 18px; border-radius: 14px; font-size: 14px; font-weight: 600; color: var(--text-muted); }
.ob-ghost:hover { color: var(--text-main); background: var(--hover); }
.ob-link { font-size: 12.5px; font-weight: 600; color: #6366f1; padding: 6px 2px; } .ob-link:hover { text-decoration: underline; }
.ob-under { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; margin-top: 8px; }
.ob-quick { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.ob-quick button { padding: 7px 12px; border-radius: 999px; border: 1px dashed var(--line-strong); font-size: 12px; font-weight: 600; color: var(--text-muted); }
.ob-quick button:hover { color: #4f46e5; border-color: #6366f1; }
.ob-rows, .ob-tasks { display: flex; flex-direction: column; gap: 8px; }
.ob-tasks { margin-top: 26px; }
.ob-tl-row.is-past { opacity: .45; }
.ob-row, .ob-task { display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: 14px; border: 1px solid var(--border-color); background: var(--bg-card); }
.ob-row > span { color: var(--text-muted); }
.ob-row input, .ob-task input, .ob-task select { height: 38px; padding: 0 10px; border-radius: 10px; border: 1px solid var(--border-color); background: var(--field); color: var(--text-main); font-size: 13px; min-width: 0; }
.ob-row input[type=time] { width: 104px; flex-shrink: 0; font-family: 'JetBrains Mono', monospace; font-size: 12.5px; }
.ob-row input[type=text], .ob-task input { flex: 1 1 auto; }
.ob-task select { flex-shrink: 0; }
.ob-rep { flex-shrink: 0; height: 30px; padding: 0 10px; border-radius: 999px; font-size: 11px; font-weight: 600; color: var(--text-muted); background: var(--tint); }
.ob-rep.is-on { color: #fff; background: #6366f1; }
.ob-x { flex-shrink: 0; width: 30px; height: 30px; border-radius: 9px; font-size: 12px; color: var(--text-muted); }
.ob-x:hover { background: var(--hover); color: #e11d48; }
.ob-tl { margin-top: 26px; padding: 8px 6px; border-radius: 18px; border: 1px solid var(--border-color); background: var(--bg-card); }
.ob-tl-row { display: flex; align-items: center; gap: 12px; padding: 9px 12px; }
.ob-tl-row time { width: 48px; flex-shrink: 0; font: 600 13px 'JetBrains Mono', monospace; color: var(--text-muted); }
.ob-tl-row i { width: 4px; align-self: stretch; min-height: 26px; border-radius: 4px; background: var(--c, var(--line-strong)); flex-shrink: 0; }
.ob-tl-row b { display: block; font-size: 14px; }
.ob-tl-row small { display: block; font-size: 11.5px; color: var(--text-muted); margin-top: 1px; }
.ob-tl-row.is-study i { background: #7c3aed; }
.ob-tl-row.is-break b, .ob-tl-row.is-free b, .ob-tl-row.is-done b { font-weight: 500; color: var(--text-muted); }
.ob-tl-row.is-break i { background: #10b981; }
.ob-tl-row.is-free i, .ob-tl-row.is-done i { background: transparent; border-left: 2px dashed var(--line-strong); width: 2px; margin: 0 1px; }
.ob-move { margin-top: 16px; }
.ob-imp { display: block; }
.imp-drop { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 26px 18px; border-radius: 16px; border: 2px dashed rgba(99,102,241,.45); background: rgba(99,102,241,.05); text-align: center; cursor: pointer; transition: background .15s, border-color .15s; }
.imp-drop:hover, .imp-drop.is-over { background: rgba(99,102,241,.1); border-color: #6366f1; }
.imp-drop b { font-size: 13.5px; } .imp-drop small { font-size: 12px; color: var(--text-muted); }
.imp-note { font-size: 11px; color: var(--text-muted); margin-top: 8px; }
.imp-err { font-size: 12.5px; color: #e11d48; margin-top: 10px; } .dark .imp-err { color: #fb7185; }
.imp-busy { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 30px 18px; border-radius: 16px; border: 1px solid var(--border-color); background: var(--bg-card); text-align: center; }
.imp-busy b { font-size: 13.5px; } .imp-busy small { font-size: 12px; color: var(--text-muted); }
.imp-spin { width: 26px; height: 26px; border-radius: 50%; border: 3px solid rgba(99,102,241,.2); border-top-color: #6366f1; animation: impSpin .8s linear infinite; }
@keyframes impSpin { to { transform: rotate(360deg); } }
.imp-head { font-size: 12.5px; line-height: 1.5; color: var(--text-muted); margin-bottom: 8px; } .imp-head b { color: var(--text-main); }
.imp-list { max-height: 300px; overflow-y: auto; border-radius: 14px; border: 1px solid var(--border-color); background: var(--bg-card); padding: 6px; margin-bottom: 6px; }
.imp-day { font: 600 10px 'JetBrains Mono', monospace; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); padding: 8px 8px 4px; }
.imp-item { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 10px; cursor: pointer; }
.imp-item:hover { background: var(--hover); }
.imp-item input { width: 16px; height: 16px; accent-color: #6366f1; flex-shrink: 0; }
.imp-time { flex-shrink: 0; font: 12px 'JetBrains Mono', monospace; color: var(--text-muted); }
.imp-title { min-width: 0; } .imp-title b { display: block; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.imp-title small { display: block; font-size: 11px; color: var(--text-muted); }
.dash-move { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "k acts" "t acts" "s acts"; align-items: center; column-gap: 18px; padding: 18px 20px; border-radius: 14px; border-color: rgba(99,102,241,.35); background-image: linear-gradient(100deg, rgba(99,102,241,.08), rgba(236,72,153,.05)); }
.dash-move .dash-k { grid-area: k; color: #6366f1; } .dark .dash-move .dash-k { color: #a5b4fc; }
.move-t { grid-area: t; display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; margin-top: 8px; font-size: 19px; line-height: 1.25; letter-spacing: -.01em; }
.move-t b { font-weight: 700; } .move-t em { font: 600 13px 'JetBrains Mono', monospace; font-style: normal; color: var(--text-muted); }
.move-s { grid-area: s; font-size: 12.5px; color: var(--text-muted); margin-top: 3px; }
.move-acts { grid-area: acts; display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.move-acts .dash-act { height: 40px; }
.dash-start { padding: 26px 22px; border-radius: 14px; text-align: center; border-style: dashed; }
.dash-start .font-hand { font-size: 26px; color: var(--ink); line-height: 1; }
.dash-start h3 { font-size: 20px; font-weight: 700; letter-spacing: -.02em; margin-top: 4px; }
.dash-start-acts { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 16px; }
@media (max-width: 640px) {
  .ob-top { padding: 14px 16px; } .ob-body { padding: 2vh 16px 40px; }
  .ob-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ob-grid.is-two { grid-template-columns: minmax(0, 1fr); }
  .ob-seg { grid-template-columns: minmax(0, 1fr); }
  .ob-row, .ob-task { flex-wrap: wrap; }
  .ob-row input[type=text], .ob-task input { flex: 1 1 100%; order: -1; }
  .ob-row input[type=time] { flex: 1 1 0; width: auto; padding: 0 6px; font-size: 12px; }
  .ob-task select { flex: 1 1 0; }
  .ob-actions { position: sticky; bottom: 0; margin: 26px -16px -40px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); background: var(--bg-app); border-top: 1px solid var(--border-color); }
  .ob-primary { flex: 1; }
  .dash-move { grid-template-columns: minmax(0, 1fr); grid-template-areas: "k" "t" "s" "acts"; }
  .move-acts { justify-content: stretch; margin-top: 14px; } .move-acts .dash-act { flex: 1 1 auto; justify-content: center; }
  #tab-dashboard .move-acts .dash-act { min-height: 44px; height: 44px; flex-direction: row; gap: 6px; padding: 0 14px; border-radius: 12px; font-size: 13px; }
  #tab-dashboard .dash-start-acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #tab-dashboard .dash-start-acts .is-primary { grid-column: 1 / -1; min-height: 56px; flex-direction: row; }
}
@media (prefers-reduced-motion: reduce) { .ob-body.is-enter { animation: none; } .imp-spin { animation-duration: 2s; } }

/* ---- Empty states that say what to add (never a row of zeros) ---- */
.k-ready, .tt-ready { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px 24px; padding: 18px 20px; border-radius: 12px; border-style: dashed; }
.tt-ready { grid-column: 1 / -1; }
.k-ready .font-hand, .tt-ready .font-hand { display: block; font-size: 22px; line-height: 1.1; color: var(--ink); }
.k-ready b, .tt-ready b { display: block; font-size: 15px; font-weight: 700; letter-spacing: -.01em; margin-top: 3px; }
.tt-ready p { font-size: 12px; color: var(--text-muted); margin-top: 3px; }
.tt-ready-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.k-board.is-empty .k-count { visibility: hidden; }
.k-telemetry.hidden, .k-ready.hidden { display: none; }
.dash-cell .dash-t + .dash-s { margin-top: 3px; }