:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#18313d;background:#f5f8f8;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100vh;display:flex;flex-direction:column}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2.15rem,4vw,3.2rem);line-height:1.08;letter-spacing:-.045em;margin-bottom:.6rem}h2{font-size:1.2rem;letter-spacing:-.02em}h3{font-size:1rem}.muted{color:#607681;line-height:1.55}.eyebrow{color:#1b8b91;text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:800;margin-bottom:.7rem}
.site-header{background:#fff;border-bottom:1px solid #e0e9ea}.header-inner{max-width:1200px;margin:auto;padding:1rem 1.5rem;display:flex;align-items:center;gap:2.2rem;min-height:80px}.brand{display:flex;align-items:center;gap:.75rem;white-space:nowrap}.brand span:last-child{display:flex;flex-direction:column;line-height:1.1}.brand strong{font-size:1.12rem;letter-spacing:-.035em}.brand small{font-size:.7rem;color:#66808b;margin-top:.2rem}.brand-mark{width:38px;height:38px;border:8px solid #1a7981;border-radius:50%;position:relative;box-shadow:0 0 0 3px #d9f0ed inset}.brand-mark:after{content:"";position:absolute;width:7px;height:7px;background:#1a7981;border-radius:50%;left:7px;top:7px}.main-nav{display:flex;align-items:center;gap:.3rem}.main-nav a{font-size:.9rem;font-weight:650;color:#536c76;padding:.72rem .85rem;border-radius:.55rem}.main-nav a:hover,.main-nav a[aria-current=page]{background:#e8f4f2;color:#116a70}.header-actions{margin-left:auto;display:flex;align-items:center;gap:.35rem}.logout-form button{border:0;background:none;color:#647984;font-weight:650;padding:.65rem}.logout-form button:hover{color:#0f636b}.language-switch{position:relative}.language-switch summary{list-style:none;display:flex;align-items:center;gap:.35rem;padding:.55rem .65rem;border-radius:.5rem;color:#536c76;font-size:.8rem;font-weight:750;cursor:pointer}.language-switch summary::-webkit-details-marker{display:none}.language-switch summary:hover,.language-switch[open] summary{background:#e8f4f2;color:#116a70}.language-switch summary:focus-visible{outline:3px solid #19868a;outline-offset:2px}.language-switch form{position:absolute;z-index:30;right:0;top:calc(100% + .3rem);min-width:145px;padding:.3rem;background:#fff;border:1px solid #cbdadd;border-radius:.65rem;box-shadow:0 12px 32px #1d485025}.language-switch form button{display:block;width:100%;text-align:left;border:0;border-radius:.4rem;background:none;color:#264550;padding:.55rem .65rem;font-size:.85rem}.language-switch form button:hover,.language-switch form button[aria-current=true]{background:#e8f4f2;color:#116a70}
.page-shell{width:min(1200px,100%);margin:0 auto;padding:2.4rem 1.5rem 5rem;flex:1}.site-footer{text-align:center;padding:1.6rem;color:#879aa1;font-size:.78rem}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;margin-bottom:1.8rem}.page-heading .muted{margin-bottom:0}.page-heading.compact{margin-bottom:1rem}.detail-heading{margin-top:.7rem}.back-link{display:inline-block;color:#477b85;font-weight:650;font-size:.9rem}.back-link:hover{text-decoration:underline}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border-radius:.7rem;padding:.78rem 1.05rem;font-weight:700;font-size:.9rem;line-height:1.25;border:1px solid transparent;white-space:nowrap;transition:background .15s,color .15s,transform .15s}.button:hover{transform:translateY(-1px)}.button.primary{background:#146f75;color:#fff}.button.primary:hover{background:#0b5b61}.button.secondary{background:#fff;color:#176f75;border-color:#cbdfe0}.button.secondary:hover{background:#eaf5f4}.button.quiet{background:#eef3f4;color:#48636f}.button.danger{background:#fff1ee;color:#a84435;border-color:#f1c7bd}.button.danger:hover{background:#fce5df}.button.full{width:100%}.subtle-link{color:#16747a;font-size:.87rem;font-weight:700}.subtle-link:hover{text-decoration:underline}
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.7rem}.metrics.two{grid-template-columns:repeat(2,1fr)}.metric{background:#eaf4f3;border:1px solid #d7e9e6;border-radius:1rem;padding:1.25rem 1.45rem;display:flex;flex-direction:column;min-height:112px}.metric span{font-size:.83rem;color:#4f6e75;font-weight:650}.metric strong{font-size:2.2rem;line-height:1.15;letter-spacing:-.055em;margin-top:.32rem;color:#164e56}.metric small{color:#67838a;font-size:.72rem}
.panel{background:#fff;border:1px solid #e1eaeb;border-radius:1rem;box-shadow:0 8px 28px #1d485008;padding:1.3rem}.panel-topline,.panel-title{display:flex;align-items:center;justify-content:space-between;gap:1rem}.panel-title h2{margin:0}.panel-topline{margin-bottom:1.2rem}.tabs{display:flex;gap:.28rem;background:#f1f6f6;padding:.25rem;border-radius:.7rem}.tabs a{padding:.58rem .85rem;border-radius:.5rem;font-weight:700;font-size:.82rem;color:#5a737e}.tabs a[aria-current=page]{background:#fff;color:#155f67;box-shadow:0 2px 8px #164e5615}
.filters{display:grid;grid-template-columns:minmax(200px,1.7fr) repeat(3,minmax(135px,1fr)) auto;gap:.7rem;align-items:end}.filters label,.field{display:flex;flex-direction:column;gap:.35rem}.filters label span,.field label,.finish-box label,.login-form label{font-size:.76rem;font-weight:750;color:#4b6670}.filters input,.filters select,.form-control,.finish-box select{width:100%;min-width:0;min-height:42px;border:1px solid #cbdadd;border-radius:.55rem;background:#fff;color:#18313d;padding:.58rem .7rem;outline:none}.filters input:focus,.filters select:focus,.form-control:focus,.finish-box select:focus{border-color:#19868a;box-shadow:0 0 0 3px #19868a20}.filters .button{min-height:42px}.results-heading{margin:1.8rem 0 .75rem}.results-heading h2{font-size:.9rem;color:#536d76;margin:0}
.spool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}.spool-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e0e8ea;border-radius:.95rem;padding:1.2rem 1.25rem;min-height:182px;box-shadow:0 5px 18px #1d485006;transition:border-color .15s,transform .15s,box-shadow .15s}.spool-card:hover{border-color:#86bec0;box-shadow:0 12px 25px #1d485015;transform:translateY(-2px)}.card-top,.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:.6rem}.spool-id{font-size:.75rem;font-weight:800;color:#477b85;letter-spacing:.04em}.status{display:inline-block;border-radius:999px;padding:.28rem .55rem;font-size:.69rem;font-weight:800;color:#16736d;background:#e0f4ee;white-space:nowrap}.status.finished{color:#896e60;background:#f5eee9}.spool-card h3{font-size:1.17rem;line-height:1.2;margin:1.25rem 0 .3rem;letter-spacing:-.03em}.spool-card p{font-size:.85rem;color:#647b83;line-height:1.35;margin-bottom:1.2rem}.card-bottom{margin-top:auto;border-top:1px solid #edf1f1;padding-top:.8rem}.card-bottom span{font-size:.75rem;color:#779099}.card-bottom strong{font-size:.95rem}.empty-state{text-align:center;background:#fff;border:1px dashed #bbd3d5;border-radius:1rem;padding:3.5rem 1rem}.empty-state h2{margin-bottom:.4rem}.empty-state p{color:#72868f}.pagination{display:flex;align-items:center;justify-content:center;gap:1.5rem;margin-top:1.5rem;font-size:.85rem;font-weight:700}.pagination a{color:#157078}.pagination span{color:#738b92}
.narrow-page{max-width:760px;margin:auto}.edit-form{padding:1.65rem}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}.field.wide{grid-column:1/-1}.field-error,.form-errors{color:#a53d34;font-size:.8rem}.field-error ul,.form-errors ul{padding-left:1.2rem;margin:.25rem 0}.form-errors{background:#fff0ed;border:1px solid #f2c5bd;padding:.8rem 1rem;border-radius:.55rem;margin-bottom:1rem}.form-note{color:#6b818a;font-size:.83rem;line-height:1.5;margin:1.35rem 0}.form-actions{display:flex;gap:.6rem}.detail-grid{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr);gap:1rem;align-items:start}.detail-panel,.history-panel{padding:1.5rem}.weight-display{padding:2rem 0 1.4rem;border-bottom:1px solid #e9eeee;display:flex;align-items:baseline;gap:.6rem}.weight-display strong{font-size:3.4rem;letter-spacing:-.07em;line-height:1;color:#155f66}.weight-display span{color:#6d858c;font-size:.85rem}.detail-list{margin:0}.detail-list div{display:flex;justify-content:space-between;gap:1rem;padding:.85rem 0;border-bottom:1px solid #eef2f2}.detail-list dt{color:#6e848d;font-size:.83rem}.detail-list dd{margin:0;font-weight:650;font-size:.85rem;text-align:right}.finish-box{background:#fcf9f6;border:1px solid #eee5dd;padding:1rem;border-radius:.75rem;margin-top:1.5rem}.finish-box h3{margin-bottom:.25rem}.finish-box p{color:#7f7770;font-size:.8rem;line-height:1.5}.finish-box form{display:flex;flex-direction:column;gap:.55rem}.finish-box .button{margin-top:.4rem;width:fit-content}
.timeline{list-style:none;padding:0;margin:1.2rem 0 0}.timeline li{display:flex;gap:.8rem;position:relative;padding-bottom:1.1rem}.timeline li:not(:last-child):before{content:"";position:absolute;left:.34rem;top:.9rem;bottom:0;width:1px;background:#dce8e8}.event-dot{width:.75rem;height:.75rem;background:#1d9090;border:3px solid #dff4f0;border-radius:50%;flex:none;margin-top:.2rem;position:relative;z-index:1}.event-body{flex:1;min-width:0}.event-header{display:flex;justify-content:space-between;gap:.8rem;align-items:baseline}.event-header strong{font-size:.84rem}.event-header time{white-space:nowrap;color:#81959b;font-size:.72rem}.event-change{font-size:.82rem;color:#34515c;margin:.3rem 0}.event-change span{color:#7a8f98}.reason{display:inline-block;background:#eff5f5;color:#5a777f;border-radius:.35rem;padding:.18rem .4rem;font-size:.68rem;font-weight:700}.event-spool{color:#16747a;font-size:.72rem;font-weight:800;margin-left:.5rem}.journal-panel{max-width:900px;margin:auto;padding:1.5rem}
.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.panel-note{font-size:.79rem;color:#758a91;line-height:1.45;margin:.7rem 0}.table-wrap{overflow-x:auto;margin-top:.85rem}table{width:100%;border-collapse:collapse;font-size:.83rem}th,td{text-align:left;padding:.72rem .5rem;border-bottom:1px solid #eef2f2}thead th{color:#778a91;font-size:.7rem;text-transform:uppercase;letter-spacing:.07em}td:not(:first-child),thead th:not(:first-child){text-align:right}tbody th{font-weight:700}tbody th small{display:block;font-weight:400;color:#8a9ba1;line-height:1.35;margin-top:.18rem}.panel.spaced{margin-top:1rem}.login-wrap{min-height:calc(100vh - 230px);display:grid;grid-template-columns:1fr 420px;align-items:center;gap:5rem;max-width:1000px;margin:auto}.login-intro h1{max-width:550px}.login-intro p:last-child{color:#607681;line-height:1.6;max-width:430px}.login-form{padding:2rem}.login-form h2{font-size:1.45rem;margin-bottom:1.5rem}.login-form label{display:block;margin:.95rem 0 .35rem}.login-form .button{margin-top:1.4rem}
.messages{margin-bottom:1.2rem}.message{border-radius:.6rem;padding:.8rem 1rem;font-size:.85rem;font-weight:650;margin-bottom:.4rem;background:#e9f7ef;color:#286149}.message.error{background:#fff0ed;color:#9b4035}.message.info{background:#eaf3fa;color:#3d6283}
.journal-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid #e9eeee;padding-bottom:.8rem}.journal-toolbar .muted{font-size:.78rem;margin:0}
@media(max-width:980px){.filters{grid-template-columns:repeat(2,1fr)}.filters .search-field{grid-column:1/-1}.spool-grid{grid-template-columns:repeat(2,1fr)}.summary-grid{grid-template-columns:1fr}.login-wrap{gap:2rem;grid-template-columns:1fr 360px}}
@media(max-width:700px){.header-inner{flex-wrap:wrap;gap:.65rem;padding:.8rem 1rem}.brand{margin-right:auto}.main-nav{order:3;width:100%;overflow:auto;border-top:1px solid #edf1f1;padding-top:.45rem}.main-nav a{flex:1;text-align:center}.page-shell{padding:1.5rem 1rem 3rem}.page-heading{align-items:flex-start;flex-direction:column;gap:1rem}.page-heading .button{width:100%}.metrics{gap:.5rem}.metric{padding:.85rem;min-height:96px}.metric strong{font-size:1.7rem}.metric span{font-size:.73rem}.metric small{font-size:.65rem}.panel{padding:1rem}.panel-topline{align-items:flex-start;flex-direction:column}.filters{grid-template-columns:1fr 1fr}.spool-grid{grid-template-columns:1fr}.spool-card{min-height:145px}.spool-card h3{margin:.85rem 0 .3rem}.detail-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.wide{grid-column:auto}.login-wrap{grid-template-columns:1fr;gap:1rem;min-height:auto}.login-intro h1{font-size:2.2rem}.login-form{padding:1.4rem}}
@media(max-width:420px){.filters{grid-template-columns:1fr}.filters .search-field{grid-column:auto}.metrics{grid-template-columns:1fr 1fr}.metrics .metric:last-child{grid-column:1/-1;min-height:74px}.metrics.two .metric:last-child{grid-column:auto}.tabs{width:100%;justify-content:space-between}.tabs a{padding:.55rem .5rem}.event-header{flex-direction:column;gap:.2rem}.form-actions{flex-direction:column}.form-actions .button{width:100%}}
@media(max-width:600px){.journal-toolbar{align-items:flex-start;flex-direction:column}}
.filter-field{display:flex;flex-direction:column;gap:.35rem;min-width:0}.filter-label{font-size:.76rem;font-weight:750;color:#4b6670}.filter-picker{position:relative}.filter-picker[open]{z-index:20}.filter-picker summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-height:42px;border:1px solid #cbdadd;border-radius:.55rem;background:#fff;color:#18313d;padding:.58rem .7rem;cursor:pointer;font-size:.88rem}.filter-picker summary::-webkit-details-marker{display:none}.filter-picker summary:after{content:"▾";color:#66808b}.filter-picker[open] summary:after{content:"▴"}.filter-picker summary:focus-visible{outline:3px solid #19868a55;outline-offset:1px}.filter-menu{position:absolute;top:calc(100% + .3rem);left:0;width:min(300px,calc(100vw - 2rem));max-height:320px;display:flex;flex-direction:column;border:1px solid #cbdadd;border-radius:.7rem;background:#fff;box-shadow:0 12px 32px #1d485025;padding:.55rem}.filter-field-color .filter-menu{left:auto;right:0}.filter-shortcuts{display:flex;justify-content:space-between;gap:.4rem;border-bottom:1px solid #e9eeee;padding:.25rem .25rem .55rem}.filter-shortcuts button{border:0;background:#e8f4f2;color:#116a70;border-radius:.4rem;padding:.35rem .5rem;font-size:.76rem;font-weight:700}.filter-shortcuts button:hover{background:#d7eeeb}.filter-options{overflow-y:auto;padding:.35rem 0}.filters .filter-option{display:flex;flex-direction:row;align-items:center;gap:.55rem;padding:.42rem .4rem;border-radius:.4rem;cursor:pointer}.filters .filter-option:hover{background:#f1f7f6}.filters .filter-option span{font-size:.84rem;font-weight:500;color:#264550}.filters .filter-option input[type=checkbox]{appearance:auto;width:1rem;height:1rem;min-height:1rem;padding:0;margin:0;flex:none;accent-color:#146f75;box-shadow:none}.filter-options .muted{font-size:.8rem;margin:.5rem}
@media(max-width:700px){.filter-field-color .filter-menu{left:0;right:auto}}

/* Appearance settings apply through the server-rendered attributes on <html>. */
html[data-font-size="14"]{font-size:14px}
html[data-font-size="16"]{font-size:16px}
html[data-font-size="18"]{font-size:18px}
html[data-font-size="20"]{font-size:20px}

.appearance-form{display:flex;flex-direction:column;gap:1.5rem;padding:1.6rem}
.appearance-group{border:0;margin:0;padding:0;min-width:0}
.appearance-group legend{font-size:1rem;font-weight:750;margin-bottom:.7rem}
.appearance-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
.appearance-option{display:flex;align-items:center;gap:.7rem;padding:.9rem 1rem;border:1px solid #cbdadd;border-radius:.7rem;cursor:pointer;min-height:52px}
.appearance-option:hover{border-color:#19868a}
.appearance-option:has(input:checked){border-color:#19868a;background:#e8f4f2}
.appearance-option input{accent-color:#146f75;flex:none;margin:0}
.appearance-option span{font-size:.9rem;font-weight:650}
.appearance-form>.button{align-self:flex-start}
@media(max-width:600px){.appearance-options{grid-template-columns:1fr}.appearance-form>.button{width:100%}}

html[data-theme="dark"]{color-scheme:dark;color:#e7f1f3;background:#101a22}
html[data-theme="dark"] .site-header{background:#172630;border-color:#304650}
html[data-theme="dark"] .main-nav{border-color:#304650}
html[data-theme="dark"] .brand small,
html[data-theme="dark"] .main-nav a,
html[data-theme="dark"] .logout-form button,
html[data-theme="dark"] .site-footer,
html[data-theme="dark"] .muted,
html[data-theme="dark"] .login-intro p:last-child{color:#a8c0c8}
html[data-theme="dark"] .main-nav a:hover,
html[data-theme="dark"] .main-nav a[aria-current=page]{background:#25454b;color:#b2f3e8}
html[data-theme="dark"] .logout-form button:hover,
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .back-link,
html[data-theme="dark"] .subtle-link,
html[data-theme="dark"] .pagination a,
html[data-theme="dark"] .event-spool{color:#83ded5}
html[data-theme="dark"] .brand-mark{border-color:#50b6ad;box-shadow:0 0 0 3px #284950 inset}
html[data-theme="dark"] .brand-mark:after{background:#50b6ad}
html[data-theme="dark"] .panel,
html[data-theme="dark"] .spool-card,
html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .filter-menu{background:#172630;border-color:#304650;box-shadow:none}
html[data-theme="dark"] .spool-card:hover{border-color:#5faaa8;box-shadow:0 8px 22px #0003}
html[data-theme="dark"] .metric{background:#1b343c;border-color:#31515a}
html[data-theme="dark"] .metric strong,
html[data-theme="dark"] .weight-display strong{color:#a5ece0}
html[data-theme="dark"] .metric span,
html[data-theme="dark"] .metric small,
html[data-theme="dark"] .results-heading h2,
html[data-theme="dark"] .spool-card p,
html[data-theme="dark"] .card-bottom span,
html[data-theme="dark"] .empty-state p,
html[data-theme="dark"] .pagination span,
html[data-theme="dark"] .form-note,
html[data-theme="dark"] .weight-display span,
html[data-theme="dark"] .detail-list dt,
html[data-theme="dark"] .event-header time,
html[data-theme="dark"] .event-change span,
html[data-theme="dark"] .panel-note,
html[data-theme="dark"] thead th,
html[data-theme="dark"] tbody th small{color:#a8c0c8}
html[data-theme="dark"] .tabs{background:#20343c}
html[data-theme="dark"] .tabs a{color:#b2c7cc}
html[data-theme="dark"] .tabs a[aria-current=page]{background:#31525a;color:#e8fffa;box-shadow:none}
html[data-theme="dark"] .filters label span,
html[data-theme="dark"] .field label,
html[data-theme="dark"] .finish-box label,
html[data-theme="dark"] .login-form label,
html[data-theme="dark"] .filter-label{color:#bfd4d8}
html[data-theme="dark"] .filters input,
html[data-theme="dark"] .filters select,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .finish-box select,
html[data-theme="dark"] .filter-picker summary{background:#101e27;border-color:#45606b;color:#e7f1f3}
html[data-theme="dark"] input::placeholder{color:#9bb2bb;opacity:1}
html[data-theme="dark"] .button.primary{background:#238c8b;color:#fff}
html[data-theme="dark"] .button.primary:hover{background:#2ca4a2}
html[data-theme="dark"] .button.secondary{background:#20353d;border-color:#4b6b73;color:#b6f3ea}
html[data-theme="dark"] .button.secondary:hover,
html[data-theme="dark"] .button.quiet:hover{background:#2a4b51}
html[data-theme="dark"] .button.quiet{background:#263c46;color:#d0e8eb}
html[data-theme="dark"] .button.danger{background:#442d30;border-color:#805354;color:#ffd3ce}
html[data-theme="dark"] .button.danger:hover{background:#5b383a}
html[data-theme="dark"] .status{background:#244b45;color:#adf3d8}
html[data-theme="dark"] .status.finished{background:#463b35;color:#f4d8bc}
html[data-theme="dark"] .card-bottom,
html[data-theme="dark"] .detail-list div,
html[data-theme="dark"] .weight-display,
html[data-theme="dark"] th,
html[data-theme="dark"] td,
html[data-theme="dark"] .journal-toolbar,
html[data-theme="dark"] .filter-shortcuts{border-color:#304650}
html[data-theme="dark"] .finish-box{background:#282b2d;border-color:#51473e}
html[data-theme="dark"] .finish-box p{color:#c7b9aa}
html[data-theme="dark"] .timeline li:not(:last-child):before{background:#3c5660}
html[data-theme="dark"] .event-dot{background:#62c8be;border-color:#2d5b56}
html[data-theme="dark"] .event-change{color:#c4dbe0}
html[data-theme="dark"] .reason{background:#253d46;color:#bfd7da}
html[data-theme="dark"] .filter-shortcuts button{background:#24454a;color:#b6f3ea}
html[data-theme="dark"] .filter-shortcuts button:hover,
html[data-theme="dark"] .filters .filter-option:hover{background:#2c4c52}
html[data-theme="dark"] .filters .filter-option span{color:#e7f1f3}
html[data-theme="dark"] .filters .filter-option input[type=checkbox]{accent-color:#53c7bb}
html[data-theme="dark"] .message{background:#234638;color:#c6f6da}
html[data-theme="dark"] .message.error,
html[data-theme="dark"] .form-errors{background:#482f31;border-color:#805354;color:#ffcbc6}
html[data-theme="dark"] .message.info{background:#263e52;color:#cce3fa}
html[data-theme="dark"] .field-error{color:#ffb7ac}
html[data-theme="dark"] .appearance-option{border-color:#45606b}
html[data-theme="dark"] .appearance-option:hover,
html[data-theme="dark"] .appearance-option:has(input:checked){border-color:#62c8be}
html[data-theme="dark"] .appearance-option:has(input:checked){background:#24454a}
html[data-theme="dark"] .appearance-option input{accent-color:#62c8be}
html[data-theme="dark"] .language-switch summary{color:#a8c0c8}
html[data-theme="dark"] .language-switch summary:hover,html[data-theme="dark"] .language-switch[open] summary{background:#25454b;color:#b2f3e8}
html[data-theme="dark"] .language-switch form{background:#172630;border-color:#45606b;box-shadow:none}
html[data-theme="dark"] .language-switch form button{color:#e7f1f3}
html[data-theme="dark"] .language-switch form button:hover,html[data-theme="dark"] .language-switch form button[aria-current=true]{background:#25454b;color:#b2f3e8}

/* Catalog views and approximate filament color samples. */
.results-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem}
.results-heading h2{margin:0}
.swatch-note{font-size:.75rem;color:#72868f;margin:.25rem 0 0}
.view-switch{display:inline-flex;gap:.2rem;padding:.2rem;border-radius:.65rem;background:#e9f0f1}
.view-switch button{border:0;border-radius:.5rem;background:transparent;color:#536d76;font-size:.8rem;font-weight:700;padding:.55rem .75rem;white-space:nowrap}
.view-switch button[aria-pressed="true"]{background:#fff;color:#146f75;box-shadow:0 1px 5px #1d485018}
.view-switch button:focus-visible{outline:3px solid #19868a;outline-offset:2px}
.spool-identity{display:flex;align-items:center;gap:.85rem;margin:1.15rem 0 1.1rem}
.spool-identity>div{min-width:0}
.spool-identity h3{margin:0 0 .3rem}
.spool-identity p{margin:0}
.detail-color-heading{display:flex;align-items:center;gap:1rem;min-width:0}
.detail-color-heading .filament-swatch{width:4.3rem}
.detail-color-heading>div{min-width:0}

.filament-swatch{--swatch:#aeb8bd;display:inline-block;flex:none;width:3.5rem;aspect-ratio:1;position:relative;border-radius:50%;border:1px solid #b7c5c9;background:linear-gradient(115deg,color-mix(in srgb,var(--swatch),white 52%),var(--swatch) 32%,color-mix(in srgb,var(--swatch),black 28%) 70%,color-mix(in srgb,var(--swatch),white 35%));box-shadow:inset 0 1px 3px #fff7,0 2px 5px #18313d25}
.filament-swatch:before{content:"";position:absolute;inset:16%;border-radius:50%;border:3px solid #ffffff6b;box-shadow:0 0 0 1px #0002,inset 0 0 0 1px #0002}
.filament-swatch:after{content:"";position:absolute;inset:38%;border-radius:50%;background:#f5f8f8;border:1px solid #0003;box-shadow:inset 0 1px 2px #0002}
.swatch-black{--swatch:#25303a}.swatch-white{--swatch:#f4f6f5}.swatch-cream{--swatch:#eadfbd}
.swatch-gray{--swatch:#89939c}.swatch-silver{--swatch:#aabdc7}.swatch-red{--swatch:#ca4050}
.swatch-orange{--swatch:#e77d31}.swatch-yellow{--swatch:#e6c33e}.swatch-gold{--swatch:#c39a30}
.swatch-brown{--swatch:#80553d}.swatch-copper{--swatch:#b66f4a}.swatch-green{--swatch:#4f9b69}
.swatch-blue{--swatch:#3a78c5}.swatch-transparent{--swatch:#dce9e9}.swatch-unknown{--swatch:#a6afb7}
.filament-swatch.finish-metallic,.filament-swatch.finish-silk{background:linear-gradient(105deg,color-mix(in srgb,var(--swatch),white 78%),var(--swatch) 16%,color-mix(in srgb,var(--swatch),black 35%) 31%,color-mix(in srgb,var(--swatch),white 85%) 44%,var(--swatch) 57%,color-mix(in srgb,var(--swatch),black 27%) 76%,color-mix(in srgb,var(--swatch),white 50%))}
.filament-swatch.finish-silk{box-shadow:inset 0 0 5px #fff9,0 2px 7px #18313d35}
.filament-swatch.finish-textured{background-image:radial-gradient(#ffffff9c 1px,transparent 1.5px),radial-gradient(#0005 1px,transparent 1.5px),linear-gradient(115deg,color-mix(in srgb,var(--swatch),white 38%),var(--swatch) 48%,color-mix(in srgb,var(--swatch),black 22%));background-size:8px 8px,11px 11px,100% 100%;background-position:0 0,3px 4px,0 0}
.filament-swatch.finish-transparent{background:linear-gradient(125deg,#ffffffaa,#9dbec473),conic-gradient(#ced9dc 25%,#fff 0 50%,#ced9dc 0 75%,#fff 0);background-size:100% 100%,12px 12px}

.catalog-table{padding:.5rem 1rem}
.catalog-table .table-wrap{margin:0}
.catalog-table table{min-width:760px}
.catalog-table th,.catalog-table td{text-align:left;vertical-align:middle;padding:.7rem .6rem}
.catalog-table tbody tr:hover{background:#f1f7f6}
.catalog-table tbody th a,.catalog-table .table-color{color:#176f75;font-weight:700}
.catalog-table tbody th a:hover,.catalog-table .table-color:hover{text-decoration:underline}
.catalog-table .table-color{display:inline-flex;align-items:center;gap:.65rem;min-width:0}
.catalog-table .filament-swatch{width:2.1rem}
.catalog-table .filament-swatch:before{border-width:2px}
.catalog-table td:nth-child(5),.catalog-table td:nth-child(6){white-space:nowrap}

html[data-theme="dark"] .swatch-note{color:#a8c0c8}
html[data-theme="dark"] .view-switch{background:#20343c}
html[data-theme="dark"] .view-switch button{color:#b2c7cc}
html[data-theme="dark"] .view-switch button[aria-pressed="true"]{background:#31525a;color:#e8fffa;box-shadow:none}
html[data-theme="dark"] .filament-swatch{border-color:#71838a}
html[data-theme="dark"] .filament-swatch:after{background:#172630;border-color:#ffffff70}
html[data-theme="dark"] .catalog-table tbody tr:hover{background:#233d43}
html[data-theme="dark"] .catalog-table tbody th a,html[data-theme="dark"] .catalog-table .table-color{color:#83ded5}
@media(max-width:700px){.results-heading{align-items:flex-start;flex-direction:column}.view-switch{width:100%}.view-switch button{flex:1}.catalog-table{padding:.2rem .6rem}}
