@font-face{font-family:Archivo;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/static/fonts/archivo-latin-wdth-normal.woff2) format("woff2-variations");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:Archivo;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/static/fonts/archivo-latin-ext-wdth-normal.woff2) format("woff2-variations");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}*,: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:Archivo,ui-sans-serif,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:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,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}html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scrollbar-gutter:stable}body{--tw-bg-opacity:1;background-color:rgb(245 240 235/var(--tw-bg-opacity,1));font-family:Archivo,ui-sans-serif,system-ui,sans-serif;--tw-text-opacity:1;color:rgb(29 29 27/var(--tw-text-opacity,1))}:focus-visible{outline:2px solid #3d3d2e;outline-offset:2px}table{font-variant-numeric:tabular-nums}::-moz-selection{background:#e7e4d6}::selection{background:#e7e4d6}.display{font-stretch:118%;font-weight:620;letter-spacing:-.025em;line-height:1.02}.display-sm{font-stretch:112%;font-weight:600;letter-spacing:-.015em}.panel{border-radius:1rem;--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--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(1px + 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);--tw-ring-color:rgba(29,29,27,.06)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:9999px;padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.btn:disabled{cursor:not-allowed;opacity:.5}.btn-primary{--tw-bg-opacity:1;background-color:rgb(61 61 46/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.btn-primary:hover{--tw-bg-opacity:1;background-color:rgb(44 44 33/var(--tw-bg-opacity,1))}.btn-quiet{color:rgba(29,29,27,.7)}.btn-quiet:hover{--tw-bg-opacity:1;background-color:rgb(231 228 214/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(29 29 27/var(--tw-text-opacity,1))}.btn-danger{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))}.btn-danger:hover{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity,1))}.field{display:block;width:100%;border-radius:.75rem;border-width:1px;border-color:rgba(29,29,27,.15);--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));padding:.625rem .875rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgb(29 29 27/var(--tw-text-opacity,1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.field::-moz-placeholder{color:rgba(29,29,27,.35)}.field::placeholder{color:rgba(29,29,27,.35)}.field:focus{--tw-border-opacity:1;border-color:rgb(61 61 46/var(--tw-border-opacity,1));outline:2px solid transparent;outline-offset:2px;--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);--tw-ring-color:rgba(61,61,46,.2)}.label{margin-bottom:.375rem;display:block;font-weight:500;color:rgba(29,29,27,.8)}.label,.notice{font-size:.875rem;line-height:1.25rem}.notice{display:flex;align-items:flex-start;gap:.75rem;border-radius:.75rem;padding:.75rem 1rem}.notice-ok{background-color:rgb(231 228 214/var(--tw-bg-opacity,1));color:rgb(44 44 33/var(--tw-text-opacity,1))}.notice-error,.notice-ok{--tw-bg-opacity:1;--tw-text-opacity:1}.notice-error{background-color:rgb(254 242 242/var(--tw-bg-opacity,1));color:rgb(153 27 27/var(--tw-text-opacity,1));--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(1px + 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);--tw-ring-opacity:1;--tw-ring-color:rgb(254 202 202/var(--tw-ring-opacity,1))}.nav-link{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem;color:rgba(29,29,27,.65);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.nav-link:hover,.nav-link[aria-current=page]{--tw-bg-opacity:1;background-color:rgb(231 228 214/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(29 29 27/var(--tw-text-opacity,1))}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.pointer-events-none{pointer-events:none}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.bottom-full{bottom:100%}.left-1\/2{left:50%}.top-0{top:0}.z-20{z-index:20}.z-40{z-index:40}.z-50{z-index:50}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-auto{margin-left:auto;margin-right:auto}.-ml-2{margin-left:-.5rem}.-ml-4{margin-left:-1rem}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.ml-1{margin-left:.25rem}.ml-2{margin-left:.5rem}.ml-4{margin-left:1rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-12{margin-top:3rem}.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}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.aspect-square{aspect-ratio:1/1}.size-1\.5{width:.375rem;height:.375rem}.size-10{width:2.5rem;height:2.5rem}.size-12{width:3rem;height:3rem}.size-3\.5{width:.875rem;height:.875rem}.size-4{width:1rem;height:1rem}.size-5{width:1.25rem;height:1.25rem}.size-6{width:1.5rem;height:1.5rem}.size-9{width:2.25rem;height:2.25rem}.h-1\.5{height:.375rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-7{height:1.75rem}.h-full{height:100%}.min-h-screen{min-height:100vh}.w-12{width:3rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-4{width:1rem}.w-40{width:10rem}.w-48{width:12rem}.w-56{width:14rem}.w-60{width:15rem}.w-auto{width:auto}.w-full{width:100%}.w-px{width:1px}.min-w-0{min-width:0}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.max-w-\[12rem\]{max-width:12rem}.max-w-md{max-width:28rem}.max-w-prose{max-width:65ch}.max-w-sm{max-width:24rem}.max-w-xl{max-width:36rem}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.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 pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-help{cursor:help}.cursor-pointer{cursor:pointer}.select-all{-webkit-user-select:all;-moz-user-select:all;user-select:all}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.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-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-8{gap:2rem}.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-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))}.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-ink\/\[0\.06\]>:not([hidden])~:not([hidden]){border-color:rgba(29,29,27,.06)}.divide-ink\/\[0\.07\]>:not([hidden])~:not([hidden]){border-color:rgba(29,29,27,.07)}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.truncate{overflow:hidden;text-overflow:ellipsis}.truncate,.whitespace-nowrap{white-space:nowrap}.break-all{word-break:break-all}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.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-4{border-width:4px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-t{border-top-width:1px}.border-t-2{border-top-width:2px}.border-amber-200{--tw-border-opacity:1;border-color:rgb(253 230 138/var(--tw-border-opacity,1))}.border-amber-300{--tw-border-opacity:1;border-color:rgb(252 211 77/var(--tw-border-opacity,1))}.border-blue-200{--tw-border-opacity:1;border-color:rgb(191 219 254/var(--tw-border-opacity,1))}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246/var(--tw-border-opacity,1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219/var(--tw-border-opacity,1))}.border-green-200{--tw-border-opacity:1;border-color:rgb(187 247 208/var(--tw-border-opacity,1))}.border-ink\/\[0\.07\]{border-color:rgba(29,29,27,.07)}.border-olive{--tw-border-opacity:1;border-color:rgb(61 61 46/var(--tw-border-opacity,1))}.border-olive\/20{border-color:rgba(61,61,46,.2)}.border-red-200{--tw-border-opacity:1;border-color:rgb(254 202 202/var(--tw-border-opacity,1))}.border-t-olive{--tw-border-opacity:1;border-top-color:rgb(61 61 46/var(--tw-border-opacity,1))}.bg-amber-50{--tw-bg-opacity:1;background-color:rgb(255 251 235/var(--tw-bg-opacity,1))}.bg-amber-500{--tw-bg-opacity:1;background-color:rgb(245 158 11/var(--tw-bg-opacity,1))}.bg-amber-700{--tw-bg-opacity:1;background-color:rgb(180 83 9/var(--tw-bg-opacity,1))}.bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1))}.bg-cream{--tw-bg-opacity:1;background-color:rgb(245 240 235/var(--tw-bg-opacity,1))}.bg-cream\/85{background-color:hsla(30,33%,94%,.85)}.bg-cream\/90{background-color:hsla(30,33%,94%,.9)}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.bg-gray-50\/40{background-color:rgba(249,250,251,.4)}.bg-gray-50\/60{background-color:rgba(249,250,251,.6)}.bg-gray-800{--tw-bg-opacity:1;background-color:rgb(31 41 55/var(--tw-bg-opacity,1))}.bg-green-50{--tw-bg-opacity:1;background-color:rgb(240 253 244/var(--tw-bg-opacity,1))}.bg-ink\/10{background-color:rgba(29,29,27,.1)}.bg-ink\/\[0\.05\]{background-color:rgba(29,29,27,.05)}.bg-olive{--tw-bg-opacity:1;background-color:rgb(61 61 46/var(--tw-bg-opacity,1))}.bg-olive-soft{--tw-bg-opacity:1;background-color:rgb(231 228 214/var(--tw-bg-opacity,1))}.bg-olive-soft\/50{background-color:hsla(49,26%,87%,.5)}.bg-olive\/10{background-color:rgba(61,61,46,.1)}.bg-red-50{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity,1))}.bg-stone-50{--tw-bg-opacity:1;background-color:rgb(250 250 249/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-10{padding:2.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-7{padding:1.75rem}.p-8{padding:2rem}.px-0{padding-left:0;padding-right:0}.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-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}.py-0{padding-top:0;padding-bottom:0}.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-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pb-20{padding-bottom:5rem}.pl-12{padding-left:3rem}.pr-4{padding-right:1rem}.pt-12{padding-top:3rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.align-middle{vertical-align:middle}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-\[11px\]{font-size:11px}.text-\[15px\]{font-size:15px}.text-\[2\.6rem\]{font-size:2.6rem}.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-xs{font-size:.75rem;line-height:1rem}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.lowercase{text-transform:lowercase}.normal-case{text-transform:none}.italic{font-style:italic}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.leading-snug{line-height:1.375}.tracking-\[0\.35em\]{letter-spacing:.35em}.tracking-\[0\.3em\]{letter-spacing:.3em}.tracking-wider{letter-spacing:.05em}.text-amber-400{--tw-text-opacity:1;color:rgb(251 191 36/var(--tw-text-opacity,1))}.text-amber-600{--tw-text-opacity:1;color:rgb(217 119 6/var(--tw-text-opacity,1))}.text-amber-700{--tw-text-opacity:1;color:rgb(180 83 9/var(--tw-text-opacity,1))}.text-amber-700\/70{color:rgba(180,83,9,.7)}.text-amber-800{--tw-text-opacity:1;color:rgb(146 64 14/var(--tw-text-opacity,1))}.text-amber-900{--tw-text-opacity:1;color:rgb(120 53 15/var(--tw-text-opacity,1))}.text-amber-900\/70{color:rgba(120,53,15,.7)}.text-amber-900\/90{color:rgba(120,53,15,.9)}.text-blue-700{--tw-text-opacity:1;color:rgb(29 78 216/var(--tw-text-opacity,1))}.text-cream{--tw-text-opacity:1;color:rgb(245 240 235/var(--tw-text-opacity,1))}.text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity,1))}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.text-green-700{--tw-text-opacity:1;color:rgb(21 128 61/var(--tw-text-opacity,1))}.text-ink{--tw-text-opacity:1;color:rgb(29 29 27/var(--tw-text-opacity,1))}.text-ink\/30{color:rgba(29,29,27,.3)}.text-ink\/40{color:rgba(29,29,27,.4)}.text-ink\/45{color:rgba(29,29,27,.45)}.text-ink\/50{color:rgba(29,29,27,.5)}.text-ink\/55{color:rgba(29,29,27,.55)}.text-ink\/60{color:rgba(29,29,27,.6)}.text-ink\/70{color:rgba(29,29,27,.7)}.text-ink\/75{color:rgba(29,29,27,.75)}.text-olive{--tw-text-opacity:1;color:rgb(61 61 46/var(--tw-text-opacity,1))}.text-olive-deep{--tw-text-opacity:1;color:rgb(44 44 33/var(--tw-text-opacity,1))}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))}.text-red-800{--tw-text-opacity:1;color:rgb(153 27 27/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}.underline-offset-4{text-underline-offset:4px}.accent-olive{accent-color:#3d3d2e}.opacity-0{opacity:0}.opacity-60{opacity:.6}.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-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)}.ring{--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(3px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.ring,.ring-1{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-1{--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(1px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.ring-ink\/10{--tw-ring-color:rgba(29,29,27,.1)}.ring-ink\/15{--tw-ring-color:rgba(29,29,27,.15)}.ring-ink\/\[0\.06\]{--tw-ring-color:rgba(29,29,27,.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-md{--tw-backdrop-blur:blur(12px)}.backdrop-blur-md,.backdrop-blur-sm{-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)}.backdrop-blur-sm{--tw-backdrop-blur:blur(4px)}.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-1000{transition-duration:1s}.duration-200{transition-duration:.2s}@view-transition{navigation:auto}.site-header{view-transition-name:site-header}main{view-transition-name:page}::view-transition-old(page){animation:page-out .14s ease-in both}::view-transition-new(page){animation:page-in .26s cubic-bezier(.2,.7,.2,1) both}@keyframes page-out{to{opacity:0;transform:translateY(-4px)}}@keyframes page-in{0%{opacity:0;transform:translateY(8px)}}#nav-progress{position:fixed;inset:0 0 auto 0;height:2px;z-index:100;pointer-events:none;background:#3d3d2e;transform-origin:left;transform:scaleX(0);opacity:0}#nav-progress.is-loading{opacity:1;transition:transform 12s cubic-bezier(.05,.6,.1,1),opacity .2s;transform:scaleX(.92)}#nav-progress.is-done{opacity:0;transform:scaleX(1);transition:transform .2s ease-out,opacity .3s .2s}.enter>*{animation:enter .52s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i, 0)*55ms + 60ms)}@keyframes enter{0%{opacity:0;transform:translateY(10px)}}@media (prefers-reduced-motion:reduce){*,::view-transition-new(page),::view-transition-old(page),:after,:before{animation:none!important;transition:none!important}}.hover\:bg-amber-100:hover{--tw-bg-opacity:1;background-color:rgb(254 243 199/var(--tw-bg-opacity,1))}.hover\:bg-amber-800:hover{--tw-bg-opacity:1;background-color:rgb(146 64 14/var(--tw-bg-opacity,1))}.hover\:bg-cream\/60:hover{background-color:hsla(30,33%,94%,.6)}.hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.hover\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.hover\:bg-olive:hover{--tw-bg-opacity:1;background-color:rgb(61 61 46/var(--tw-bg-opacity,1))}.hover\:bg-olive-soft\/60:hover{background-color:hsla(49,26%,87%,.6)}.hover\:bg-olive\/10:hover{background-color:rgba(61,61,46,.1)}.hover\:bg-olive\/90:hover{background-color:rgba(61,61,46,.9)}.hover\:text-amber-900:hover{--tw-text-opacity:1;color:rgb(120 53 15/var(--tw-text-opacity,1))}.hover\:text-ink:hover{--tw-text-opacity:1;color:rgb(29 29 27/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}.hover\:opacity-90:hover{opacity:.9}.focus\:border-olive:focus{--tw-border-opacity:1;border-color:rgb(61 61 46/var(--tw-border-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-olive:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(61 61 46/var(--tw-ring-opacity,1))}.focus-visible\:bg-olive-soft\/60:focus-visible{background-color:hsla(49,26%,87%,.6)}.group:hover .group-hover\:translate-x-1{--tw-translate-x:0.25rem}.group:hover .group-hover\:-rotate-3,.group:hover .group-hover\:translate-x-1{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\:-rotate-3{--tw-rotate:-3deg}.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-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.group:hover .group-hover\:text-olive{--tw-text-opacity:1;color:rgb(61 61 46/var(--tw-text-opacity,1))}.group:hover .group-hover\:opacity-100{opacity:1}@media (min-width:640px){.sm\:col-span-2{grid-column:span 2/span 2}.sm\:col-span-4{grid-column:span 4/span 4}.sm\:mt-16{margin-top:4rem}.sm\:inline{display:inline}.sm\:h-8{height:2rem}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:grid-cols-\[1fr_1fr_1fr_auto\]{grid-template-columns:1fr 1fr 1fr auto}.sm\:grid-cols-\[200px_1fr\]{grid-template-columns:200px 1fr}.sm\:gap-6{gap:1.5rem}.sm\:p-8{padding:2rem}.sm\:p-9{padding:2.25rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:px-7{padding-left:1.75rem;padding-right:1.75rem}.sm\:py-14{padding-top:3.5rem;padding-bottom:3.5rem}.sm\:py-6{padding-top:1.5rem;padding-bottom:1.5rem}.sm\:pt-20{padding-top:5rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-6xl{font-size:3.75rem;line-height:1}.sm\:text-lg{font-size:1.125rem;line-height:1.75rem}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width:768px){.md\:inline{display:inline}.md\:table-cell{display:table-cell}.md\:hidden{display:none}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (min-width:1024px){.lg\:table-cell{display:table-cell}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-cols-\[1fr_1fr_1\.4fr_1fr_auto\]{grid-template-columns:1fr 1fr 1.4fr 1fr auto}}
/* Hand-written additions. This bundle is a purged, hand-committed Tailwind
   build and the repo has no Tailwind tooling, so anything not generated above
   has to be written here by hand. Keep it small and keep it commented. */

/* Item tooltip on the follow-up report: what is on the order, without leaving
   the page. focus-within so it is reachable by keyboard, not only by mouse. */
.tip{position:relative;display:inline-block;cursor:help;border-bottom:1px dotted rgb(61 61 46/.35)}
.tip-body{display:none;position:absolute;right:0;top:100%;z-index:20;margin-top:.35rem;
  width:max-content;max-width:22rem;padding:.6rem .75rem;text-align:left;white-space:normal;
  font-size:.8125rem;line-height:1.5;font-weight:400;color:#3d3d2e;background:#fff;
  border:1px solid rgb(61 61 46/.12);border-radius:.6rem;box-shadow:0 10px 30px rgb(61 61 46/.14)}
.tip:hover>.tip-body,.tip:focus-within>.tip-body{display:block}
/* Lifted out of the table's scroll box by static/js/tooltips.js: the panel
   scrolls sideways, and a clipped hover made it scroll downwards too. */
.tip-body.tip-float{position:fixed;right:auto;margin-top:0}
.tip-body ul{margin:0;padding:0;list-style:none}
.tip-body li{display:flex;gap:.5rem;justify-content:space-between}
.tip-body li+li{margin-top:.25rem}
/* One line item in a hover, with the promises the theme wrote on it under it. */
.tip-line{margin-top:.4rem}
.tip-line+.tip-line{padding-top:.4rem;border-top:1px solid rgb(61 61 46/.07)}
.tip-line>span{display:block}
.tip-sub{color:rgb(61 61 46/.55)}

/* Sortable table headers (static/js/sortable-table.js). Attribute selectors,
   so no class needs to exist in the purged bundle for these to apply. */
th[data-sort]{cursor:pointer;-webkit-user-select:none;user-select:none}
th[data-sort]:hover{color:rgb(61 61 46/.8)}
th[data-sort]::after{content:"\2195";margin-left:.35rem;font-size:.75em;opacity:.35}
th[data-sort][aria-sort=ascending]::after{content:"\2191";opacity:.8}
th[data-sort][aria-sort=descending]::after{content:"\2193";opacity:.8}

/* Writing to customers from the follow-up report (static/js/bulk-select.js).
   The bar follows the page so a selection made in the last table does not
   require scrolling back up. It is glass rather than a solid panel: it lies on
   top of the table it is about, and the rows have to stay readable under it. */
.bulkbar{position:sticky;bottom:1rem;z-index:10;border-radius:1rem;
  background:rgb(245 240 235/.72);border:1px solid rgb(255 255 255/.55);
  -webkit-backdrop-filter:saturate(1.8) blur(16px);backdrop-filter:saturate(1.8) blur(16px);
  box-shadow:0 10px 30px rgb(61 61 46/.16),inset 0 1px 0 rgb(255 255 255/.7)}
/* Without backdrop-filter the bar would be a pale window onto the rows behind
   it, so it becomes opaque instead. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .bulkbar{background:#f5f0eb}
}
/* .flex on the bar beats the preflight's [hidden] rule, so the bar has to be
   told twice to stay away until something is ticked. */
.bulkbar[hidden]{display:none}

/* The row above the lists: which pile on the left, how much of it on the right.
   The rule under the tabs runs the full width, so the filter sits on the same
   line rather than under its own. */
.reporttools{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;
  gap:.75rem;border-bottom:1px solid rgb(61 61 46/.12)}
.reporttools .tabs{flex:1 1 auto;border-bottom:0}
.reporttools-right{display:flex;align-items:center;gap:.5rem;padding-bottom:.4rem}

/* The view filter (static/js/followup-view.js). A segmented control, because
   it is one question with five answers and not five buttons. The colour is the
   view's own and not the pressed state's: what is outstanding is red whether
   you are looking at it or not, and what is done is green. "Alle" is neutral -
   it is not an answer, it is the way back out. */
.viewfilter{display:inline-flex;flex-wrap:wrap;padding:.15rem;border-radius:999px;background:rgb(61 61 46/.07)}
.filterbtn{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .55rem .3rem .7rem;border:0;
  border-radius:999px;background:transparent;cursor:pointer;font-size:.8125rem;font-weight:500;
  color:rgb(61 61 46/.6);white-space:nowrap}
.filterbtn:hover{color:#3d3d2e}
.filterbtn[aria-pressed=true]{color:#3d3d2e;background:#fff;box-shadow:0 1px 2px rgb(61 61 46/.12)}

/* How many the view holds, counted by followupViewCounts() in PHP. It sits in
   the button rather than beside it, so the number cannot end up on the line
   below its own label when the control wraps. */
.viewcount{min-width:1.35rem;padding:0 .35rem;border-radius:999px;background:rgb(61 61 46/.09);
  color:rgb(29 29 27/.55);font-size:.6875rem;font-weight:600;line-height:1.25rem;text-align:center;
  font-variant-numeric:tabular-nums}
.filterbtn[data-tone=alert] .viewcount{background:rgb(185 28 28/.1);color:#b91c1c}
.filterbtn[data-tone=done] .viewcount{background:rgb(21 128 61/.12);color:#15803d}
.filterbtn[data-tone=alert][aria-pressed=true]{color:#b91c1c}
.filterbtn[data-tone=done][aria-pressed=true]{color:#15803d}
.filterbtn[data-tone=alert][aria-pressed=true] .viewcount{background:#b91c1c;color:#fff}
.filterbtn[data-tone=done][aria-pressed=true] .viewcount{background:#15803d;color:#fff}
/* A view with nothing in it is not a place to start, so it stops shouting -
   but it keeps its place, the way an empty tab does. */
.filterbtn[data-zero]{color:rgb(61 61 46/.4)}
.filterbtn[data-zero] .viewcount,
.filterbtn[data-zero][aria-pressed=true] .viewcount{background:rgb(61 61 46/.07);color:rgb(29 29 27/.35)}

/* The two halves of "Udestående" - a new date and a message to the customer -
   as a sentence under the tool row rather than as two more buttons. Which half
   is missing is a diagnosis, not the morning's work, so it reads instead of
   competing; the numbers are still the same two views and open them on a click. */
.viewsplit{margin-top:.5rem;text-align:right;font-size:.8125rem;color:rgb(61 61 46/.5)}
.viewsplit button{padding:0;border:0;background:transparent;font:inherit;cursor:pointer;
  color:rgb(61 61 46/.7);text-decoration:underline;text-decoration-color:rgb(61 61 46/.25);
  text-underline-offset:.15rem}
.viewsplit button span{font-weight:600;font-variant-numeric:tabular-nums}
.viewsplit button:hover{color:#3d3d2e}
.viewsplit button[aria-pressed=true]{color:#b91c1c;text-decoration-color:rgb(185 28 28/.45)}
/* Nothing in it is not a place to go, but it keeps its place in the sentence. */
.viewsplit button[data-zero]{color:rgb(61 61 46/.35);text-decoration:none;cursor:default}

/* The empty state of a pile under "Klaret" is not good news - nothing has been
   dealt with - so followup-view.js swaps the green notice for this one. */
.notice-quiet{background:rgb(61 61 46/.06);color:rgb(29 29 27/.6)}

/* One market inside a pile, folded. The count is the point of the summary: it
   says whether the market is worth opening before it is opened. */
.segment{margin-top:1rem}
.segment-head{display:flex;align-items:center;gap:.5rem;padding:.4rem 0;font-size:.875rem;
  font-weight:500;cursor:pointer;list-style:none}
.segment-head::-webkit-details-marker{display:none}
.segment-chevron{color:rgb(61 61 46/.45);transition:transform .15s ease}
.segment[open]>.segment-head .segment-chevron{transform:rotate(90deg)}
.segment-count{padding:.05rem .4rem;border-radius:999px;font-size:.75rem;font-weight:500;
  font-variant-numeric:tabular-nums;color:#3d3d2e;background:rgb(61 61 46/.08)}
.segment-body{margin-top:.5rem}
/* .notice sets display:flex, which beats the preflight's [hidden] rule, so the
   "nothing left in this pile" line needs to be told twice to stay away. */
[data-pile-empty][hidden]{display:none}

/* What has happened on the order at all - messages to the customer and agreed
   dates in one count, with the whole trail in the hover. It is the row's only
   mark, beside the order number: the separate "Skrevet <dato>" stamp said the
   same thing in a second badge on the same line. Amber is what the stamp knew
   on its own - the latest message is older than the deadline in force, so the
   customer is owed another word. An explicit line-height keeps the digit
   centred in the pill whatever the icon does.

   The icon is sized here and not by a utility class. An <svg> with a viewBox
   and no width or height has no size of its own, and a flex container measures
   such a child as nothing: the pill sized itself to the icon and the padding,
   and the count stood outside its own background (set in produktion
   2026-09-22). The class it carried, size-3, is not in the purged bundle at
   all - it rendered as nothing, which is exactly the failure static/app.css
   is hand-committed to avoid. A declared width and height on the svg is what
   the flex container needs; flex:none keeps it from being squeezed as well. */
.activity{display:inline-flex;flex:none;align-items:center;gap:.3rem;padding:.1rem .45rem;border-radius:999px;
  font-size:.6875rem;font-weight:600;line-height:1rem;font-variant-numeric:tabular-nums;
  color:rgb(61 61 46/.55);background:rgb(61 61 46/.07);border-bottom:0}
.activity svg{width:.75rem;height:.75rem;flex:none}
.activity-old{color:#8a5a1e;background:rgb(180 120 40/.16)}

/* The small envelope button beside an order number. */
.iconbtn{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;
  height:1.75rem;border-radius:.5rem;color:rgb(61 61 46/.45);background:transparent;
  border:1px solid transparent;cursor:pointer}
.iconbtn:hover{color:#3d3d2e;background:rgb(61 61 46/.06);border-color:rgb(61 61 46/.12)}

/* The live draft of the customer mail on the compose screen. */
.mailpreview{width:100%;height:34rem;border:1px solid rgb(61 61 46/.12);border-radius:.75rem;
  background:#f5f0eb}
/* Eight of them on the drafts page, so they are shorter there. */
.mailpreview-sm{height:22rem}

/* Tabs on the follow-up report (static/js/tabs.js). The count sits in the tab
   itself: which pile is worth opening is the first thing the morning asks. */
.tabs{display:flex;flex-wrap:wrap;gap:.25rem;border-bottom:1px solid rgb(61 61 46/.12)}
.tab{display:inline-flex;align-items:center;gap:.5rem;margin-bottom:-1px;padding:.5rem .85rem;
  font-size:.875rem;font-weight:500;color:rgb(61 61 46/.55);background:transparent;border:0;
  border-bottom:2px solid transparent;cursor:pointer}
.tab:hover{color:#3d3d2e}
.tab[aria-selected=true]{color:#3d3d2e;border-bottom-color:#3d3d2e}
.tab-count{padding:.05rem .4rem;border-radius:999px;font-size:.75rem;font-weight:500;
  font-variant-numeric:tabular-nums;color:#3d3d2e;background:rgb(61 61 46/.08)}
.tab[aria-selected=true] .tab-count{background:rgb(61 61 46/.14)}
/* An empty pile keeps its tab - "0 over fristen" is an answer, and the row of
   tabs stays in the same place from day to day. It is dimmed so the eye still
   lands on the piles that hold something; selected, it looks like any other. */
.tab[data-empty]:not([aria-selected=true]){color:rgb(61 61 46/.35)}
.tab[data-empty]:not([aria-selected=true]) .tab-count{color:rgb(61 61 46/.5);
  background:rgb(61 61 46/.05)}
/* The customer-mail dialog. Written by hand, like every rule below the bundle:
   Tailwind is pre-built here, so a class that is not already in it renders as
   nothing. The dialog is a plain <dialog>; a browser without support falls back
   to an inline block, which still shows the form. */
.maildialog{width:min(76rem,calc(100vw - 2rem));max-height:calc(100vh - 4rem);padding:0;border:0;
  border-radius:.75rem;background:#fff;color:#3d3d2e;box-shadow:0 24px 60px rgb(61 61 46/.22)}
.maildialog::backdrop{background:rgb(61 61 46/.35)}
.maildialog form{display:flex;flex-direction:column;max-height:calc(100vh - 4rem)}
.maildialog-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1rem 1.25rem;border-bottom:1px solid rgb(61 61 46/.1)}
.maildialog-body{flex:1 1 auto;overflow-y:auto;padding:1.25rem}
.maildialog-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:.75rem;padding:1rem 1.25rem;border-top:1px solid rgb(61 61 46/.1);background:#f5f0eb}
.mailcards{display:flex;flex-direction:column;gap:.5rem;max-height:18rem;overflow-y:auto}
.mailcard{padding:.65rem .8rem;border:1px solid rgb(61 61 46/.1);border-radius:.5rem}
.mailcard-head{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.mailcard-tag{padding:.05rem .4rem;border-radius:999px;font-size:.75rem;
  color:#3d3d2e;background:rgb(61 61 46/.08)}
.mailcard-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));
  gap:.15rem .75rem;margin-top:.4rem;font-size:.8125rem}
.mailcard-body>div{display:flex;gap:.4rem}
.mailcard-label{min-width:5.5rem;color:rgb(61 61 46/.55)}
.mailcard-lines{margin-top:.4rem;padding-top:.4rem;border-top:1px solid rgb(61 61 46/.07);
  font-size:.8125rem;list-style:none}
.mailcard-lines li{display:flex;justify-content:space-between;gap:1rem}
/* Draft beside its preview from tablet up. Tailwind's md:grid-cols-2 is not in
   the bundle, so the two-column split is written out here. */
.draftgrid{display:grid;gap:1rem}
@media (min-width:768px){.draftgrid{grid-template-columns:1fr 1fr}}

/* Two columns in the dialog: what you write on the left, the mail it turns
   into on the right. The preview is the reason the dialog is wide - deciding
   whether a text reads right is a question about the mail, not about the
   textarea. Under 64rem there is no room for both, so they stack and the
   preview follows the fields. */
.maildialog-cols{flex:1 1 auto;overflow-y:auto;display:grid;grid-template-columns:1fr;
  gap:1.25rem;padding:1.25rem}
.maildialog-right{display:flex;flex-direction:column;gap:.5rem}
.previewhead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem}
.previewpick select{padding:.3rem .5rem;font-size:.8125rem}
.previewframe{flex:1 1 auto;min-height:26rem}
@media (min-width:64rem){
  .maildialog-cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr);overflow:hidden}
  .maildialog-left{overflow-y:auto;padding-right:.5rem}
  .previewframe{height:auto}
}

/* The follow-up report is ten columns wide and is read on a desktop. max-w-6xl
   left a third of a wide screen empty while the table scrolled sideways, which
   is the wrong trade: Varelinjer and Handlinger sit at the right edge and are
   where the morning's decisions are made. */
.reportwide{width:100%;max-width:min(104rem,100%)}

/* A long delivery method wraps rather than hiding behind a hover - it is text
   you read at a glance, not a detail you look up. */
.cell-wrap{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;
  -webkit-line-clamp:2;overflow:hidden}
.cell-flags{display:flex;flex-wrap:wrap;gap:.3rem;margin-bottom:.2rem}
.cell-flags .flag{margin-left:0}

/* The report's tables: one grid, not one per market.
   Each market is its own table, and with the browser's own auto layout every
   one of them measured its columns against its own rows - so the four tables
   stacked under a pile did not line up, and the widest of them pushed
   "Handlinger" past the edge of the panel. The widths are declared instead
   (see gridCols() in reports/opfoelgning.php), so every table of the same
   shape has the same columns whatever is in it. The min-width is what a narrow
   screen scrolls: crushing ten columns into a phone would be worse than the
   scrollbar the panel already has. */
.gridtable{table-layout:fixed;min-width:80rem}
.gridtable td,.gridtable th{overflow-wrap:break-word}

/* The small marker on a promise only half of which could be read. */
.flag{margin-left:.35rem;padding:.05rem .35rem;border-radius:999px;font-size:.6875rem;
  color:rgb(61 61 46/.6);background:rgb(61 61 46/.08)}

/* The two buttons in the Handlinger column. They wrap rather than widen the
   column: the table has to fit without scrolling sideways. */
.actions{display:flex;flex-wrap:wrap;gap:.35rem}
.btn-icon{display:inline-flex;align-items:center;gap:.35rem;white-space:nowrap}

/* The agreement dialog. Narrower than the mail dialog - it is two fields and a
   list, not a letter and its preview. */
.aftaledialog{width:min(36rem,calc(100vw - 2rem));max-height:calc(100vh - 3rem);padding:0;border:0;
  border-radius:1rem;background:#f5f0eb;color:#3d3d2e;
  box-shadow:0 1.5rem 3rem rgb(61 61 46/.25)}
.aftaledialog::backdrop{background:rgb(61 61 46/.35)}
.aftaledialog form{display:flex;flex-direction:column;max-height:calc(100vh - 3rem)}
.aftaledialog-body{flex:1 1 auto;overflow-y:auto;padding:1.25rem}

/* The trail: what was agreed before, newest first. */
.aftalelog{display:flex;flex-direction:column;gap:.5rem}
.aftalelog-item{padding:.5rem .75rem;border-radius:.5rem;background:rgb(61 61 46/.05)}
.aftalelog-head{display:flex;align-items:center;gap:.35rem;font-size:.875rem;font-weight:500}

/* Phones. The report is read on one in the morning, so the panels scroll
   sideways on their own while nothing else does, and both dialogs fill the
   screen instead of floating in the middle of it. */
@media (max-width:40rem){
  .maildialog,.aftaledialog{width:100vw;max-width:100vw;max-height:100dvh;height:100dvh;
    margin:0;border-radius:0}
  .maildialog form,.aftaledialog form{max-height:100dvh;height:100dvh}
  .maildialog-head,.maildialog-foot{padding-left:1rem;padding-right:1rem}
  .maildialog-foot{flex-direction:column;align-items:stretch;gap:.75rem}
  .maildialog-foot .btn{width:100%;justify-content:center}
  .maildialog-cols,.aftaledialog-body{padding:1rem}
  .previewframe{min-height:18rem}
  .bulkbar{position:sticky;bottom:0;z-index:5}
  .bulkbar .btn{width:100%;justify-content:center}
  .tabs{overflow-x:auto;flex-wrap:nowrap}
  /* The filter under the tabs rather than beside them, and spread across the
     width - on a phone there is no room for both on one line. */
  .reporttools{align-items:stretch}
  .reporttools-right{justify-content:space-between;padding-bottom:.5rem}
  /* Full screen width, so a long promise is readable on a phone. Uden scriptet
     lander boksen i bunden; med det sætter scriptet toppen selv. */
  .tip-body{position:fixed;left:1rem;right:1rem;top:auto;bottom:1rem;width:auto;max-width:none}
  .tip-body.tip-float{left:1rem;right:1rem;bottom:auto}
  .actions .btn-icon{flex:1 1 auto;justify-content:center}
}

/* The delivery menu on the follow-up report (static/js/delivery-filter.js).
   The button is the same pill as the view filter beside it; the menu is a
   white card that drops from its right edge, because the control sits at the
   right of the toolbar and would otherwise run off the panel. */
.dfilter{position:relative;display:inline-block}
.dfilter[hidden],.dfilter-menu[hidden]{display:none}
.dfilter-btn{display:inline-flex;align-items:center;gap:.45rem;max-width:22rem;padding:.4rem .6rem .4rem .75rem;
  border:0;border-radius:999px;background:rgb(61 61 46/.07);color:rgb(29 29 27/.7);font:inherit;
  font-size:.8125rem;font-weight:500;line-height:1.25rem;cursor:pointer;transition:background-color .15s,color .15s,box-shadow .15s}
.dfilter-btn:hover{background:rgb(61 61 46/.11);color:#3d3d2e}
.dfilter-btn:focus-visible{outline:2px solid #3d3d2e;outline-offset:2px}
.dfilter-btn[aria-expanded=true]{background:#fff;color:#3d3d2e;box-shadow:0 1px 2px rgb(61 61 46/.12),0 0 0 1px rgb(61 61 46/.12)}
.dfilter.is-filtered .dfilter-btn{background:#3d3d2e;color:#f5f0eb}
.dfilter.is-filtered .dfilter-btn:hover{background:#2e2e22;color:#fff}
.dfilter-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.dfilter-chevron{opacity:.6;transition:transform .15s}
.dfilter-btn[aria-expanded=true] .dfilter-chevron{transform:rotate(180deg)}
.dfilter-menu{position:absolute;right:0;top:calc(100% + .4rem);z-index:30;min-width:19rem;max-height:min(24rem,70vh);
  overflow-y:auto;margin:0;padding:.35rem;list-style:none;background:#fff;border-radius:.9rem;
  border:1px solid rgb(61 61 46/.1);box-shadow:0 12px 32px -8px rgb(29 29 27/.22),0 2px 6px rgb(29 29 27/.06);
  animation:dfilter-in .12s ease-out;outline:none}
@keyframes dfilter-in{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
.dfilter-head{padding:.55rem .6rem .25rem;font-size:.6875rem;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:rgb(29 29 27/.4)}
.dfilter-sep{height:1px;margin:.3rem .4rem;background:rgb(61 61 46/.1)}
.dfilter-opt{display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem;border-radius:.6rem;
  font-size:.875rem;color:rgb(29 29 27/.8);cursor:pointer;user-select:none}
.dfilter-opt.dfilter-sub{padding-left:1.1rem}
.dfilter-opt.is-active{background:rgb(61 61 46/.06);color:#1d1d1b}
.dfilter-opt[aria-selected=true]{color:#3d3d2e;font-weight:600}
.dfilter-ico{display:inline-flex;color:rgb(61 61 46/.5)}
.dfilter-opt[aria-selected=true] .dfilter-ico{color:#3d3d2e}
.dfilter-text{flex:1 1 auto;white-space:nowrap}
.dfilter-opt .viewcount{font-weight:500}
.dfilter-check{color:#3d3d2e;visibility:hidden}
.dfilter-opt[aria-selected=true] .dfilter-check{visibility:visible}
@media (max-width:40rem){
  .dfilter-btn{max-width:14rem}
  .dfilter-menu{position:fixed;left:1rem;right:1rem;top:auto;bottom:1rem;min-width:0;max-height:70dvh}
}

/* The note beside an agreed date on the follow-up report: a small notebook
   that opens who set which date, when, and why. Filled when the date in force
   carries a note - that is the one worth hovering for - and quiet otherwise. */
.agreenote{display:inline-flex;align-items:center;justify-content:center;width:1.6rem;height:1.6rem;
  border:1px solid transparent;border-bottom:1px solid transparent;border-radius:999px;cursor:pointer;
  color:rgb(61 61 46/.45);transition:background .15s,color .15s}
.agreenote>svg{width:.95rem;height:.95rem}
.agreenote:hover,.agreenote:focus-visible{color:#3d3d2e;background:rgb(61 61 46/.08);outline:0}
.agreenote:focus-visible{border-color:#3d3d2e}
.agreenote-on{color:#3d3d2e;background:rgb(61 61 46/.09)}
.agreenote-on::after{content:"";position:absolute;top:.1rem;right:.1rem;width:.45rem;height:.45rem;
  border-radius:999px;background:#b45309;box-shadow:0 0 0 2px #fff}
.agreenote-body{min-width:17rem;cursor:default}
.agreenote-body>strong{display:block;font-size:.75rem;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:rgb(61 61 46/.55)}
.tip-line>.agreenote-head,.agreenote-head{display:flex;flex-wrap:wrap;align-items:center;gap:.1rem;font-weight:600}
.agreenote-head .flag{font-weight:500}
.tip-line>.agreenote-text,.agreenote-text{display:block;margin:.2rem 0 .15rem;padding:.1rem 0 .1rem .55rem;
  border-left:2px solid rgb(61 61 46/.25);white-space:pre-line;color:#1d1d1b}
.agreenote-old .agreenote-head{font-weight:500;color:rgb(61 61 46/.7)}
.agreenote-old .agreenote-text{color:rgb(29 29 27/.65);border-left-color:rgb(61 61 46/.12)}
/* The order's own note from Shopify: Shopify's green instead of the olive, a
   tinted box instead of a quote line, and a green dot on the icon low where the
   dashboard's amber one sits high - somebody else's words, not ours. */
.agreenote-shop::before{content:"";position:absolute;bottom:.1rem;right:.1rem;width:.45rem;height:.45rem;
  border-radius:999px;background:#008060;box-shadow:0 0 0 2px #fff}
.agreenote-shop:not(.agreenote-on){color:#3d3d2e;background:rgb(0 128 96/.08)}
.shopnote{display:block;margin-top:.5rem;padding:.5rem .6rem;border-radius:.5rem;
  background:rgb(0 128 96/.06);border:1px solid rgb(0 128 96/.18)}
.agreenote-entry+.shopnote{margin-top:.6rem}
.agreenote-body>.shopnote:first-child{margin-top:0}
.shopnote>.shopnote-head,.shopnote-head{display:flex;align-items:center;gap:.3rem;font-size:.75rem;font-weight:600;
  letter-spacing:.04em;text-transform:uppercase;color:#006e52}
.shopnote>.shopnote-text,.shopnote-text{display:block;margin:.25rem 0;white-space:pre-line;color:#1d1d1b;
  overflow-wrap:anywhere}
.shopnote>.tip-sub,.shopnote .tip-sub{display:block;font-size:.75rem;color:rgb(29 29 27/.55)}
.shopnote-more{margin-left:.2rem;color:#006e52;text-decoration:underline;text-underline-offset:2px}
.shopnote-card{margin-top:.75rem}
.shopnote-card>.shopnote-text{max-height:9rem;overflow:auto}

/* Copies the link to the chosen delivery; only there when something is chosen. */
.dfilter-link{margin-left:.25rem;vertical-align:middle}
.dfilter-link[hidden]{display:none}
.dfilter-link.is-done{color:#006e52;background:rgb(0 128 96/.08)}

/* The "+" beside the report's filters: the one way onto the report for an
   order that is not on it yet. Solid, because it is an action and not a view. */
.addorder{display:inline-flex;align-items:center;gap:.3rem;height:2rem;padding:0 .8rem 0 .6rem;border:0;
  border-radius:999px;font-size:.8125rem;font-weight:500;cursor:pointer;color:#f5f0eb;background:#3d3d2e;
  box-shadow:0 1px 2px rgb(61 61 46/.2);transition:background .15s,transform .15s}
.addorder:hover{background:#2e2e22;color:#fff}
.addorder:active{transform:translateY(1px)}
.addorder:focus-visible{outline:2px solid #3d3d2e;outline-offset:2px}
.addorder[hidden]{display:none}

/* The "+" dialog (static/js/manual-order-dialog.js). One column while the
   order is being found and dated; it widens to take the mail preview beside
   it once "Skriv også til kunden" is on. */
.nyordre{width:min(38rem,calc(100vw - 2rem));transition:width .2s ease}
.nyordre.nyordre-wide{width:min(72rem,calc(100vw - 2rem))}
.nyordre-cols{flex:1 1 auto;overflow-y:auto;display:grid;grid-template-columns:minmax(0,1fr);gap:1.25rem;padding:1.25rem}
.nyordre-wide .nyordre-cols{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.nyordre-right{display:flex;flex-direction:column;gap:.35rem;min-height:0}
.nyordre-right[hidden]{display:none}
.previewsubject{font-size:.8125rem;color:rgb(61 61 46/.65);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.previewsubject:empty{display:none}

.lookup{display:flex;gap:.5rem}
.lookup-box{position:relative;flex:1 1 auto;display:flex;align-items:center}
.lookup-ico{position:absolute;left:.75rem;width:1.05rem;height:1.05rem;color:rgb(61 61 46/.45);pointer-events:none}
.lookup-input{width:100%;height:2.6rem;padding:0 2.4rem 0 2.35rem;border:1px solid rgb(61 61 46/.18);
  border-radius:.65rem;background:#fff;font-size:1rem;letter-spacing:.02em;font-variant-numeric:tabular-nums;
  color:#1d1d1b;transition:border-color .15s,box-shadow .15s}
.lookup-input::placeholder{color:rgb(61 61 46/.35);letter-spacing:0}
.lookup-input:focus{outline:0;border-color:#3d3d2e;box-shadow:0 0 0 3px rgb(61 61 46/.12)}
.lookup-input[readonly]{background:rgb(61 61 46/.04);font-weight:600}
.lookup-clear{position:absolute;right:.35rem;display:inline-flex;align-items:center;justify-content:center;
  width:1.9rem;height:1.9rem;border:0;border-radius:999px;background:transparent;color:rgb(61 61 46/.5);cursor:pointer}
.lookup-clear:hover{background:rgb(61 61 46/.08);color:#3d3d2e}
.lookup-clear[hidden]{display:none}
.lookup .btn{height:2.6rem;white-space:nowrap}
.lookup .btn[hidden]{display:none}
.lookup-msg{display:flex;align-items:center;gap:.5rem;margin-top:.5rem;font-size:.8125rem;color:rgb(61 61 46/.65)}
.lookup-msg[hidden]{display:none}
.lookup-msg[data-tone=error]{color:#b91c1c}
.lookup-msg[data-tone=busy]::before{content:"";flex:none;width:.9rem;height:.9rem;border-radius:999px;
  border:2px solid rgb(61 61 46/.2);border-top-color:#3d3d2e;animation:nyordre-spin .7s linear infinite}
@keyframes nyordre-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.lookup-msg[data-tone=busy]::before{animation:none}.nyordre{transition:none}}

.nyordre-card{background:#fff;animation:nyordre-in .18s ease-out}
@keyframes nyordre-in{from{opacity:0;transform:translateY(4px)}}
.nyordre-name{font-weight:600;color:#1d1d1b;text-decoration:underline;text-decoration-color:rgb(61 61 46/.3);
  text-underline-offset:3px}
.nyordre-name:hover{text-decoration-color:#3d3d2e}
.nyordre-hint{margin-top:.5rem;padding:.4rem .6rem;border-radius:.45rem;font-size:.8125rem;
  color:#8a5a1e;background:rgb(180 120 40/.12)}
.nyordre-trail{margin-top:.5rem;padding-top:.5rem;border-top:1px solid rgb(61 61 46/.07);font-size:.8125rem}
.nyordre-trail-head{margin-bottom:.15rem;font-size:.6875rem;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:rgb(61 61 46/.5)}
.nyordre-trail .agreenote-entry{display:flex;flex-direction:column;padding:.3rem 0}
.nyordre-trail .agreenote-entry+.agreenote-entry{border-top:1px solid rgb(61 61 46/.06)}

.nyordre-step{margin-top:1.25rem;animation:nyordre-in .18s ease-out}
.nyordre-step[hidden]{display:none}

/* "Skriv også til kunden": a switch, because it opens half the dialog. */
.notify{display:flex;align-items:flex-start;gap:.7rem;margin-top:1rem;padding:.7rem .8rem;border-radius:.65rem;
  border:1px solid rgb(61 61 46/.1);background:#fff;cursor:pointer;transition:border-color .15s}
.notify:hover{border-color:rgb(61 61 46/.25)}
.notify.is-off{cursor:not-allowed;opacity:.65}
.notify-input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.notify-switch{position:relative;flex:none;width:2.2rem;height:1.25rem;margin-top:.1rem;border-radius:999px;
  background:rgb(61 61 46/.2);transition:background .15s}
.notify-switch::after{content:"";position:absolute;top:.15rem;left:.15rem;width:.95rem;height:.95rem;
  border-radius:999px;background:#fff;box-shadow:0 1px 2px rgb(0 0 0/.2);transition:transform .15s}
.notify-input:checked+.notify-switch{background:#3d3d2e}
.notify-input:checked+.notify-switch::after{transform:translateX(.95rem)}
.notify-input:focus-visible+.notify-switch{outline:2px solid #3d3d2e;outline-offset:2px}
.notify-text{display:flex;flex-direction:column;font-size:.875rem;line-height:1.35}
.notify-sub{font-size:.8125rem;color:rgb(61 61 46/.55);overflow-wrap:anywhere}

.linkbtn{display:inline-flex;flex:none;align-items:center;gap:.3rem;white-space:nowrap;padding:.2rem .45rem;border:0;border-radius:.4rem;
  background:transparent;font-size:.8125rem;font-weight:500;color:#3d3d2e;cursor:pointer}
.linkbtn:hover{background:rgb(61 61 46/.08)}
.linkbtn:disabled{color:rgb(61 61 46/.35);background:transparent;cursor:default}

.confirmrow{display:flex;align-items:center;gap:.5rem}
.confirmrow[hidden]{display:none}
.saveico{display:inline-flex}
.saveico[hidden]{display:none}
.nyordre .btn-primary:disabled{opacity:.45;cursor:not-allowed}
.nyordre.is-loading .lookup-input,.nyordre form.is-loading .lookup-input{opacity:.7}

/* Below a laptop the preview goes under the message rather than squeezing it. */
@media (max-width:60rem){
  .nyordre-wide .nyordre-cols{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:40rem){
  .nyordre,.nyordre.nyordre-wide{width:100vw}
  .nyordre-wide .nyordre-cols{grid-template-columns:minmax(0,1fr)}
  .nyordre-cols{padding:1rem}
  .lookup{flex-direction:column}
  .addorder span{display:none}
  .addorder{width:2rem;padding:0;justify-content:center}
}
.nyordre-left{min-width:0}
.agreenote-empty{font-style:italic}

/* Users admin: access per area. */
.form-row{grid-column:1/-1}
.form-actions{display:flex;justify-content:flex-end;gap:.5rem}
.areas{border:0;margin:0;padding:0;min-width:0}
.areas-pick{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.areas-pick[hidden],.areas-all[hidden]{display:none}
.area-chip{position:relative;display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .75rem;border:1px solid rgb(61 61 46/.18);
  border-radius:999px;background:#fff;font-size:.8125rem;color:rgb(61 61 46/.8);cursor:pointer;user-select:none;
  transition:background-color .15s,border-color .15s,color .15s}
.area-chip:hover{border-color:rgb(61 61 46/.4)}
.area-chip input{accent-color:#3d3d2e;margin:0}
.area-chip:has(input:checked){background:#3d3d2e;border-color:#3d3d2e;color:#fff}
.area-chip:has(input:checked) input{accent-color:#fff}
.area-chip:has(input:focus-visible){outline:2px solid #3d3d2e;outline-offset:2px}
.areas-hint{margin-left:.25rem}
.area-tags{display:flex;flex-wrap:wrap;gap:.25rem;max-width:16rem}
.area-tag{display:inline-block;padding:.15rem .5rem;border-radius:999px;background:rgb(61 61 46/.07);font-size:.75rem;color:rgb(61 61 46/.75);white-space:nowrap}

/* Access denied page. */
.denied{max-width:32rem;margin:4rem auto;padding:0 1rem;text-align:center}
.denied-icon{display:inline-grid;place-items:center;width:3rem;height:3rem;border-radius:999px;background:rgb(61 61 46/.07);color:#3d3d2e;margin-bottom:1rem}
/* Not in the purged bundle; the grey "off" dots on the users page use it. */
.bg-ink\/20{background-color:rgba(29,29,27,.2)}
/* admin/brugere: the Adgang column. One line per state, never wrapped. */
.access{display:inline-flex;align-items:center;gap:.375rem;padding:.2rem .625rem;border-radius:999px;font-size:.75rem;line-height:1.25rem;white-space:nowrap}
.access-all{background:#e7e4d6;color:#3d3d2e}
.access-none{background:rgb(29 29 27/.05);color:rgb(29 29 27/.45)}
.area-tags{max-width:18rem}
@media (min-width:1280px){.xl\:table-cell{display:table-cell}}
/* admin/brugere: welcome mail on "Tilføj bruger". */
.welcome{display:grid;gap:1rem;padding-top:1.25rem;border-top:1px solid rgb(29 29 27/.07)}
.welcome-toggle{display:flex;align-items:flex-start;gap:.75rem;cursor:pointer;width:fit-content}
.welcome-toggle input{margin-top:.2rem;width:1rem;height:1rem;accent-color:#3d3d2e;flex-shrink:0}
.welcome-toggle-title{display:block;font-size:.875rem;font-weight:500;color:#1d1d1b}
.welcome-toggle-hint{display:block;font-size:.75rem;color:rgb(29 29 27/.5)}
.welcome-body{display:grid;gap:1.25rem;align-items:start}
.welcome-body[hidden]{display:none}
@media (min-width:1024px){.welcome-body{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}}
.welcome-textarea{min-height:9rem;resize:vertical;line-height:1.55}
.welcome-preview{border:1px solid rgb(29 29 27/.1);border-radius:.875rem;overflow:hidden;background:#f5f0eb;box-shadow:0 1px 2px rgb(29 29 27/.04)}
.welcome-preview-bar{display:flex;align-items:center;gap:.75rem;padding:.55rem .85rem;background:#fff;border-bottom:1px solid rgb(29 29 27/.08);font-size:.75rem;color:rgb(29 29 27/.6);min-width:0}
.welcome-preview-subject{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;color:#1d1d1b}
.welcome-preview-dots{display:flex;gap:.3rem;flex-shrink:0}
.welcome-preview-dots i{width:.5rem;height:.5rem;border-radius:999px;background:rgb(29 29 27/.12)}
.welcome-frame{display:block;width:100%;height:36rem;border:0;background:#f5f0eb}
/* Follow-up report: the activity hover. Every line says what kind of action it
   was - a mail to the customer or a note from the office - before what it said. */
.act-line{display:flex;align-items:flex-start;gap:.55rem;min-width:15rem}
.act-kind{display:inline-flex!important;align-items:center;gap:.25rem;flex:none;margin-top:.1rem;padding:.05rem .4rem;border-radius:999px;font-size:.6875rem;font-weight:600;letter-spacing:.02em;line-height:1.3rem}
.act-kind svg{width:.7rem;height:.7rem;flex:none}
.act-mail{background:#e3ecf5;color:#28507a}
.act-note{background:#efe9d9;color:#6b5a2a}
.act-text{display:flex!important;flex-direction:column;min-width:0}
.act-detail{font-style:italic;color:rgb(61 61 46/.75);overflow-wrap:anywhere}
.act-more{display:block;margin-top:.6rem;padding-top:.45rem;border-top:1px solid rgb(61 61 46/.07);font-size:.75rem;font-weight:500;color:#3d3d2e;text-decoration:underline;text-underline-offset:2px}
/* reports/opfoelgning-mails: the sent mails as a timeline, grouped by day. */
.mh-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-bottom:1.75rem}
@media (min-width:640px){.mh-stats{grid-template-columns:repeat(4,minmax(0,1fr))}}
.mh-stat{display:flex;flex-direction:column;gap:.1rem;padding:.9rem 1rem;border-radius:1rem;background:#fff;box-shadow:0 0 0 1px rgba(29,29,27,.06)}
.mh-stat-n{font-size:1.6rem;font-weight:600;line-height:1.1;color:#1d1d1b;font-variant-numeric:tabular-nums}
.mh-stat-l{font-size:.75rem;color:rgb(29 29 27/.5)}
.mh-search{position:sticky;top:4.5rem;z-index:10;display:flex;align-items:center;gap:.6rem;margin-bottom:1.5rem;padding:.55rem .9rem;border-radius:999px;background:#fff;color:rgb(29 29 27/.45);box-shadow:0 0 0 1px rgba(29,29,27,.1),0 6px 20px rgb(61 61 46/.06)}
.mh-search-input{flex:1 1 auto;min-width:0;border:0;outline:0;background:transparent;font-size:.875rem;color:#1d1d1b}
.mh-search-count{flex:none;font-size:.75rem;font-variant-numeric:tabular-nums}
.mh-noresult{padding:2rem 0;text-align:center;font-size:.875rem;color:rgb(29 29 27/.5)}
.mh-noresult[hidden],.mh-day[hidden],.mh-item[hidden]{display:none}
.mh-empty{padding:3rem 1.5rem;text-align:center}
.mh-empty-icon{display:inline-grid;place-items:center;width:3rem;height:3rem;margin-bottom:.75rem;border-radius:999px;background:#e3ecf5;color:#28507a}
.mh-day{margin-bottom:2rem}
.mh-day-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.75rem;font-size:.875rem;font-weight:600;color:#1d1d1b}
.mh-day-n{font-size:.75rem;font-weight:400;color:rgb(29 29 27/.45)}
.mh-list{position:relative;margin:0;padding:0 0 0 2.25rem;list-style:none}
.mh-list:before{content:"";position:absolute;left:.8rem;top:.5rem;bottom:.5rem;width:2px;border-radius:2px;background:rgb(61 61 46/.1)}
.mh-item{position:relative}
.mh-item+.mh-item{margin-top:.75rem}
.mh-dot{position:absolute;left:-2.25rem;top:.85rem;display:grid;place-items:center;width:1.65rem;height:1.65rem;border-radius:999px;background:#e3ecf5;color:#28507a;box-shadow:0 0 0 4px #f5f0eb}
.mh-dot svg{width:.8rem;height:.8rem}
.mh-card{padding:.9rem 1.1rem;border-radius:1rem;background:#fff;box-shadow:0 0 0 1px rgba(29,29,27,.06);transition:box-shadow .15s}
.mh-card:hover{box-shadow:0 0 0 1px rgba(29,29,27,.1),0 8px 24px rgb(61 61 46/.08)}
.mh-card-head{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.mh-order{font-weight:600;color:#3d3d2e;text-decoration:none}
a.mh-order:hover{text-decoration:underline}
.mh-customer{font-size:.8125rem;color:rgb(29 29 27/.6)}
.mh-status{padding:.05rem .45rem;border-radius:999px;font-size:.6875rem;font-weight:500;background:rgb(180 120 40/.14);color:#8a5a1e}
.mh-status-done{background:rgb(60 130 80/.13);color:#2f6b3f}
.mh-time{margin-left:auto;font-size:.8125rem;font-variant-numeric:tabular-nums;color:rgb(29 29 27/.5)}
.mh-subject{margin-top:.5rem;font-size:.9375rem;font-weight:500;color:#1d1d1b;overflow-wrap:anywhere}
.mh-msg{margin-top:.35rem;font-size:.8125rem;line-height:1.55;color:rgb(29 29 27/.65)}
.mh-msg summary{cursor:pointer;list-style:none}
.mh-msg summary::-webkit-details-marker{display:none}
.mh-msg summary:after{content:" Vis hele";font-weight:500;color:#3d3d2e;text-decoration:underline;text-underline-offset:2px}
.mh-msg[open] summary:after{content:" Skjul"}
.mh-msg[open] .mh-msg-excerpt{display:none}
.mh-msg-full{margin-top:.25rem;padding:.6rem .75rem;border-left:3px solid #e3ecf5;border-radius:.25rem;background:#faf8f5;color:#3d3d2e;overflow-wrap:anywhere}
.mh-card-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem;margin-top:.75rem;padding-top:.6rem;border-top:1px solid rgb(61 61 46/.07)}
.mh-meta{font-size:.75rem;color:rgb(29 29 27/.5)}
.mh-meta strong{font-weight:500;color:rgb(29 29 27/.75)}
.mh-open{display:inline-flex;align-items:center;gap:.2rem;padding:.3rem .5rem .3rem .75rem;border-radius:999px;font-size:.8125rem;font-weight:500;color:#3d3d2e;background:rgb(61 61 46/.06);transition:background-color .15s}
.mh-open:hover{background:rgb(61 61 46/.12)}
.mh-legacy{display:flex;align-items:center;gap:.4rem;margin-top:.6rem;font-size:.75rem;color:rgb(29 29 27/.5)}
/* The dialog: facts and delivery events beside the mail as it was sent. */
.mhview{width:min(64rem,calc(100vw - 2rem))}
.mhview-inner{display:flex;flex-direction:column;max-height:calc(100vh - 4rem)}
.mhview-kicker{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;color:rgb(29 29 27/.55)}
.mhview-title{margin-top:.25rem;font-size:1.125rem;font-weight:500;overflow-wrap:anywhere}
.mhview-body{flex:1 1 auto;display:grid;grid-template-columns:1fr;min-height:0;overflow-y:auto}
@media (min-width:768px){.mhview-body{grid-template-columns:16rem minmax(0,1fr);overflow:hidden}}
.mhview-side{padding:1.1rem 1.25rem;background:#faf8f5;border-bottom:1px solid rgb(61 61 46/.08);overflow-y:auto}
@media (min-width:768px){.mhview-side{border-bottom:0;border-right:1px solid rgb(61 61 46/.08)}}
.mhview-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.3rem .75rem;margin:0 0 1.1rem;font-size:.8125rem}
.mhview-facts dt{color:rgb(29 29 27/.5)}
.mhview-facts dd{margin:0;overflow-wrap:anywhere}
.mhview-label{margin-bottom:.5rem;font-size:.6875rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgb(29 29 27/.45)}
.mhview-events{position:relative;margin:0;padding:0 0 0 1.1rem;list-style:none;font-size:.8125rem}
.mhview-events:before{content:"";position:absolute;left:.3rem;top:.4rem;bottom:.4rem;width:2px;background:rgb(61 61 46/.1)}
.mhview-ev{position:relative;display:flex;flex-direction:column}
.mhview-ev+.mhview-ev{margin-top:.6rem}
.mhview-ev:before{content:"";position:absolute;left:-1.05rem;top:.35rem;width:.55rem;height:.55rem;border-radius:999px;background:#2f6b3f;box-shadow:0 0 0 3px #faf8f5}
.mhview-ev-bad:before{background:#b3261e}
.mhview-ev-bad .mhview-ev-what{color:#b3261e}
.mhview-ev-when,.mhview-hint{font-size:.75rem;color:rgb(29 29 27/.5)}
.mhview-hint{margin-top:.75rem}
.mhview-main{display:flex;flex-direction:column;min-height:0;background:#f5f0eb}
.mhview-state{padding:2.5rem 1.5rem;text-align:center;font-size:.875rem;color:rgb(29 29 27/.55)}
.mhview-state[hidden],.mhview-frame[hidden],.mhview-fallback[hidden]{display:none}
.mhview-frame{flex:1 1 auto;width:100%;min-height:32rem;border:0;background:#f5f0eb}
.mhview-fallback{margin:0 1.25rem 1.25rem;padding:1rem 1.1rem;border-radius:.75rem;background:#fff}
.mhview-fallback-text{white-space:pre-wrap;font-size:.875rem;line-height:1.6}
/* admin/mail-tidslinje: before -> after for each rewritten timeline line */
.tl-change{margin-top:.6rem;padding-left:.75rem;border-left:2px solid #e8e1d8;font-size:.75rem;line-height:1.5;overflow-wrap:anywhere}
.tl-from{color:rgb(29 29 27/.45);text-decoration:line-through;text-decoration-color:rgb(29 29 27/.25)}
.tl-to{margin-top:.2rem;color:#3d3d2e}
.tl-new{margin-left:.25rem;padding:0 .35rem;border-radius:9999px;background:#e6efe3;color:#3f6b35;font-size:.6875rem;font-weight:500}

/* The follow-up report's rows, made to be scanned across.
   Every cell starts at the top, so the order number, the dates and the first
   line of the delivery sit on one line however tall the row grows; a row lights
   up under the mouse, so the eye does not slip a row on its way to Handlinger;
   figures are tabular, so dates stack in columns. The headers are a size down
   and a weight up, set apart from the rows they head - not in capitals, which
   are a third wider and broke "Afhentning/levering" over two lines. The two
   buttons in Handlinger are a size down too, so they fit side by side instead
   of stacking into a row twice the height of the rest. */
.gridtable thead th{font-size:.75rem;font-weight:600;letter-spacing:.01em;
  vertical-align:bottom;padding-top:.7rem;padding-bottom:.6rem}
.gridtable .actions .btn{padding:.3rem .55rem;font-size:.8125rem;line-height:1.1rem}
.gridtable tbody td{vertical-align:top;padding-top:.7rem;padding-bottom:.7rem;font-variant-numeric:tabular-nums}
.gridtable tbody tr{transition:background-color .12s}
.gridtable tbody tr:hover{background:rgb(61 61 46/.035)}
.gridtable td input[type=checkbox]{margin-top:.2rem}
/* The order number: what the eye looks for first, so a step up from the row. */
.ordernum{font-size:.9375rem;font-weight:600;line-height:1.35rem}

/* A hover you can reach. The box floats a few pixels off its trigger, and the
   mouse crossing that gap left both - the box closed before it was reached.
   This invisible margin around the box covers the gap whichever side the box
   opened on, and static/js/tooltips.js keeps it open a moment after the mouse
   leaves (.tip-open), so a link in it can be clicked. */
.tip-body::before{content:"";position:absolute;left:-.5rem;right:-.5rem;top:-.75rem;bottom:-.75rem;z-index:-1}
.tip.tip-open>.tip-body{display:block}

/* The agreed date, as the button that changes it (actionsCell()). A soft pill
   in the row's own ink while the date is ahead; amber on the day, red once it
   has passed - the one thing in the column that should catch the eye. */
.agreedbtn{font-weight:500;color:#3d3d2e;background:rgb(61 61 46/.09)}
.agreedbtn:hover{background:rgb(61 61 46/.15)}
.agreedbtn-today{color:#8a5a1e;background:rgb(180 120 40/.18)}
.agreedbtn-today:hover{background:rgb(180 120 40/.26)}
.agreedbtn-late{color:#a1261b;background:rgb(200 50 40/.12)}
.agreedbtn-late:hover{background:rgb(200 50 40/.2)}
.actions{align-items:center}