.filter-dialog{color:#e2ece5;z-index:100;background:#07100f;border:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;font-family:Arial,sans-serif;position:fixed;inset:0;overflow:auto}.filter-dialog::backdrop{background:#020807ee}.filter-dialog *{box-sizing:border-box}.filter-dialog header{background:#081210;border-bottom:1px solid #29403a;justify-content:space-between;align-items:center;height:105px;padding:23px 32px;display:flex}.filter-kicker{letter-spacing:.17em;color:#8cac9f;margin:0 0 9px;font-size:10px}.filter-dialog h1{letter-spacing:.02em;margin:0;font:30px Georgia,serif}.filter-dialog button{color:#dfe9e3;cursor:pointer;background:#10221e;border:1px solid #345347;border-radius:2px;padding:10px 14px}.filter-dialog button:hover,.filter-dialog button:focus-visible{background:#21443a;outline:1px solid #9ad3b9}.filter-close{font-size:12px}.filter-layout{grid-template-columns:minmax(0,1fr) 335px;min-height:calc(100dvh - 105px);display:grid}.filter-stage{height:calc(100dvh - 105px);min-height:610px;position:relative;overflow:hidden}.filter-canvas{position:absolute;inset:0}.filter-canvas canvas{touch-action:none;width:100%;height:100%;display:block}.filter-view-label{pointer-events:none;gap:8px;display:grid;position:absolute;top:24px;left:28px}.filter-view-label span{letter-spacing:.15em;color:#94b3a5;font-size:10px}.filter-view-label strong{font:23px Georgia,serif}.filter-view-label small{color:#91a59a;font-size:11px}.filter-legend{pointer-events:none;gap:18px;font-size:10px;display:flex;position:absolute;bottom:158px;left:28px}.filter-legend span:first-child{color:#d5b57c}.filter-legend span:last-child{color:#7ed3e6}.filter-toolbar{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#081410ed;border:1px solid #2f4a40;flex-wrap:wrap;align-items:center;gap:12px;padding:13px;display:flex;position:absolute;bottom:20px;left:20px;right:20px}.filter-toolbar button{font-size:11px}.filter-toolbar>label{color:#adbdaf;align-items:center;gap:6px;font-size:11px;display:flex}.filter-toolbar input{accent-color:#a2d4b7}.filter-toolbar input[type=range]{width:110px}.filter-guide{background:#0c1814;border-left:1px solid #29403a;max-height:calc(100dvh - 105px);padding:23px;overflow:auto}.filter-guide nav{gap:4px;display:grid}.filter-guide nav button{text-align:left;background:0 0;border-color:#243d32;align-items:center;gap:11px;padding:10px;font-size:11px;display:flex}.filter-guide nav button span{color:#819a8c;font-size:10px}.filter-guide nav button b{color:#749482;margin-left:auto;font-weight:400}.filter-guide nav button[aria-pressed=true]{color:#e8f1d9;background:#1e382d;border-color:#9fc6ae}.filter-guide article{border-top:1px solid #355041;margin-top:22px;padding-top:24px}.filter-guide h2{margin:12px 0;font:22px Georgia,serif}.filter-guide article>p:not(.filter-kicker),.filter-note p{color:#b2c3b7;font-size:12px;line-height:1.75}.filter-note{border-top:1px solid #294337;margin-top:22px;padding-top:18px}.filter-note strong{color:#cae0cc;font-size:11px}.filter-note small{color:#7f9b8a;font-size:10px;line-height:1.65;display:block}.filter-error{color:#ffe1bd;background:#342318;max-width:70%;padding:16px;position:absolute;top:120px;left:20px}@media (width<=800px){.filter-dialog header{height:92px;padding:16px}.filter-dialog h1{font-size:25px}.filter-dialog header .filter-kicker{max-width:180px;font-size:8px;line-height:1.5}.filter-close{max-width:140px;font-size:10px!important}.filter-layout{display:block}.filter-stage{height:65dvh;min-height:500px}.filter-guide{border-top:1px solid #29403a;border-left:0;max-height:none;padding:20px}.filter-guide nav{grid-template-columns:1fr 1fr}.filter-guide nav button{font-size:10px}.filter-toolbar{gap:9px;padding:10px;bottom:10px;left:10px;right:10px}.filter-toolbar>label{font-size:10px}.filter-view-label{top:18px;left:18px}.filter-legend{gap:9px;font-size:9px;bottom:165px;left:18px}}.filter-dialog>header{pointer-events:auto;z-index:2;width:100%;position:relative;top:auto;left:auto}.filter-trace{background:#132c26;border:1px solid #558b80;margin-bottom:24px;padding:16px}.filter-trace p{color:#bed2c7;font-size:12px;line-height:1.7}.filter-trace small{color:#90aaa0;margin-top:14px;font-size:10px;line-height:1.6;display:block}.trace-steps,.trace-actions{flex-wrap:wrap;gap:5px;margin-top:12px;display:flex}.filter-dialog .trace-steps button{padding:7px 9px}.trace-steps button[aria-pressed=true]{background:#477b6d;border-color:#bbf0d7}.filter-dialog .trace-actions button{padding:8px;font-size:10px}.filter-dialog button:disabled{opacity:.45;cursor:default}.filter-dialog.filter-dialog>header{align-items:center;width:100%;height:86px;padding:18px 24px;display:flex;position:relative;inset:auto;transform:none}.filter-dialog.filter-dialog .filter-layout{min-height:calc(100dvh - 86px)}.filter-dialog.filter-dialog .filter-stage{height:calc(100dvh - 86px)}.filter-dialog.filter-dialog .filter-guide{max-height:calc(100dvh - 86px)}.filter-dialog.filter-dialog nav{background:0 0;border:0;border-radius:0;padding:0;display:grid}.filter-dialog.filter-dialog .filter-guide nav button{color:#dfe9e3;min-height:36px;box-shadow:none;background:#0b1c16;border:1px solid #345347;border-radius:3px;font-size:12px}.filter-dialog.filter-dialog .filter-guide nav button[aria-pressed=true]{background:#1e3c30;border-color:#9fc6ae}.filter-material-closeup{pointer-events:none;width:clamp(190px,19vw,290px);margin:0;position:absolute;bottom:19%;right:5%}.filter-material-closeup>div{aspect-ratio:1;border:2px solid #aad4c0;border-radius:50%;overflow:hidden;box-shadow:0 12px 35px #0008}.filter-material-closeup canvas{width:100%!important;height:100%!important}.filter-material-closeup figcaption{text-align:center;color:#b9d5c9;letter-spacing:2px;margin-top:13px;font:10px Arial}.filter-material-closeup small{letter-spacing:.7px;color:#8ca99a;margin-top:7px;font-size:9px;line-height:1.6;display:block}@media (width<=1000px){.filter-material-closeup{width:155px;bottom:28%;right:12px}}@media (width<=800px){.filter-dialog.filter-dialog>header{height:92px;padding:16px}.filter-dialog.filter-dialog .filter-stage{height:70dvh;min-height:520px}.filter-dialog.filter-dialog .filter-guide{max-height:none}.filter-material-closeup{display:none}}@media (width>=1200px){.filter-dialog.filter-dialog .filter-layout{grid-template-columns:minmax(0,1fr) minmax(335px,20vw)}}@media (width<=800px){.filter-canvas{top:76px;bottom:174px}.filter-view-label{gap:5px}.filter-view-label strong{font-size:20px}}