/* The studio has one document viewport; its controls never scroll away. */
dialog:has(.previewstudio){overflow:hidden}.previewstudio{height:100%;display:flex;flex-direction:column;min-height:0}.previewstudio .detailhead,.studio-toolbar{flex:none;position:relative;top:auto}.previewstudio .detailhead{padding:14px 24px}.previewstudio .detailhead h2{margin:2px 0;font-size:22px}.studio-toolbar{padding:10px 24px;z-index:8}.studio-canvas{flex:1;min-height:0;display:flex;flex-direction:column;padding:0;overflow:hidden}.studio-context-controls{padding:12px 24px 6px;flex:none;background:var(--paper);border-bottom:1px solid var(--line)}.studio-context-controls .context-switch{margin-bottom:9px}.studio-context-controls .context-caption{margin:6px 0;font-size:10px}.studio-context-controls .typing-field{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px}.studio-context-controls .typing-toggle{margin:0}.studio-context-controls .context-input{padding:8px 12px;font-size:13px}.studio-sample-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:24px;background:#e4e6e5;scrollbar-gutter:stable}.dark .studio-sample-scroll{background:#101316}.studio-sample-scroll .scene{max-width:1380px;margin:auto;border-radius:3px;box-shadow:0 10px 40px #0002}.inuse-content .studio-context-controls{padding:0;border:0;background:none}.inuse-content .scene{margin-top:16px}.full-newspaper .paper-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.4px;border-bottom:1px solid #34382e;padding-bottom:10px}.paper-top{display:flex;justify-content:space-between;font-size:9px}.paper-sections{border-bottom:2px solid #3a392e;padding:12px 0;font-size:10px;text-align:center}.previewstudio .full-newspaper{padding:30px 38px;background:#f4f0e6}.previewstudio .full-newspaper .newspaper-mast{font-size:clamp(40px,5vw,78px);padding:20px 0}.previewstudio .full-newspaper .newspaper-body{grid-template-columns:minmax(0,3fr) minmax(200px,1fr);gap:28px}.previewstudio .full-newspaper h2{font-size:clamp(30px,3.6vw,55px)}.previewstudio .full-newspaper .scene-lead{font-size:19px;line-height:1.7}.paper-byline{font-size:10px;border-bottom:1px solid #c4beae;padding-bottom:16px}.newspaper figure{margin:20px 0}.newspaper figcaption{font-size:9px;margin-top:7px;color:#666557}.editorial-art{height:260px;position:relative;overflow:hidden;background:#b8c4b3}.art-city{background:linear-gradient(160deg,#e4dcc7 0 38%,#8e9d88 38% 58%,#6b806c 58%)}.art-city:before{content:'';position:absolute;bottom:0;left:8%;width:18%;height:48%;background:repeating-linear-gradient(90deg,transparent 0 20px,#4c6552 20px 28px),#c5b18e;box-shadow:130px 25px 0 #918769,270px -35px 0 #d6c8a7,390px 15px 0 #a49273;transform:skewY(-5deg)}.art-city:after{content:'';position:absolute;left:0;right:0;bottom:0;height:22%;background:#647561;clip-path:polygon(0 50%,10% 30%,20% 60%,30% 10%,50% 40%,70% 0,90% 50%,100% 30%,100% 100%,0 100%)}.art-city span{position:absolute;width:55px;height:55px;background:#e9d7a4;border-radius:50%;right:12%;top:12%}.art-forms{background:#d9e9a3}.art-forms:before{content:'';position:absolute;width:65%;height:100%;border:45px solid #30483c;border-radius:50%;top:15%;left:5%;transform:rotate(-30deg)}.art-forms:after{content:'';position:absolute;width:38%;height:65%;background:#ee805b;right:6%;top:0;border-radius:0 0 100px 100px;transform:rotate(25deg)}.previewstudio .full-newspaper .newspaper-columns{font-size:15px;columns:2;line-height:1.85}.full-newspaper aside .editorial-art{height:130px}.full-newspaper aside h3{font-size:25px}.full-newspaper aside p{font-size:14px}.paper-pullquote{margin:30px 0;border-top:3px double #3b3c30;border-bottom:3px double #3b3c30;padding:25px;text-align:center}.paper-pullquote blockquote{font-size:32px;line-height:1.5;margin:0 0 10px}.paper-pullquote span{font-size:10px}.paper-stories{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}.paper-stories article+article{border-left:1px solid #c3bdaa;padding-left:23px}.paper-stories h3{font-size:26px;line-height:1.35}.paper-stories p:not(.scene-kicker){font-size:14px;line-height:1.9}.paper-read{font-size:10px;border-bottom:1px solid #92937d;padding-bottom:4px}.paper-weekend{display:grid;grid-template-columns:1.5fr 1fr;gap:30px;margin-top:35px;border-top:2px solid #3a3e30;padding:25px 0}.paper-weekend h3{font-size:32px;margin:15px 0}.paper-weekend p{font-size:15px}.paper-weekend .editorial-art{height:230px}.paper-footer{border-top:3px double #393c30;display:flex;justify-content:space-between;gap:15px;padding-top:15px;font-size:9px}.full-website{background:#183a32;color:#e8efdf}.full-website .website-nav{padding:23px 35px;align-items:center}.full-website .website-nav b{font-size:25px}.full-website .website-nav>a{border:1px solid #ffffff50;padding:9px 15px;border-radius:25px;font-size:11px}.web-hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;align-items:center;padding:25px 35px 55px}.previewstudio .full-website .website-hero{padding:30px 0;max-width:none}.previewstudio .full-website .website-hero h2{font-size:clamp(35px,4.1vw,68px)}.full-website .website-hero p{font-size:16px;line-height:1.9}.web-art{position:relative;min-height:410px;background:#dbeba5;color:#233e31;overflow:hidden;border-radius:3px}.web-art .editorial-art{position:absolute;inset:0;height:100%;opacity:.8}.web-art>strong{position:relative;display:block;font-size:60px;line-height:1.2;padding:35px;z-index:1;mix-blend-mode:multiply}.web-art>span{position:absolute;bottom:20px;left:30px;font-size:10px;letter-spacing:2px;z-index:1}.web-partners{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #ffffff30;border-bottom:1px solid #ffffff30;padding:27px 35px}.web-partners>span{font-size:10px;max-width:130px;color:#a6c5b6}.web-partners>b{font-size:21px}.web-projects{padding:65px 35px;background:#f1f0e8;color:#203b32}.web-section-title{display:flex;align-items:end;justify-content:space-between;margin-bottom:30px}.web-section-title h2{font-size:40px}.web-section-title>span{font-size:10px}.web-project-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px 24px}.project-art{height:300px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:25px;background:#e27d50;color:#20392c}.project-art span{font-size:12px}.project-art strong{font-size:65px;z-index:1;position:relative;line-height:1.6}.project-art i{position:absolute;width:200px;height:200px;right:-50px;top:-30px;border:35px solid currentColor;border-radius:50%;opacity:.2}.project-1{background:#1d493b;color:#e2f0a7}.project-2{background:#ccc9ec;color:#312455}.project-3{background:#e6dfc5;color:#39555c}.project-caption{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-top:15px}.project-caption h3{font-size:19px;margin:0}.project-caption>span{font-size:9px;white-space:nowrap}.web-about{display:grid;grid-template-columns:1fr 1fr;gap:55px;padding:65px 35px}.web-about h2{font-size:40px;color:#d6e8a6}.web-about p{font-size:15px;color:#bfd0c4}.web-services>div{display:flex;align-items:center;gap:15px;border-bottom:1px solid #ffffff30;padding:20px 0}.web-services h3{font-size:19px;flex:1;margin:0}.web-services span,.web-services b{font-size:11px;color:#c6de9e}.web-contact{background:#d1e79c;color:#213c30;padding:65px 35px}.web-contact h2{font-size:clamp(35px,4.5vw,70px);max-width:1000px}.web-contact .mock-button{background:#1e3b30;color:#e4eeda;margin-top:30px}.full-website .website-footer{padding:28px 35px;justify-content:space-between;flex-wrap:wrap}.full-website .website-footer>b{font-size:20px}.previewstudio .scene p,.previewstudio .scene h3{overflow-wrap:anywhere}.previewstudio .scene{min-height:500px}
@media(max-width:760px){.studio-sample-scroll{padding:12px}.previewstudio .detailhead{padding:12px 16px}.studio-toolbar{padding:8px 16px}.studio-context-controls{padding:8px 16px 3px}.studio-context-controls .context-switch{gap:4px;margin-bottom:7px}.studio-context-controls .context-switch button{font-size:10px;padding:5px 8px}.studio-context-controls .typing-field{display:flex;gap:4px}.studio-context-controls .context-input{padding:6px 9px;font-size:12px}.studio-context-controls .context-caption{font-size:9px;margin:3px 0}.studio-font-label{display:none}.studio-picker-wrap{position:static}.previewstudio .full-newspaper{padding:20px}.previewstudio .full-newspaper .newspaper-body{grid-template-columns:1fr}.full-newspaper .paper-top{font-size:8px}.paper-sections{font-size:8px}.previewstudio .full-newspaper .newspaper-mast{font-size:36px}.previewstudio .full-newspaper h2{font-size:32px}.previewstudio .full-newspaper .scene-lead{font-size:15px}.previewstudio .full-newspaper .newspaper-columns{font-size:13px;columns:1}.paper-stories{grid-template-columns:1fr}.paper-stories article+article{border-left:0;border-top:1px solid #bdb8a6;padding:18px 0 0}.paper-weekend{grid-template-columns:1fr}.paper-pullquote{padding:20px 0}.paper-pullquote blockquote{font-size:26px}.paper-footer{flex-wrap:wrap;font-size:8px}.web-hero-grid{grid-template-columns:1fr;padding:20px}.previewstudio .full-website .website-hero{padding:15px 0}.full-website .website-nav{padding:18px;gap:10px}.full-website .website-nav>b{font-size:21px}.full-website .website-nav>a{font-size:9px}.web-art{min-height:260px}.web-art>strong{font-size:45px}.web-partners{padding:20px;flex-wrap:wrap}.web-partners>b{font-size:17px}.web-projects,.web-about,.web-contact{padding:35px 20px}.web-project-grid,.web-about{grid-template-columns:1fr}.project-art{height:240px}.project-art strong{font-size:55px}.web-section-title h2,.web-about h2{font-size:30px}.project-caption{align-items:start;flex-direction:column;gap:7px}.full-website .website-footer{padding:22px;font-size:10px}.full-website .website-hero p{font-size:14px}.studio-toolbar #studio-picker{top:100%}}

.explorer-quick-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 10px}.auto-convert-toggle{display:inline-flex;gap:8px;align-items:center;white-space:nowrap;border:1px solid var(--line);background:var(--card);padding:6px 11px;border-radius:25px;font-size:11px}.auto-convert-track{width:27px;height:15px;background:#858b91;border-radius:20px;padding:2px;display:block}.auto-convert-track i{display:block;width:11px;height:11px;border-radius:50%;background:#fff;transition:transform .15s}.auto-convert-toggle.enabled .auto-convert-track{background:var(--accent)}.auto-convert-toggle.enabled .auto-convert-track i{transform:translateX(12px)}.explorer-tour-button{display:flex;align-items:center;gap:9px;white-space:nowrap;background:var(--soft);color:var(--accent);border:1px solid var(--accent);border-radius:25px;padding:10px 16px;font-size:13px}.explorer-tour-button>span{border:1px solid currentColor;border-radius:50%;width:19px;height:19px;font-size:12px}.explorer-tour-mobile{display:none}.context-switch>.auto-convert-toggle{order:1;margin-left:auto;padding:6px 11px;font-size:11px}@media(max-width:760px){.explorer-tour-mobile{display:block;font-size:11px;color:var(--accent);border:1px solid var(--line);border-radius:20px;padding:6px 10px;background:var(--card)}.explorer-quick-controls{margin-bottom:8px}.context-switch>.auto-convert-toggle{font-size:10px;margin-left:0}.auto-convert-toggle{font-size:10px;padding:6px 9px}}

.cardactions{gap:6px;flex-shrink:0}.cardactions button,.cardactions a{width:34px;height:34px;padding:7px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:9px;background:var(--card);color:var(--muted);transition:background .15s,color .15s,border-color .15s}.cardactions .useweb{width:auto;gap:5px;padding:7px 9px;font:600 10px/1.2 Arial,InterfaceGeo,sans-serif;background:var(--soft);color:var(--accent);border-color:transparent}.cardactions svg{width:18px;height:18px;stroke-width:1.8}.cardactions button:hover,.cardactions a:hover,.cardactions button.on{background:var(--soft);border-color:var(--accent);color:var(--accent)}.cardactions button:focus-visible,.cardactions a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.cardbottom{flex-wrap:wrap}.cardactions{margin-left:auto}.iconbutton svg{stroke-width:1.8}.iconbutton.on .lucide-heart{fill:var(--accent);stroke:var(--accent)}.trayhandle svg{width:22px;height:22px}.brand small{font-family:Arial,InterfaceGeo,sans-serif}
.fontlab-tooltip{position:fixed;z-index:2147483647;display:flex;align-items:center;gap:10px;width:max-content;padding:12px 15px;border:1px solid #ffffff22;border-radius:13px;background:linear-gradient(135deg,#203c35,#12241f);color:#f6f7ee;box-shadow:0 10px 32px #071b2933,0 2px 5px #071b291a;font:500 12px/1.5 InterfaceGeo,system-ui,sans-serif;letter-spacing:.01em;pointer-events:none;animation:tooltip-reveal .15s ease-out;white-space:normal;text-align:left}
.fontlab-tooltip.above{transform:translateY(-100%)}
.tooltip-spark{color:#d3eea8;font-size:17px;flex-shrink:0}
.fontlab-tooltip kbd{padding:2px 5px;border:1px solid #ffffff33;border-radius:5px;color:#d3eea8;font:10px system-ui}
.fontlab-tooltip:after{content:"";position:absolute;left:50%;width:8px;height:8px;background:#182f28;transform:rotate(45deg)}
.fontlab-tooltip.above:after{bottom:-4px}.fontlab-tooltip.below:after{top:-4px}
@keyframes tooltip-reveal{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.fontlab-tooltip{animation:none}}
.fontlab-tooltip{transform:translateX(-50%)}
.fontlab-tooltip.above{transform:translate(-50%,-100%)}
/* Compact explorer controls: keep the working space for font specimens. */
.explorer-view main{padding-top:12px}
.explorer-view .explorer-titleline{display:flex;gap:12px;margin-bottom:10px;min-height:32px}
.explorer-view .explorer-titleline h1{font-size:22px;line-height:1.3;letter-spacing:-.6px;min-width:0}
.explorer-titleline .explorer-quick-controls{margin:0;flex-shrink:0;gap:8px}
.explorer-titleline .explorer-tour-button{padding:6px 11px;font-size:11px;gap:6px}
.explorer-view .searchbar{padding:8px 12px;border-radius:10px}
.explorer-view .searchbar input{font-size:14px;min-height:24px}
.explorer-view .previewbar{margin:8px 0;padding:7px 12px;gap:12px;border-radius:10px}
.explorer-view .presetselect{padding:6px 9px;font-size:12px}
.explorer-view .previewfield{min-width:0}
.explorer-view .previewfield .typing-field{display:flex;flex-direction:row;align-items:center;gap:10px;width:100%;min-width:0}
.explorer-view .previewfield input{flex:1;min-width:0;font-size:15px;padding:4px 0}
.explorer-view .previewfield .typing-toggle{margin:0;flex:none;white-space:nowrap}
.explorer-view .resultshead{margin-bottom:8px;min-height:32px}
@media(min-width:761px) and (max-width:1200px){
 .explorer-view .explorer-titleline h1{font-size:18px}
 .explorer-view .previewfield .typing-field{flex-wrap:wrap;gap:2px}
 .explorer-view .previewfield input{flex-basis:100%}
}
@media(max-width:760px){
 .explorer-view main{padding-top:8px}
 .explorer-view .explorer-titleline{display:flex;margin-bottom:8px;min-height:32px}
 .explorer-titleline h1,.explorer-titleline .explorer-tour-button{display:none}
 .explorer-titleline .explorer-quick-controls{width:100%;justify-content:space-between}
 .explorer-view .searchbar{padding:7px 10px}
 .explorer-view .previewbar{margin:6px 0;padding:7px 10px;gap:5px 10px}
 .explorer-view .previewfield .typing-field{gap:6px}
 .explorer-view .previewfield input{font-size:14px}
 .explorer-view .resultshead{margin-bottom:6px}
}
@media(min-width:761px) and (max-width:1200px){
 header{padding:0 20px;gap:12px}
 header .brand{flex-shrink:0;font-size:22px}
 header .brand small{display:none}
 header nav{gap:2px;min-width:0}
 header nav a{font-size:12px;padding:9px 11px;white-space:nowrap}
 header .themebutton span{display:none}
 header .headercontrols{flex-shrink:0;gap:5px}
}
@media(min-width:761px) and (max-width:900px){header .brand>span:last-child{display:none}header nav a{padding:9px 8px}}
/* Collapsible desktop filters; mobile retains its drawer. */
.sidebar-restore{display:none}
.sidebar-collapse{margin-left:-7px}
@media(min-width:761px){
 .explorer-view .layout.sidebar-collapsed{grid-template-columns:48px minmax(0,1fr)}
 .sidebar-collapsed>.sidebar{display:none}
 .sidebar-collapsed>.sidebar-restore{display:flex;align-self:start;justify-self:center;margin-top:16px;background:var(--card);border:1px solid var(--line)}
 .sidebar-collapsed>main{grid-column:2;grid-row:1}
}
@media(max-width:760px){.sidebar-collapse{display:none}}
/* List specimens size to their actual text, without a reserved blank block. */
.grid.list{gap:10px}
.grid.list .fontcard{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
.grid.list .cardtop{grid-column:1/-1;padding:12px 18px 0}
.grid.list .fontcard .specimen{grid-column:1/-1;min-height:0;flex:none;padding:10px 18px;line-height:1.32}
.grid.list .samplelink{padding:7px 18px;justify-content:flex-start;gap:12px;align-self:stretch;border-top:1px solid var(--line)}
.grid.list .cardbottom{margin:0;padding:7px 14px;border-top:1px solid var(--line);align-self:stretch}
@media(max-width:600px){
 .grid.list .fontcard{grid-template-columns:1fr}
 .grid.list .samplelink{border-top:0;padding:4px 14px}
 .grid.list .cardbottom{grid-column:1;padding:7px 12px}
 .grid.list .cardtop{padding:12px 14px 0}
 .grid.list .fontcard .specimen{padding:9px 14px}
}
/* The filter panel folds into an instrument rail; selected values stay visible. */
.filter-rail{display:none}
@media(min-width:761px){
 .explorer-view .layout{--filter-width:245px;grid-template-columns:var(--filter-width) minmax(0,1fr);transition:grid-template-columns .26s cubic-bezier(.2,.75,.25,1)}
 .explorer-view .layout.sidebar-collapsed{grid-template-columns:64px minmax(0,1fr)}
 .explorer-view .layout>main{grid-column:2;grid-row:1}
 .explorer-view .layout>.sidebar{display:block;grid-column:1;grid-row:1;width:var(--filter-width);min-width:0;opacity:1;transform:translateX(0);visibility:visible;transition:opacity .18s,transform .26s,visibility 0s;z-index:1}
 .explorer-view .layout.sidebar-collapsed>.sidebar{opacity:0;transform:translateX(-24px);visibility:hidden;pointer-events:none;transition:opacity .15s,transform .26s,visibility 0s .26s}
 .filter-rail{display:flex;grid-column:1;grid-row:1;width:64px;min-height:0;height:100%;flex-direction:column;align-items:center;gap:9px;padding:14px 8px;border-right:1px solid var(--line);background:var(--paper);opacity:0;visibility:hidden;transform:translateX(-12px);transition:opacity .15s,transform .22s,visibility 0s .22s;z-index:2}
 .sidebar-collapsed>.filter-rail{opacity:1;visibility:visible;transform:translateX(0);transition:opacity .2s .08s,transform .26s,visibility 0s}
 .filter-rail .sidebar-restore{display:flex;margin:0}
 .filter-rail button{width:42px;min-height:38px;border:1px solid var(--line);border-radius:5px;background:var(--card);justify-content:center;flex-shrink:0}
 .filter-rail button:hover{border-color:var(--accent);background:var(--soft)}
 .rail-divider{height:1px;background:var(--line);width:30px;flex-shrink:0}
 .rail-count{display:flex;align-items:center;gap:3px;color:var(--muted);font-size:11px}
 .rail-count svg{width:15px;height:15px}
 .rail-selections{display:flex;flex-direction:column;gap:7px;min-height:0;overflow-y:auto;overflow-x:hidden;width:48px;align-items:center;padding:3px;scrollbar-width:thin}
 .rail-selection{display:flex;flex-direction:column;padding:5px 2px;gap:1px}
 .rail-selection small{font-size:8px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);line-height:1.3}
 .rail-selection strong{font-size:13px;color:var(--accent);font-weight:650;line-height:1.4}
 .rail-clear{margin-top:auto;color:var(--muted)}
}
@media(min-width:761px) and (max-width:1100px){.explorer-view .layout{--filter-width:215px}}
@media(prefers-reduced-motion:reduce){.explorer-view .layout,.explorer-view .layout>.sidebar,.filter-rail{transition:none!important}}
/* Quiet vertical markers, with a colored edge for hover and keyboard focus. */
@media(min-width:761px){
 .filter-rail{padding-top:12px;background:var(--paper);gap:15px}
 .filter-rail .sidebar-restore{width:30px;min-height:30px;padding:5px;border-radius:6px}
 .filter-rail .rail-count{border:0;background:none;color:var(--muted);min-height:28px}
 .rail-selections{gap:12px;width:56px;padding:3px 5px}
 .filter-rail .rail-selection{--marker:#4267b2;position:relative;min-height:54px;width:46px;border-color:transparent;background:transparent;border-radius:8px;gap:4px}
 .rail-selection:nth-child(4n+2){--marker:#a96a08}.rail-selection:nth-child(4n+3){--marker:#8659bf}.rail-selection:nth-child(4n){--marker:#087e91}
 .rail-selection strong{color:var(--marker)}
 .filter-rail .rail-selection:hover,.filter-rail .rail-selection:focus-visible{background:var(--card);border-color:var(--line);box-shadow:inset 3px 0 var(--marker)}
 .dark .rail-selection{--marker:#7fa4ff}.dark .rail-selection:nth-child(4n+2){--marker:#ffc360}.dark .rail-selection:nth-child(4n+3){--marker:#b998ff}.dark .rail-selection:nth-child(4n){--marker:#72d9e8}
 .filter-rail .rail-clear{width:30px;min-height:30px;border-radius:50%;padding:6px}
}
.fontlab-tooltip.beside{transform:translateY(-50%)}
.fontlab-tooltip.beside:after{left:-4px;top:calc(50% - 4px)}
/* Optional horizontal rail for a larger specimen workspace. */
.explorer-controls{display:grid;grid-template-rows:1fr;opacity:1;transition:grid-template-rows .26s cubic-bezier(.2,.75,.25,1),opacity .2s;min-width:0}
.explorer-controls.collapsed{grid-template-rows:0fr;opacity:0}
.explorer-controls-inner{min-height:0;overflow:hidden;padding:3px;margin:-3px}
.explorer-controls.collapsed .explorer-controls-inner{padding:0;margin:0}
.controls-collapse{order:3;border:1px solid var(--line);background:var(--card);width:30px;height:30px;padding:5px}
.controls-summary{display:flex;align-items:center;gap:12px;padding:7px 10px;margin-bottom:8px;min-height:46px;border:1px solid var(--line);border-radius:10px;background:var(--card);min-width:0}
.controls-summary>button{min-width:0}
.controls-expand{border:1px solid var(--line);border-radius:6px;width:30px;height:30px;padding:5px;flex-shrink:0}
.summary-search{display:flex;align-items:center;gap:8px;max-width:24%;font-size:12px;text-align:left}
.summary-search span,.summary-sample>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.summary-search svg{width:16px;height:16px;color:var(--muted)}
.summary-divider{height:22px;width:1px;background:var(--line);flex-shrink:0}
.summary-sample{display:flex;align-items:center;gap:10px;flex:1;min-width:0;text-align:left;font-size:13px}
.summary-label{font-size:9px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);flex-shrink:0}
.summary-size{font-size:13px;color:var(--accent);white-space:nowrap}.summary-size small{font-size:10px;margin-left:4px;color:var(--muted)}
.controls-summary .auto-convert-toggle{flex-shrink:0}
@media(max-width:760px){
 .controls-summary{gap:7px;padding:6px;flex-wrap:wrap}
 .summary-search{max-width:calc(100% - 45px);flex:1}
 .summary-divider{display:none}
 .summary-sample{order:4;flex-basis:calc(100% - 65px)}
 .summary-size{order:5}
 .controls-summary .auto-convert-toggle{margin-left:auto}
 .explorer-titleline .explorer-quick-controls{gap:5px}
 .explorer-titleline .explorer-tour-mobile{padding:6px 7px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){.explorer-controls{transition:none}}
.explorer-view .explorer-titleline{padding:7px 10px;border:1px solid transparent;min-height:46px}
.explorer-titleline>.controls-collapse{order:0;flex-shrink:0;border-radius:6px}
.explorer-titleline>h1{flex:1}
@media(max-width:760px){.explorer-view .explorer-titleline{padding:6px;gap:7px}.explorer-titleline .explorer-quick-controls{width:auto;flex:1;min-width:0}}
/* Explicit form colors: native defaults otherwise stay white in dark dialogs. */
:root{color-scheme:light}.dark{color-scheme:dark}
input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=color]),textarea,select{background-color:var(--card);color:var(--ink);caret-color:var(--accent)}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
input::selection,textarea::selection{background:#4267b2;color:#fff}
.typing-field>input:not([type=range]),.typing-field>textarea{width:100%;min-width:0;border:1px solid var(--line);border-radius:8px;padding:9px 12px;line-height:1.5}
.previewfield .typing-field>input{border:0;padding:4px 0;background:transparent}
.detailcontrols .typing-field{flex:1;min-width:0;width:100%}
.detailcontrols{margin-bottom:16px}
.dark input:-webkit-autofill,.dark textarea:-webkit-autofill{-webkit-text-fill-color:var(--ink);box-shadow:0 0 0 1000px var(--card) inset;caret-color:var(--accent)}
.picker-summary{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.picker-summary .auto-convert-toggle{font-size:10px}
.dark :is(input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=color]),textarea,select){background-color:var(--card);color:var(--ink);caret-color:var(--accent)}
.coffee-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:8px 11px;border-radius:24px;background:#ffdd78;color:#302710;border:1px solid #e9bd48;white-space:nowrap;font-size:12px;font-weight:600}
.coffee-button:hover{background:#ffe69a;box-shadow:0 3px 12px #d69b2325}
.dark .coffee-button{background:#3c321d;border-color:#67532a;color:#ffe095}
@media(max-width:1500px){.coffee-button span{display:none}.coffee-button{padding:8px;width:36px;height:36px}}