
/* RON GROUP B9 source-faithful approved B6 mobile modal. Unique ID, <=767px only. */
#ron-b9-space { box-sizing:border-box;border:0;border-radius:14px;background:#f8f7f3;
 color:#1f2e24;width:min(440px,calc(100% - 20px));max-height:calc(100dvh - 30px);
 padding:0;box-shadow:0 25px 70px #0009;overflow:auto;overscroll-behavior:contain;
 font-family:Inter,"Segoe UI",system-ui,sans-serif;font-size:14px;line-height:1.45; }
#ron-b9-space,#ron-b9-space *{box-sizing:border-box;}
#ron-b9-space::backdrop{background:#101b16c9;backdrop-filter:blur(2px);}
#ron-b9-space .prototype-space-card{position:relative;background:#f7f6f2;}
#ron-b9-space .prototype-modal-close{position:absolute;right:15px;top:13px;
 width:32px;height:32px;border-radius:50%;border:1px solid #b9b4a9;background:#fff;
 color:#29382f;font-size:24px;cursor:pointer;}
#ron-b9-space .prototype-space-body p{font-size:13px;line-height:1.7;}
#ron-b9-space .prototype-btn{border-radius:2px;min-height:46px;width:100%;
 display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;
 line-height:1.25;padding:14px 17px;font-size:12px;font-weight:750;letter-spacing:.015em;
 text-decoration:none;cursor:pointer;}
#ron-b9-space .prototype-btn>span{font-size:17px;font-weight:500;}
#ron-b9-space .prototype-btn-primary{background:#d3b174;border:1px solid #d3b174;color:#1b2822;}
#ron-b9-space .prototype-btn-primary:hover{background:#e3c18b;}
#ron-b9-space .prototype-reference-disclaimer{font-size:10px!important;color:#6b766b;}
#ron-b9-space #prototype-space-image{display:block;width:100%;max-height:270px;
 aspect-ratio:1.35;object-fit:cover;background:#c7cbc3;}
#ron-b9-space :is(button):focus-visible{outline:2px solid #e7bf75;outline-offset:2px;}

#ron-b9-space{
  width:min(500px,calc(100% - 16px));
  max-height:calc(100dvh - 22px);
  border-radius:10px;
  overscroll-behavior:contain
}
#ron-b9-space .prototype-space-card{background:#f7f6f2;min-width:0}
#ron-b9-space .prototype-modal-close{
  position:absolute;right:12px;top:11px;z-index:18;
  width:37px;height:37px;background:#16251fe8;border:1px solid #d1c19575;
  color:#fff;box-shadow:0 2px 10px #0004
}
#ron-b9-space .prototype-space-gallery{background:#14211b;color:#f5f3ec}
#ron-b9-space .prototype-space-photo-stage{
  position:relative;overflow:hidden;background:#151e1a;
  width:100%;aspect-ratio:1.28;min-height:235px;max-height:400px
}
#ron-b9-space .prototype-space-photo-stage img#prototype-space-image{
  display:block;width:100%;height:100%;max-height:none;
  aspect-ratio:auto;object-fit:cover;background:#13211b;
  -webkit-user-select:none;user-select:none
}
#ron-b9-space .prototype-space-photo-stage[data-loading="true"]::after{
  content:"Loading next view…";pointer-events:none;
  position:absolute;bottom:11px;left:11px;z-index:4;
  background:#13231bdc;color:#fff3dd;
  padding:7px 10px;border:1px solid #d0b27c88;
  font-size:10px;letter-spacing:.02em
}
#ron-b9-space .prototype-photo-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:5;
  width:38px;height:46px;border:1px solid #b2b6a277;
  color:#f6f4ec;background:#0f1b16bd;border-radius:3px;
  font-size:30px;font-weight:400;line-height:1;display:grid;place-items:center;
  cursor:pointer;transition:background-color .15s
}
#ron-b9-space .prototype-photo-nav:hover{background:#304536e6}
#ron-b9-space .prototype-photo-nav-prev{left:8px}
#ron-b9-space .prototype-photo-nav-next{right:8px}
#ron-b9-space #prototype-photo-counter{
  position:absolute;bottom:12px;right:11px;z-index:6;
  font-size:11px;letter-spacing:.075em;color:#f4ead5;
  background:#11221ada;padding:7px 10px;border:1px solid #f3dab162
}
#ron-b9-space .prototype-photo-caption{
  padding:12px 17px 10px;min-height:62px;
  border-top:1px solid #d4c5a74a
}
#ron-b9-space #prototype-photo-kind{
  display:block;color:#ddbd84;font-size:9px;letter-spacing:.12em;font-weight:750
}
#ron-b9-space #prototype-photo-caption{
  font-size:11px;color:#c7d3c7;line-height:1.48;margin:4px 0 0
}
#ron-b9-space .prototype-photo-thumbs{
  display:flex;align-items:center;gap:7px;overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
  padding:0 15px 13px;scrollbar-width:thin
}
#ron-b9-space .prototype-photo-thumbs button{
  position:relative;flex:0 0 65px;width:65px;height:59px;padding:0;
  background:#28362b;border:2px solid transparent;border-radius:3px;
  overflow:hidden;scroll-snap-align:center;cursor:pointer
}
#ron-b9-space .prototype-photo-thumbs button[aria-current="true"]{border-color:#d9b476}
#ron-b9-space .prototype-photo-thumbs img{display:block;width:100%;height:100%;object-fit:cover}
#ron-b9-space .prototype-photo-thumbs button>span{
  position:absolute;bottom:0;right:0;background:#18251dcb;color:#fff;
  font-size:8px;padding:3px 4px
}
#ron-b9-space .prototype-space-body{padding:20px 19px 25px}
#ron-b9-space .prototype-space-context{
  display:flex;align-items:center;justify-content:space-between;gap:8px
}
#ron-b9-space .prototype-space-context .prototype-eyebrow{font-size:9px;color:#83653d}
#ron-b9-space #prototype-space-ref{
  font-size:10px;letter-spacing:.09em;font-weight:650;color:#5d665d;white-space:nowrap
}
#ron-b9-space #prototype-space-title{
  margin:13px 0 9px;font-size:29px;font-weight:600;line-height:1.07
}
#ron-b9-space .prototype-space-traits{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 14px
}
#ron-b9-space .prototype-space-traits span{
  font-size:10px;padding:5px 8px;border:1px solid #cec9ba;color:#526653;
  background:#edece4
}
#ron-b9-space #prototype-space-desc{
  font-size:12.5px;line-height:1.7;color:#536356;margin:0 0 16px
}
#ron-b9-space .prototype-space-sourcing{
  padding:17px 15px;background:#e7eade;border:1px solid #c6cebd;margin:0 0 15px
}
#ron-b9-space .prototype-space-sourcing h3,
#ron-b9-space .prototype-space-details h3{
  font-size:14px;line-height:1.34;color:#263a2e;font-weight:700;margin:0 0 11px
}
#ron-b9-space .prototype-space-sourcing #prototype-space-scope{
  font-size:11px;color:#566d5a;margin:0 0 12px
}
#ron-b9-space .prototype-space-sourcing ul{
  display:grid;gap:10px;list-style:none;padding:0;margin:0
}
#ron-b9-space .prototype-space-sourcing li{
  display:flex;gap:9px;align-items:flex-start;color:#243b2b;font-size:12px;line-height:1.42
}
#ron-b9-space .prototype-space-sourcing li::before{
  content:"";margin-top:6px;flex:0 0 5px;width:5px;height:5px;
  background:#bd9862;border-radius:50%
}
#ron-b9-space .prototype-space-details{margin:0 0 18px}
#ron-b9-space .prototype-space-tags{display:flex;flex-wrap:wrap;gap:7px}
#ron-b9-space .prototype-space-tags span{
  font-size:10.5px;padding:7px 9px;background:#f8f6ef;border:1px solid #d0cfc3;
  color:#536053
}
#ron-b9-space .prototype-space-actions{display:grid;gap:8px;margin:18px 0}
#ron-b9-space .prototype-space-next{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  width:100%;min-height:44px;padding:10px 13px;background:transparent;
  border:1px solid #9baea1;color:#28402f;font-weight:700;font-size:11.5px;cursor:pointer
}
#ron-b9-space .prototype-space-next>span{font-size:18px}
#ron-b9-space .prototype-reference-disclaimer{
  margin:15px 0 0;padding:11px 0 0;border-top:1px solid #d4d6c8;
  line-height:1.5;font-size:10px!important
}

/* Better scroll/tap experience with the same content at 375px and 430px. */
@media(max-width:767px){
  html[data-preview-variant="B"] #prototype-featured .prototype-more-heading strong{font-size:59px}
  #ron-b9-space{width:calc(100% - 12px);max-height:calc(100dvh - 12px)}
  #ron-b9-space .prototype-space-photo-stage{min-height:225px}
}
@media(max-width:375px){
  html[data-preview-variant="B"] #prototype-featured .prototype-featured-caption{padding:16px 12px}
  html[data-preview-variant="B"] #prototype-featured .prototype-more-heading strong{font-size:52px}
  html[data-preview-variant="B"] #prototype-featured .prototype-more-heading h3{font-size:16px}
  #ron-b9-space #prototype-space-title{font-size:26px}
  #ron-b9-space .prototype-space-photo-stage{min-height:205px}
}
@media(prefers-reduced-motion:reduce){
  #prototype-featured .prototype-more-preview img{transition:none}
  #ron-b9-space .prototype-photo-nav{transition:none}
}

@media(max-width:767px){
/* preview-card-sections-b3.css approved mobile modal rules */
#ron-b9-space .prototype-gallery-location{
    display:flex;align-items:center;flex-wrap:wrap;gap:6px;
    padding:12px 52px 12px 15px;min-height:39px;
    border-bottom:1px solid #c8ae7950;background:#14241b;color:#b6c7b6;
    font-size:9px;font-weight:700;letter-spacing:.042em;line-height:1.4
  }
#ron-b9-space .prototype-gallery-location strong{
    color:#efd09a;font-size:9px;font-weight:800
  }
#ron-b9-space .prototype-caption-status{
    display:flex;justify-content:space-between;align-items:center;gap:8px
  }
#ron-b9-space #prototype-section-progress{
    display:block;font-size:9px;white-space:nowrap;
    letter-spacing:.015em;color:#d8d9c9
  }
#ron-b9-space .prototype-photo-sections{
    display:flex;align-items:center;gap:6px;padding:9px 12px 10px;
    border-top:1px solid #50645170;overflow-x:auto;
    overscroll-behavior-x:contain;scrollbar-width:thin
  }
#ron-b9-space .prototype-photo-sections button{
    flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;
    min-height:36px;padding:7px 8px;white-space:nowrap;
    background:#2a3a30;border:1px solid #627768;
    border-radius:2px;color:#d5e0d5;cursor:pointer;
    font-size:10px;font-weight:700;letter-spacing:-.01em
  }
#ron-b9-space .prototype-photo-sections button small{
    min-width:16px;padding:1px 4px;background:#ffffff20;border-radius:3px;
    color:#e8ece5;font-size:9px;line-height:1.4
  }
#ron-b9-space .prototype-photo-sections button[aria-pressed="true"]{
    background:#ddba77;border-color:#ddba77;color:#1e2e23
  }
#ron-b9-space .prototype-photo-sections button[aria-pressed="true"] small{
    background:#4c3c2630;color:#243124
  }
#ron-b9-space .prototype-photo-thumbs button[data-photo-section="detail"]::after,
  #ron-b9-space .prototype-photo-thumbs button[data-photo-section="study"]::after{
    content:"";position:absolute;inset:0;border-top:2px solid #d5ad6e;pointer-events:none
  }
#ron-b9-space .prototype-photo-thumbs button[data-photo-section="study"]::after{
    border-top-color:#91b5a3
  }
#ron-b9-space .prototype-photo-thumbs button:focus-visible{
    outline:2px solid #f0ce92;outline-offset:2px
  }
#ron-b9-space .prototype-space-body{
    padding-top:19px
  }
/* preview-card-sections-b4.css approved mobile modal rules */
#ron-b9-space .prototype-photo-sections[data-section-count="4"]{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    overflow:visible;
  }
#ron-b9-space .prototype-photo-sections[data-section-count="3"]{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
#ron-b9-space .prototype-photo-sections[data-section-count="2"]{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
#ron-b9-space .prototype-photo-sections button{
    white-space:normal;
    line-height:1.3;
    min-width:0;
    min-height:40px;
    padding:7px 7px;
    justify-content:space-between;
    text-align:left;
    letter-spacing:0;
  }
#ron-b9-space .prototype-photo-sections button span{
    min-width:0;
  }
#ron-b9-space .prototype-space-photo-stage[data-photo-section="study"] img#prototype-space-image,
  #ron-b9-space .prototype-space-photo-stage[data-photo-section="client_voice"] img#prototype-space-image{
    object-fit:contain;
    background:#14241b;
  }
#ron-b9-space .prototype-space-photo-stage[data-photo-section="study"]{
    background:#122437;
  }
#ron-b9-space .prototype-space-photo-stage[data-photo-section="client_voice"]{
    background:#1d2b22;
  }
#ron-b9-space #prototype-photo-kind{
    max-width:65%;
    overflow-wrap:anywhere;
  }
#ron-b9-space .prototype-photo-thumbs button[data-photo-section="client_voice"]::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    border-top:2px solid #d4ad73;
  }
#ron-b9-space .prototype-gallery-location strong{
    overflow-wrap:anywhere;
  }
/* preview-card-sections-b5.css approved mobile modal rules */
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"]{
    aspect-ratio:auto;
    height:min(470px,53dvh);
    min-height:295px;
    max-height:470px;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color:#a6ab9c #efece4;
    background:#eeeae2;
    touch-action:pan-y;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"] img#prototype-space-image{
    display:block;
    width:100%;
    height:auto;
    min-height:0;
    max-height:none;
    object-fit:contain;
    background:#eeeae2;
    pointer-events:none;
    user-select:none;
    -webkit-user-select:none;
    -webkit-touch-callout:none;
    cursor:default;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"] .prototype-photo-nav{
    display:none;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"] #prototype-photo-counter{
    position:sticky;
    bottom:6px;
    float:right;
    margin-right:7px;
    margin-top:-30px;
    font-size:9px;
    padding:5px 7px;
    opacity:.8;
    pointer-events:none;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"]::after{
    content:"";
    display:block;
    clear:both;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"] img{
    border:0;
  }
#ron-b9-space .prototype-photo-caption[data-chat-preview="true"]{
    padding:10px 14px;
    min-height:0;
  }
#ron-b9-space .prototype-photo-caption[data-chat-preview="true"] #prototype-photo-kind{
    font-size:10px;
    letter-spacing:.04em;
    color:#e2c180;
    max-width:75%;
  }
#ron-b9-space .prototype-photo-caption[data-chat-preview="true"] #prototype-photo-caption{
    font-size:11px;
    line-height:1.4;
    max-width:100%;
  }
/* preview-card-sections-b6.css approved mobile modal rules */
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"]{
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:315px;
    min-height:315px;
    max-height:315px;
    padding:12px 20px;
    overflow:hidden;
    overscroll-behavior:contain;
    background:linear-gradient(135deg,#23352a 0%,#1b3026 60%,#2b3f31 100%);
    touch-action:pan-y;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"] img#prototype-space-image{
    display:block;
    flex:0 0 auto;
    width:auto;
    max-width:min(198px,62%);
    height:auto;
    max-height:280px;
    min-height:0;
    object-fit:contain;
    object-position:center center;
    background:#f6f3ee;
    border:1px solid rgba(221,198,155,.65);
    box-shadow:0 8px 23px rgba(5,15,11,.2);
    filter:none;
    opacity:1;
    image-rendering:auto;
    user-select:none;
    -webkit-user-select:none;
    -webkit-touch-callout:none;
    pointer-events:none;
    cursor:default;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"] #prototype-photo-counter{
    position:absolute;
    right:9px;
    bottom:9px;
    float:none;
    margin:0;
    font-size:9px;
    opacity:.83;
    pointer-events:none;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"]::after{
    display:none;
  }
#ron-b9-space .prototype-photo-caption[data-chat-preview="true"]{
    padding:10px 14px;
  }
#ron-b9-space .prototype-photo-caption[data-chat-preview="true"] #prototype-photo-caption{
    font-size:10.5px;
    line-height:1.45;
    color:#d1d9cd;
  }
}

@media(max-width:375px){
#ron-b9-space .prototype-photo-sections button{
    padding:7px 6px;font-size:9px;gap:5px
  }
#ron-b9-space .prototype-gallery-location{font-size:8px}
#ron-b9-space .prototype-photo-sections button{
    font-size:9px;
    gap:6px;
    padding:8px 7px;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"]{
    height:292px;
    min-height:292px;
    max-height:292px;
  }
#ron-b9-space .prototype-space-photo-stage[data-chat-preview="true"] img#prototype-space-image{
    max-height:260px;
  }
}
