/* Clean composition derived from the immutable desktop and phone masters. */
body.concept-rebuild{
  --night:#020d1e;
  --glass:#061a30;
  --blue:#4cc8ff;
  --amber:#ffbd55;
  position:relative;
  isolation:isolate;
  min-height:100svh;
  color:#f3f7ff;
  background:var(--night);
}
.concept-rebuild .concept-sky,.concept-rebuild .concept-sweep{
  position:absolute;
  inset-inline:0;
  background-image:var(--master);
  background-repeat:no-repeat;
  background-size:100% auto;
  pointer-events:none;
  z-index:-1;
}
.concept-rebuild{
  --master:url('reference/APPROVED-DESKTOP-MASTER.png');
}
.concept-rebuild .concept-sky{
  top:0;
  height:9.44vw;
  background-position:center top;
}
.concept-rebuild .concept-sky::after{
  content:"";
  position:absolute;
  inset:100% 49% auto 0;
  height:8vw;
  background:var(--master) left 16% / 196.08% auto no-repeat;
  mask-image:linear-gradient(#000,transparent);
}
.concept-rebuild .concept-sweep{
  bottom:0;
  height:9vw;
  background-position:center bottom;
  mask-image:linear-gradient(transparent,#000 28%);
}
.concept-rebuild .master-brand{position:absolute;width:1px;height:1px;overflow:hidden}
.concept-rebuild .composition{
  display:grid;
  grid-template-areas:"registration arlo viewer";
  grid-template-columns:minmax(0,538fr) minmax(0,210fr) minmax(0,752fr);
  align-items:start;
  width:100%;
  max-width:none;
  min-height:100svh;
  padding:9.46vw 1.2vw 9.8vw 1.64vw;
  gap:1.14vw;
}
.concept-rebuild .glass{
  min-width:0;
  align-self:start;
  border-radius:1.4vw;
  border:1px solid var(--blue);
  background:
    radial-gradient(ellipse at 46% 0,#0087d860,transparent 20%),
    radial-gradient(ellipse at 72% 100%,#0064ad65,transparent 30%),
    linear-gradient(140deg,#071e34,var(--night) 47%,#04172c);
  box-shadow:inset 0 0 8px #69caff40,0 2px 12px #0077ba44;
}
.concept-rebuild .registration{
  grid-area:registration;
  margin:0;
  padding:clamp(12px,1.12vw,18px);
}
.concept-rebuild .registration .category-cards{--category-columns:2;grid-template-columns:repeat(var(--category-columns),minmax(0,1fr))}
.concept-rebuild .category-cards > .solution-details{grid-column:1/-1;margin-top:0}
.concept-rebuild .registration .category-card{min-width:0}
.concept-rebuild .arlo{
  grid-area:arlo;
  align-self:start;
  position:sticky;
  top:20.65vw;
  margin:11.18vw 0 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
}
.concept-rebuild .arlo-companion{width:100%;aspect-ratio:1}
.concept-rebuild .arlo-orb{width:100%;height:100%;background:none;border:0;padding:0}
.concept-rebuild .orb{display:block;width:100%;height:100%}
.concept-rebuild .concept-arlo-art{
  display:block;
  position:absolute;
  inset:0;
  background:var(--master) 42.21% 42.97% / 701.77% 442.86% no-repeat;
  mask-image:radial-gradient(ellipse,#000 56%,transparent 77%);
}
.concept-rebuild .concept-arlo-art img{opacity:0}
.concept-rebuild .arlo h1{font-size:clamp(16px,2.1vw,34px);margin:0;text-align:center}
.concept-rebuild .arlo-introduction{font-size:clamp(11px,1.25vw,20px);text-align:center}
.concept-rebuild .viewer-column{
  grid-area:viewer;
  min-width:0;
  display:grid;
  gap:clamp(10px,1.14vw,20px);
}
.concept-rebuild #interest-form{display:contents}
.concept-rebuild .registration-contact{padding:clamp(12px,1.12vw,18px)}
.concept-rebuild .viewer{
  padding:1.65vw 1.8vw 2.4vw;
  margin:0;
}
.concept-rebuild .stage-window{height:24vw;aspect-ratio:auto}
.concept-rebuild .preview-controls{position:relative;z-index:2;margin-top:8px;font-size:12px}
.concept-rebuild .preview-controls button{padding:6px 9px;background:#092139;border:1px solid #3476a0;border-radius:6px}
@media(max-width:850px){
  body.concept-rebuild{--master:url('reference/MOBILE-CONCEPT-REFERENCE.png')}
  .concept-rebuild .concept-sky{height:9.6vw}
  .concept-rebuild .concept-sky::after{content:none}
  .concept-rebuild .concept-sweep{height:12.25vw}
  .concept-rebuild .composition{
    grid-template-areas:"arlo" "registration" "viewer" "contact";
    grid-template-columns:minmax(0,1fr);
    gap:2vw;
    padding:8vw 3.7vw 16vw;
  }
  .concept-rebuild .arlo{
    position:relative;
    top:auto;
    margin:0 auto;
    width:min(100%,24rem);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    padding:12px 8px 16px;
  }
  .concept-rebuild .arlo-companion{width:clamp(158px,49vw,230px)}
  .concept-rebuild .concept-arlo-art{background-position:24.55% 5.22%;background-size:475.98% auto}
  .concept-rebuild .arlo :is(h1,.arlo-introduction){display:none}
  .concept-rebuild .arlo .arlo-controls{margin:0}
  .concept-rebuild .arlo #voice-status:not(:focus){position:absolute;clip-path:inset(50%)}
  .concept-rebuild .arlo .embedded-film{position:static}
  .concept-rebuild .glass{border-radius:3vw;width:100%;max-width:none}
  .concept-rebuild .registration{margin:0}
  .concept-rebuild .viewer-column{display:contents}
  .concept-rebuild .viewer{grid-area:viewer;order:0;padding:2.4vw 2.8vw}
  .concept-rebuild .registration-contact{grid-area:contact}
  .concept-rebuild .stage-window{height:clamp(235px,66vw,420px)}
  .concept-rebuild .arlo-controls :is(#start-call,#mute,#end-call){width:38px;height:38px}
}
@media(max-width:350px){
  .concept-rebuild .registration .category-cards{--category-columns:1}
}

/* Keep the full selection accessible while the stage shows nearby panes. */
.concept-rebuild .viewer-selected-list{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:8px 0 0;
  padding:0;
  list-style:none;
}
.concept-rebuild .viewer-selected-list li{max-width:100%}
.concept-rebuild .viewer-selected-list .module-chip{
  border:0;
  padding:0;
  background:none;
  text-align:left;
  overflow-wrap:anywhere;
}
.concept-rebuild .viewer-selected-list .module-chip span{
  color:#ffdc91;
  border-color:#ffd080;
  background:#4d350e;
}
.concept-rebuild .viewer-selected-list .module-chip[aria-current=true] span{
  box-shadow:inset 0 0 4px #ffcf73,0 0 7px #ffac5480;
}

/* The glass canvas is behind both the workflow and its selection controls. */
.concept-rebuild .viewer > :is(.viewer-module-picker,#viewer-selection-status,#viewer-selected-modules){
  position:relative;
  z-index:1;
}
.concept-rebuild #preset-overview{
  position:relative;z-index:1;color:#e4f2ff;
  font-size:clamp(13px,1vw,15px);line-height:1.45;
}
.concept-rebuild #preset-overview summary{cursor:pointer}
.concept-rebuild .viewer[data-material=shader]{
  border-color:transparent;
}
.concept-rebuild .viewer[data-material=shader]::before,
.concept-rebuild .viewer[data-material=shader]::after{display:none}

.concept-rebuild #stage-strip[hidden]{display:none}

/* At the start of selected playback, preview the first four in order. */
.concept-rebuild .viewer[data-workflow-opening] .position-focus{left:0;width:41%}
.concept-rebuild .viewer[data-workflow-opening] .position-next{left:38%;width:26%}
.concept-rebuild .viewer[data-workflow-opening] .position-far{left:61%;width:22%}
.concept-rebuild .viewer[data-workflow-opening] .position-upcoming{
  left:81%;top:27%;width:19%;height:59%;z-index:0;
  transform:translateZ(-92px) rotateY(-15deg);
}
@media(width > 850px){
  .concept-rebuild .viewer .stage-window{container-type:inline-size}
  .concept-rebuild .viewer .workflow-card,
  .concept-rebuild .viewer[data-workflow-opening] .workflow-card{
    box-sizing:border-box;top:50%;left:var(--tile-center);translate:-50% -50%;
    width:52cqw;height:52cqw;
    transform:translateZ(var(--tile-depth)) scale(var(--tile-scale));
  }
  .concept-rebuild .viewer .workflow-card.position-focus{--tile-center:50%;--tile-depth:55px;--tile-scale:1}
  .concept-rebuild .viewer .workflow-card.position-previous{--tile-center:14.5%;--tile-depth:-28px;--tile-scale:.558}
  .concept-rebuild .viewer .workflow-card.position-next{--tile-center:84.5%;--tile-depth:-28px;--tile-scale:.558}
  .concept-rebuild .viewer .workflow-card.position-far{--tile-center:88.5%;--tile-depth:-78px;--tile-scale:.442}
  .concept-rebuild .viewer .workflow-card.position-history{--tile-center:7%;--tile-depth:-78px;--tile-scale:.385}
  .concept-rebuild .viewer[data-workflow-opening] .workflow-card.position-focus{--tile-center:20.5%;--tile-scale:.788}
  .concept-rebuild .viewer[data-workflow-opening] .workflow-card.position-next{--tile-center:51%;--tile-scale:.5}
  .concept-rebuild .viewer[data-workflow-opening] .workflow-card.position-far{--tile-center:72%;--tile-scale:.423}
  .concept-rebuild .viewer[data-workflow-opening] .workflow-card.position-upcoming{
    --tile-center:90.5%;--tile-depth:-92px;--tile-scale:.365;
  }
}
.concept-rebuild .viewer[data-workflow-opening] .workflow-card h3{
  white-space:normal;
  overflow-wrap:anywhere;
}
.concept-rebuild .viewer > #viewer-selected-progress{
  position:relative;
  z-index:1;
  text-align:center;
  margin:0;
}

.concept-rebuild .registration-contact h2{
  margin:0 0 10px;
  font-size:clamp(17px,1.4vw,22px);
}
.concept-rebuild .registration-contact .registration-details-content{
  border-top:1px solid #23587b;
  padding:10px 0 0;
  font-size:11px;
}

.concept-rebuild .module-thread{display:grid;gap:5px}
.concept-rebuild .thread-message{display:grid;grid-template-columns:26px minmax(0,1fr);gap:6px;align-items:start;font-size:10px}
.concept-rebuild .thread-avatar{width:24px;height:24px}
.concept-rebuild .thread-message strong{display:block;color:#d3edff}
.concept-rebuild .thread-message p{margin:2px 0 0;padding:4px 6px;background:#0b314a;border-radius:3px 8px 8px 8px;text-align:left}
.concept-rebuild .thread-reply{padding:4px;border-radius:8px}
.concept-rebuild .module-chart.mini-stats{display:block;margin:5px 0;padding:5px 7px;font-size:10px}
.concept-rebuild .module-chart svg{display:block;width:100%;max-height:75px;overflow:visible}
.concept-rebuild .module-chart .chart-guide{stroke:#3f6d88;fill:none;stroke-width:.6}
.concept-rebuild .module-chart .chart-area{fill:#187ab740}
.concept-rebuild .module-chart .chart-line{fill:none;stroke:#58d6ff;stroke-width:2}
.concept-rebuild .module-chart circle{fill:#ffca73;stroke:#09263d;stroke-width:1}
.concept-rebuild .module-chart .chart-labels{display:flex;justify-content:space-between;gap:2px;padding:0;background:none;font-size:7px}
@media(max-width:550px){
  .concept-rebuild .thread-message{grid-template-columns:18px minmax(0,1fr);gap:4px;font-size:8px}
  .concept-rebuild .thread-avatar{width:17px;height:17px}
  .concept-rebuild .module-chart svg{max-height:45px}
}

.concept-rebuild .document-sheet header,.concept-rebuild .document-sheet footer{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
}
.concept-rebuild .document-sheet header{justify-content:flex-start;padding-bottom:4px;border-bottom:1px solid #4e829d}
.concept-rebuild .document-sheet header > span{font-size:18px;color:#9cdfff}
.concept-rebuild .document-sheet dl{margin:5px 0}
.concept-rebuild .document-sheet dl div{display:flex;justify-content:space-between;gap:5px;font-size:9px}
.concept-rebuild .document-sheet dt{color:#a8c6db}
.concept-rebuild .document-sheet dd{margin:0;text-align:right}
.concept-rebuild .document-sheet footer{padding-top:4px;border-top:1px dashed #6e8fa8}
.concept-rebuild .document-sheet footer strong{color:#ffd48b;font-size:9px}
.concept-rebuild .visit-checklist ul{list-style:none;padding:0;margin:4px 0 0}
.concept-rebuild .visit-checklist li{
  display:grid;grid-template-columns:13px minmax(0,1fr) auto;gap:4px;
  align-items:center;padding:3px 0;border-top:1px solid #2f516c;font-size:9px
}
.concept-rebuild .visit-checklist li > span:first-child{color:#ffd48b}
.concept-rebuild .visit-checklist li small{color:#abc7d9}
@media(max-width:550px){
  .concept-rebuild .document-sheet dl div,.concept-rebuild .visit-checklist li{font-size:7px}
  .concept-rebuild .visit-checklist li{padding:1px 0}
  .concept-rebuild .visit-checklist li small{letter-spacing:0}
}

.concept-rebuild .stage-window{touch-action:pan-y;cursor:ew-resize}
.concept-rebuild .detailed-module h4{margin:0 0 4px;color:#a8e2ff;font-size:11px}
.concept-rebuild .detailed-module :is(dl,ol,table){margin:0;font-size:10px;width:100%}
.concept-rebuild .detailed-module table{border-collapse:collapse;text-align:left}
.concept-rebuild .detailed-module :is(th,td){padding:3px;border-bottom:1px solid #2a5976}
.concept-rebuild .detailed-module td{text-align:right;color:#f4d39e}
.concept-rebuild .detailed-module ol{list-style:none;padding:0}
.concept-rebuild .detailed-module li{border-left:2px solid #49a8d4;padding:2px 5px;margin:3px 0}
.concept-rebuild .detailed-module[data-view-kind=files] li{border-left:3px solid #ffb759;background:#0b3049}
.concept-rebuild .detailed-module[data-view-kind=timeline] li{border-left-style:dotted}
.concept-rebuild .detailed-module[data-view-kind=thread] dd{padding:3px 5px;background:#0b3049;border-radius:3px 8px 8px}
.concept-rebuild .detailed-module dt{color:#a5cce4}
.concept-rebuild .detailed-module dd{margin:0 0 4px}
@media(max-width:550px){
 .concept-rebuild .detailed-module h4{font-size:9px}
 .concept-rebuild .detailed-module :is(dl,ol,table){font-size:8px}
 .concept-rebuild .detailed-module :is(th,td,li){padding-block:1px}
}

.concept-rebuild .detailed-module h4{
  display:flex;align-items:center;gap:6px;padding-bottom:4px;border-bottom:1px solid #3b7290
}
.concept-rebuild .detailed-module h4::before{content:"◇";color:#ffcb80}
.concept-rebuild .detailed-module[data-view-kind=ledger] h4::before{content:"▦"}
.concept-rebuild .detailed-module[data-view-kind=timeline] h4::before{content:"◷"}
.concept-rebuild .detailed-module[data-view-kind=steps] h4::before{content:"⇢"}
.concept-rebuild .detailed-module[data-view-kind=files] h4::before{content:"▤"}
.concept-rebuild .detailed-module[data-view-kind=thread] h4::before{content:"◉"}
.concept-rebuild .detailed-module[data-view-kind=ledger] tbody tr:nth-child(odd){background:#16416255}
.concept-rebuild .detailed-module[data-view-kind=steps] li{border-radius:0 5px 5px 0;background:linear-gradient(90deg,#13547860,transparent)}
.concept-rebuild .detailed-module[data-view-kind=timeline] li strong{color:#ffce87}
.concept-rebuild .detailed-module[data-view-kind=profile] dl > div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:5px}
.concept-rebuild .detailed-module[data-view-kind=profile] dd{text-align:right}

.concept-rebuild .industry-explore{margin:0 0 10px}
.concept-rebuild .industry-explore label{color:#d8eaff;font-size:12px}
.concept-rebuild .industry-explore label span{color:#b4cada}
.concept-rebuild .industry-explore select{font-size:12px}
.concept-rebuild .category-card[data-industry-match]:not(.category-active):not(.category-selected){
  border-color:#73d8ff;
  box-shadow:inset 0 0 8px #41b9f755,0 0 6px #41b9f74d;
}

.concept-rebuild .category-card[hidden],
.concept-rebuild .module-chip[hidden]{display:none}

.concept-rebuild .industry-suggestions{margin-top:10px}
.concept-rebuild .industry-suggestions ul{margin:4px 0 8px;padding-inline-start:18px}
.concept-rebuild #industry-module-links{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px}
.concept-rebuild #industry-module-links button{
  font:inherit;padding:5px 10px;border:1px solid #ffd080;border-radius:20px;
  color:#ffdc91;background:#4d350e;cursor:pointer;
}

.concept-rebuild[data-click-only-viewer] .stage-window{cursor:grab;touch-action:pan-y;user-select:none}
.concept-rebuild[data-click-only-viewer] .stage-window *{-webkit-user-select:none;user-select:none}
.concept-rebuild[data-click-only-viewer] .stage-window:active{cursor:grabbing}
.concept-rebuild[data-click-only-viewer] .workflow-card{cursor:grab}
.concept-rebuild[data-click-only-viewer] .workflow-card:active{cursor:grabbing}
@media(min-width:851px){
  .concept-rebuild .viewer{padding-top:clamp(12px,1.12vw,18px)}
  .concept-rebuild :is(#registration-title,#viewer-title){
    font-size:clamp(20px,2vw,32px);
    line-height:1.1;
    margin-top:0;
  }
}

.concept-rebuild :is(#play-selected-modules,#toggle-selected-modules){
  min-height:32px;
  margin-top:7px;
  padding:5px 12px;
  border:1px solid #62c7f2;
  border-radius:20px;
  background:linear-gradient(#15577c,#071f35);
  box-shadow:inset 0 1px 3px #a0e5ff70,0 0 7px #26aaff55;
  color:#effaff;
  font-size:11px;
  font-weight:600;
}
.concept-rebuild :is(#play-selected-modules,#toggle-selected-modules):hover{
  border-color:#b0ebff;
  background:linear-gradient(#1a6b98,#0b2d48);
}

@media(max-width:850px){
  .concept-rebuild .viewer .workflow-card.position-focus{
    left:21%;width:58%;transform:translateZ(14px) rotateY(-3deg);
  }
  .concept-rebuild .viewer .workflow-card.position-previous{
    left:0;width:21%;transform:rotateY(5deg);
  }
  .concept-rebuild .viewer .workflow-card.position-next{
    left:79%;width:21%;transform:rotateY(-5deg);
  }
  .concept-rebuild .viewer .workflow-card:is(.position-history,.position-far,.position-upcoming){display:none}
  .concept-rebuild .viewer .workflow-card h3{white-space:normal;overflow-wrap:anywhere}
}

#registration-privacy{
  box-sizing:border-box;width:min(42rem,calc(100% - 2rem));max-height:85vh;
  overflow:auto;padding:1.25rem;border:1px solid #4cb2e7;border-radius:1rem;
  color:#edf7ff;background:#08192a;overscroll-behavior:contain;
}
#registration-privacy::backdrop{background:rgba(2,10,22,.8)}
#registration-privacy button{
  min-height:44px;padding:.5rem .85rem;border:1px solid #4cb2e7;border-radius:.6rem;
  color:inherit;background:#10314a;font:inherit;cursor:pointer;
}

.concept-rebuild .arlo-orb .orbit{
  display:block;inset:10% 11% 12% 11%;z-index:1;pointer-events:none;transform:none;
  border:0;box-shadow:none;filter:drop-shadow(0 0 3px #48c8ff);
  background:conic-gradient(from 24deg,transparent,#8dd9ff9e 8deg,#8dd9ffd4 270deg,#8dd9ff 307deg,#dcf6ff 318deg,#8dd9ff 324deg,transparent 343deg);
  -webkit-mask-image:radial-gradient(circle closest-side,transparent calc(100% - 2.6px),#000 calc(100% - 1.8px),#000 calc(100% - .65px),transparent 100%);
  mask-image:radial-gradient(circle closest-side,transparent calc(100% - 2.6px),#000 calc(100% - 1.8px),#000 calc(100% - .65px),transparent 100%);
  animation-duration:9s;
}
.concept-rebuild .arlo-orb .orbit-two{
  inset:12% 10% 9% 11%;opacity:.92;transform:scaleX(-1);animation-duration:13s;animation-delay:-5s;
}
@media(width > 850px){
  .concept-rebuild .arlo-companion{width:112%}
  .concept-rebuild .arlo :is(h1,.arlo-introduction){display:none}
  .concept-rebuild .arlo-orb .orbit{top:8%;bottom:14%}
  .concept-rebuild .arlo-orb .orbit-two{top:10%;bottom:11%}
}
@media(prefers-reduced-motion:reduce){
  .concept-rebuild .arlo-orb .orbit{animation:none}
}

.concept-rebuild .arlo-controls :is(#start-call,#mute,#end-call){
  border-color:#71c9f5;
  box-shadow:inset 0 1px 2px #6fbee550,0 0 7px #45b6f04d;
}
.concept-rebuild .arlo-controls #start-call{color:#8ee8ff}
.concept-rebuild .arlo-controls #mute{color:#bceaff}
.concept-rebuild .arlo-controls #mute svg{stroke:currentColor}
.concept-rebuild .arlo-controls #mute[aria-pressed=true]{color:#ffc77b}
.concept-rebuild .arlo-controls #end-call{color:#ffc77b}
.concept-rebuild .arlo-controls :is(#start-call,#mute,#end-call):focus-visible{
  outline:2px solid #edf7ff;outline-offset:3px;
}