*{box-sizing:border-box}body{margin:0;background:#f4f6f1;color:#203e3d;font:15px/1.5 Arial,sans-serif}.lightbox-main{max-width:1320px;padding:26px 5% 40px}.lightbox-breadcrumb{display:flex;justify-content:space-between;gap:16px;margin-bottom:20px;font-size:13px}.lightbox-main h1{font-size:clamp(25px,3.4vw,42px);margin:0;line-height:1.2;letter-spacing:-1px}.lightbox-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:#63766c}.lightbox-notes{border-top:1px solid #dce3d9;padding-top:14px;color:#536b5e;font-size:13px;max-width:1000px}.lightbox-notes summary{cursor:pointer;font-weight:bold}.lightbox-notes p{line-height:1.7}#opal-box-3d{--font-size-base:14px;--foreground:#203e3d;--background:#f4f6f1;--muted:#62736b;--border:#dce3d9;--viz-series-1:#347cba;--series-2:#b36a47;font-size:14px}#opal-box-3d .text-small{font-size:12px}#opal-box-3d .text-muted{color:#62736b}#opal-box-3d .text-destructive{color:#a93820}#opal-box-3d .tabular-nums{font-variant-numeric:tabular-nums}#opal-box-3d .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#opal-box-3d .viz-row{display:flex;gap:7px;flex-wrap:wrap}#opal-box-3d .btn{border:1px solid #cad8cd;background:#fff;border-radius:8px;padding:8px 12px;min-height:40px;color:#28554a;cursor:pointer;font:inherit}#opal-box-3d .btn[aria-pressed=true]{background:#28554a;color:#fff}#opal-box-3d .btn:focus-visible,#opal-box-3d input:focus-visible,#opal-box-3d select:focus-visible{outline:3px solid #b4613f;outline-offset:2px}#opal-box-3d .form-label{display:flex;flex-direction:column;gap:5px;font-weight:600}#opal-box-3d .form-label output{font-weight:400}#opal-box-3d .form-range{width:100%;margin:0;min-height:32px;accent-color:#28554a;cursor:pointer}#opal-box-3d .form-select{width:100%;min-height:42px;padding:8px;border:1px solid #cad8cd;background:#fff;color:inherit;border-radius:7px;font:inherit}#opal-box-3d .form-control-color{width:100%;height:42px;padding:4px;border:1px solid #cad8cd;background:#fff;border-radius:7px}#opal-box-3d .ob-sidebar{border:1px solid #dce3d9;border-radius:12px;padding:14px;background:#fff}#opal-box-3d #ob-scene{background:#edf0e9;border-radius:12px;border:1px solid #dce3d9}#opal-box-3d .ob-fixed-totals{padding:12px 15px;background:#e9efe6;border:1px solid #d3dfd0;border-radius:10px}#opal-box-3d .ob-total>output{font-size:22px;font-weight:600}#opal-box-3d .ob-reset{margin-top:12px;font-size:12px} @media(max-width:600px){.lightbox-main{padding:18px 16px 30px}.lightbox-breadcrumb{font-size:12px;margin-bottom:16px}#opal-box-3d .ob-total>output{font-size:18px}#opal-box-3d .btn{padding:7px 10px;font-size:12px}.avalon-utility{display:none}}

  #opal-box-3d { position: relative; color: var(--foreground); }
  #opal-box-3d .ob-heading { display: grid; gap: calc(var(--font-size-base) * .25); margin-bottom: calc(var(--font-size-base) * .75); padding-right: 0; }
  #opal-box-3d .ob-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: var(--font-size-base); height: 610px; }
  #opal-box-3d .ob-preview { display: flex; flex-direction: column; gap: calc(var(--font-size-base) * .5); min-width: 0; min-height: 0; }
  #opal-box-3d #ob-scene { position: relative; flex: 1; min-height: 0; touch-action: none; overflow: hidden; }
  #opal-box-3d .ob-sidebar { display: flex; flex-direction: column; gap: calc(var(--font-size-base) * .5); min-width: 0; min-height: 0; }
  #opal-box-3d .ob-settings { position: relative; flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; touch-action: pan-y; scrollbar-gutter: stable; padding-right: calc(var(--font-size-base) * .5); padding-bottom: var(--font-size-base); }
  #opal-box-3d .ob-settings-title { flex: none; }
  #opal-box-3d #ob-scene canvas { display: block; width: 100%; height: 100%; cursor: grab; }
  #opal-box-3d #ob-loading, #opal-box-3d #ob-error { position: absolute; inset: 0; display: grid; place-content: center; padding: var(--font-size-base); }
  #opal-box-3d [hidden] { display: none !important; }
  #opal-box-3d .ob-caption { margin-top: calc(var(--font-size-base) * .5); }
  #opal-box-3d .ob-controls { display: grid; grid-template-columns: minmax(0, 1fr); gap: calc(var(--font-size-base) * .5); margin-top: calc(var(--font-size-base) * .75); }
  #opal-box-3d .ob-settings > .ob-controls:first-child { margin-top: 0; }
  #opal-box-3d .ob-label { display: flex; justify-content: space-between; align-items: center; gap: calc(var(--font-size-base) * .5); }
  #opal-box-3d .ob-fixed-totals { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: calc(var(--font-size-base) * .5); flex: none; }
  #opal-box-3d .ob-total { display: grid; grid-template-rows: auto auto auto; align-content: start; min-width: 0; gap: calc(var(--font-size-base) * .25); }
  #opal-box-3d output { white-space: nowrap; }
  @media (max-width: 600px) {
    #opal-box-3d .ob-workspace { grid-template-columns: minmax(0, 1fr); grid-template-rows: 340px minmax(0, 1fr); height: 600px; gap: calc(var(--font-size-base) * .75); }
    #opal-box-3d .ob-heading { padding-right: 0; }
    #opal-box-3d .ob-settings { padding-right: calc(var(--font-size-base) * .25); }
  }

@media(max-width:600px){#opal-box-3d .ob-workspace{height:clamp(480px,calc(100svh - 110px),720px);grid-template-rows:minmax(250px,55%) minmax(0,1fr)}#opal-box-3d .ob-sidebar{padding:10px}#opal-box-3d .ob-caption{font-size:11px}#opal-box-3d .ob-fixed-totals{padding:7px 11px}}
/* The mobile tool owns the remaining viewport. Only its controls scroll. */
@media(max-width:600px){body.lightbox-page{height:100svh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.lightbox-page .avalon-tool-header{flex:none}.lightbox-page .avalon-header-main{padding:12px 16px;gap:12px;flex-wrap:nowrap}.lightbox-page .avalon-tool-header .avalon-home img{width:145px}.lightbox-page .avalon-account{font-size:11px}.lightbox-page .avalon-search{display:none}.lightbox-page .avalon-tool-nav{padding:7px 16px;gap:16px}.lightbox-page .avalon-tool-nav>a:not([href$="/lab.html"]):not(.avalon-language){display:none}.lightbox-page .avalon-language{margin-left:auto}.lightbox-main{width:100%;flex:1;min-height:0;padding:12px 16px;display:flex;flex-direction:column}.lightbox-breadcrumb{display:none}#opal-box-3d{flex:1;min-height:0;display:flex;flex-direction:column}#opal-box-3d .ob-heading{flex:none}#opal-box-3d .ob-heading h1{font-size:25px}#opal-box-3d .ob-workspace{flex:1;min-height:0;height:auto;grid-template-rows:minmax(220px,54%) minmax(0,1fr)}#opal-box-3d .ob-reset{margin-top:18px}.lightbox-footer{display:block}.lightbox-notes{font-size:12px}.lightbox-notes p{margin-bottom:12px}}@media(max-width:600px) and (max-height:650px){.lightbox-page .avalon-tool-nav{display:none}#opal-box-3d .ob-heading h1{font-size:21px}#opal-box-3d .ob-fixed-totals{padding:4px 8px}#opal-box-3d .ob-total{gap:0}#opal-box-3d .ob-caption{font-size:10px}#opal-box-3d .ob-total>output{font-size:16px}}
@media(max-width:600px){#opal-box-3d .viz-row{flex-wrap:nowrap;gap:5px}#opal-box-3d .viz-row .btn{flex:1;min-width:0;min-height:34px;padding:6px 4px;font-size:11px;white-space:nowrap}#opal-box-3d .ob-fixed-totals .text-small{font-size:10px}}@media(max-width:600px) and (max-height:650px){.lightbox-page .avalon-tool-nav{display:flex;padding:4px 16px;font-size:11px}#opal-box-3d .ob-workspace{grid-template-rows:minmax(230px,60%) minmax(0,1fr)}}