/* ROLLI MOBILE MOCKUP V3
   วางต่อท้ายไฟล์ CSS เดิม (ต่อจาก V2) เพื่อให้ 3 หน้าจอตรงกับภาพตัวอย่าง
   1) กล้อง  2) Choose your film  3) Developed preview (Before/After)  */

@media (max-width:600px){
:root{
  --rolli-bg:#fbf8f1;
  --rolli-ink:#172337;
  --rolli-teal:#17a8a3;
  --rolli-bar:#f1eee8;
  --rolli-muted:#707987;
}

/* ---------- ซ่อนสกอร์บาร์ + ทำให้กดง่ายขึ้น ---------- */
html,body,*{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar,*::-webkit-scrollbar{display:none;width:0;height:0}
button,.btn,a.btn,[role="button"],.cam-tool,.mobile-film-card{min-height:44px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
/* กันไม่ให้แถบเลื่อนแนวนอนดันหน้าเว็บ */
html,body{overflow-x:hidden}

/* ---------- ส่วนหัว ROLLI ---------- */
.mobile-rolli-topbar strong{font-family:"Arial Rounded MT Bold","Nunito",system-ui,sans-serif;font-size:26px;font-weight:950;letter-spacing:.06em}
.mobile-rolli-topbar button{font-size:22px;color:var(--rolli-ink)}

/* ---------- 2) CHOOSE YOUR FILM ---------- */
.mobile-picker-title{text-align:center;margin:2px 4px 16px}
.mobile-picker-title h2{font-size:30px;font-weight:850}
.mobile-picker-title p{font-size:14px}

.mobile-film-picker{grid-template-columns:1fr 1fr;gap:10px}
.mobile-film-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:0;padding:10px;border:2px solid transparent;border-radius:18px;box-shadow:none;background:#efefec;transition:transform .15s}
.mobile-film-card:active{transform:scale(.98)}
.mobile-film-card b{margin-top:4px;font-size:16px;font-weight:800;color:var(--rolli-ink)}
.mobile-film-card small{font-size:11px;line-height:1.35;color:#6b7482}

/* สีพื้นการ์ดตามฟิล์ม */
.mobile-film-card:has(.film-rolli400){background:#dcecf4}
.mobile-film-card:has(.film-softdaylight){background:#eadcf7}
.mobile-film-card:has(.film-goldenhour){background:#fdecc4}
.mobile-film-card:has(.film-nightflash){background:#1b2638}
.mobile-film-card:has(.film-nightflash) b{color:#fff}
.mobile-film-card:has(.film-nightflash) small{color:#c3ccd9}
.mobile-film-card:has(.film-monostory){background:#efefec}

/* รูปตัวอย่างอยู่ขวา กระป๋องฟิล์มอยู่ซ้าย */
.mobile-film-swatch{position:relative;width:100%;height:92px;border-radius:0;background-color:transparent;background-repeat:no-repeat;background-position:right center;background-size:64% 100%,64% 100%}
.mobile-film-swatch:before{content:"";position:absolute;left:4%;top:4%;width:30%;height:92%;border-radius:7px;background:linear-gradient(90deg,#1b2a3b 0,#2b4a63 55%,#10192a 100%);box-shadow:0 5px 10px #0003}
.mobile-film-swatch:after{position:absolute;left:4%;top:34%;width:30%;color:#fff;font:900 7.5px/1.1 system-ui,sans-serif;text-align:center;white-space:pre;letter-spacing:0}
.film-rolli400:after{content:"ROLLI\A 400"}
.film-softdaylight:after{content:"SOFT\A DAYLIGHT"}
.film-goldenhour:after{content:"GOLDEN\A HOUR"}
.film-nightflash:after{content:"NIGHT\A FLASH"}
.film-monostory:after{content:"MONO\A STORY"}

/* ติ๊กถูกเมื่อเลือก */
.mobile-film-card.is-selected{padding:10px;border:3px solid var(--rolli-teal);box-shadow:0 8px 20px #17a8a33a}
.mobile-film-card.is-selected:after{content:"✓";position:absolute;top:8px;right:8px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--rolli-teal);color:#fff;font-size:14px;font-weight:900}

/* Mono Story = การ์ดกว้างเต็มแถว */
.mobile-film-card:has(.film-monostory){grid-column:1/-1;display:grid;grid-template-columns:46% 1fr;column-gap:12px;align-items:center}
.mobile-film-card:has(.film-monostory) .mobile-film-swatch{grid-row:1/3;height:84px}
.mobile-film-card:has(.film-monostory) b{align-self:end;margin:0}
.mobile-film-card:has(.film-monostory) small{align-self:start}

/* ปุ่ม Continue */
body[data-rolli-view="create"] #createForm button[type="submit"]{min-height:54px;border-radius:27px;background:var(--rolli-teal);font-size:17px;font-weight:700;box-shadow:0 8px 18px #17a8a340}

/* ---------- 1) หน้ากล้อง ---------- */
/* แถบฟิล์ม: กระป๋อง + ชื่ออัลบั้ม + ฟิล์ม + 8/24 + progress */
body.rolli-camera-mode .scrapbook-camera .camera-head{--pct:33%;position:relative;display:grid;grid-template-columns:44px 1fr auto;grid-template-rows:auto auto;column-gap:10px;row-gap:0;align-items:center;margin:0 0 12px;padding:10px 14px 12px;border-radius:20px;background:var(--rolli-bar);box-shadow:none}
body.rolli-camera-mode .scrapbook-camera .camera-head:before{content:"";grid-row:1/3;width:30px;height:46px;border-radius:7px;background:linear-gradient(90deg,#1b2a3b,#2b4a63 55%,#10192a);box-shadow:0 4px 8px #0003}
body.rolli-camera-mode .scrapbook-camera .camera-head span{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
body.rolli-camera-mode .scrapbook-camera .camera-head span:first-child{grid-column:2;grid-row:1/3;align-self:center;font-size:15px;font-weight:800;line-height:1.3}
body.rolli-camera-mode .scrapbook-camera .camera-head span:first-child:before{content:none}
body.rolli-camera-mode .scrapbook-camera .camera-head span:first-child:after{content:" ›";color:#536170}
body.rolli-camera-mode .scrapbook-camera .camera-head span:last-child{grid-column:3;grid-row:1;justify-self:end;font-size:15px;font-weight:600;color:#3b4859}
body.rolli-camera-mode .scrapbook-camera .camera-head:after{content:"";grid-column:3;grid-row:2;justify-self:end;width:62px;height:4px;margin-top:6px;border-radius:4px;background:linear-gradient(90deg,var(--rolli-teal) var(--pct),#dcd7cd var(--pct))}

/* กรอบโฟกัส 4 มุม */
body.rolli-camera-mode .scrapbook-camera .viewfinder{border-radius:22px;aspect-ratio:4/5}
body.rolli-camera-mode .scrapbook-camera .viewfinder:after{content:"";position:absolute;z-index:2;left:20%;right:20%;top:22%;height:44%;pointer-events:none;--c:#f6d27a;--l:26px;--t:3px;background:
  linear-gradient(var(--c),var(--c)) top left/var(--l) var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) top left/var(--t) var(--l) no-repeat,
  linear-gradient(var(--c),var(--c)) top right/var(--l) var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) top right/var(--t) var(--l) no-repeat,
  linear-gradient(var(--c),var(--c)) bottom left/var(--l) var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) bottom left/var(--t) var(--l) no-repeat,
  linear-gradient(var(--c),var(--c)) bottom right/var(--l) var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) bottom right/var(--t) var(--l) no-repeat}

/* ปุ่มซูม 0.5 / 1x / 2 */
.mobile-zoom-control{bottom:auto;top:calc(100% - 0px);position:absolute;padding:4px;background:#1b2638d9;backdrop-filter:blur(6px)}
.mobile-zoom-control button{min-width:46px;padding:8px 10px;font-size:13px;font-weight:600;color:#dfe5ee}
.mobile-zoom-control button.is-active{background:#fff;color:var(--rolli-ink);font-weight:800}

/* แถบเครื่องมือ: Flash (วงกลม+label) / ชัตเตอร์ / Switch */
body.rolli-camera-mode .camera-tools{grid-template-columns:1fr 96px 1fr;margin-top:22px}
body.rolli-camera-mode .scrapbook-camera .cam-tool{display:flex!important;flex-direction:column;align-items:center;gap:4px;min-height:0;padding:0;border:0;background:transparent;box-shadow:none;font-size:13px;font-weight:700;color:var(--rolli-ink)}
body.rolli-camera-mode .scrapbook-camera .cam-tool:before{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:var(--rolli-bar);font-size:24px;line-height:1}
body.rolli-camera-mode .scrapbook-camera #flashCam:before{content:"⚡"}
body.rolli-camera-mode .scrapbook-camera .cam-tool:last-child:before{content:"⟳"}
body.rolli-camera-mode .scrapbook-camera .shutter{width:90px;height:90px;min-width:90px;margin:0 auto;border:4px solid var(--rolli-teal);background:var(--rolli-teal);box-shadow:inset 0 0 0 5px var(--rolli-bg)}
body.rolli-camera-mode .scrapbook-camera .shutter:active{transform:scale(.95)}

/* ---------- 3) พรีวิวรูปที่ล้างแล้ว (Before / After) ---------- */
body.rolli-developed-mode .mobile-developed-preview{display:grid;grid-template-columns:1fr;position:relative}
body.rolli-developed-mode .mobile-developed-preview .developed-preview-stage,
body.rolli-developed-mode .mobile-developed-preview .developed-preview-head{grid-area:1/1}
/* ปุ่ม Before/After ลอยมุมขวาล่างของรูป */
body.rolli-developed-mode .mobile-developed-preview .developed-preview-head{align-self:end;justify-self:end;z-index:3;margin:0 12px 12px;padding:3px;border-radius:999px;background:#1b2638cc;pointer-events:none;font-size:0;letter-spacing:0}
body.rolli-developed-mode .mobile-developed-preview .developed-preview-head button{pointer-events:auto;border:0;padding:8px 16px;background:#fff;color:var(--rolli-ink);font-size:13px;font-weight:700}
body.rolli-developed-mode .mobile-developed-preview .developed-preview-stage{border-radius:22px}

/* การ์ดชื่อฟิล์มใต้รูป */
.mobile-developed-film-info{position:relative;margin:14px 0 4px;padding:14px 16px 14px 64px;border-radius:18px;background:var(--rolli-bar);box-shadow:none}
.mobile-developed-film-info:before{content:"";position:absolute;left:18px;top:50%;width:26px;height:40px;transform:translateY(-50%);border-radius:6px;background:linear-gradient(90deg,#1b2a3b,#2b4a63 55%,#10192a)}
.mobile-developed-film-info strong{font-size:16px;font-weight:800}
.mobile-developed-film-info small{font-size:12px}

/* ปุ่ม Retake / Save shot */
.mobile-developed-actions{grid-template-columns:1fr 1.3fr;gap:10px;margin-top:14px}
.mobile-developed-actions .btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:56px;border-radius:18px;font-size:16px;font-weight:700}
.mobile-developed-actions .btn:not(.btn-coral){border:0;background:var(--rolli-bar);color:var(--rolli-ink)}
.mobile-developed-actions .btn:not(.btn-coral):before{content:"↻";font-size:18px}
.mobile-developed-actions .btn-coral{border:0;background:var(--rolli-teal);color:#fff}
.mobile-developed-actions .btn-coral:before{content:"⤓";font-size:18px}
}

/* =====================================================================
   PART 2: ทับ rolli-home-2026.css + ปรับทั้งแอปให้เป็นสไตล์เดียวกับภาพตัวอย่าง
   (ต้องโหลดหลัง rolli-home-2026.css เท่านั้น)
   ===================================================================== */

/* ซ่อนองค์ประกอบมือถือบนจอใหญ่ */
.mobile-rolli-topbar,.mobile-picker-title,.mobile-zoom-control{display:none}

@media (max-width:600px){

/* ---------- พื้นหลังครีมทุกโหมด (ทับธีมมืดของ rolli-home-2026) ---------- */
body.rolli-camera-mode,body.rolli-guest-mode,body[data-rolli-view="create"],
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"],[data-rolli-view="host"]){background:#fbf8f1;color:#172337}
body.rolli-camera-mode #app,body.rolli-guest-mode #app{background:#fbf8f1}
.mobile-developed-preview[hidden]{display:none!important}

/* ---------- แถบหัว ROLLI ---------- */
.mobile-rolli-topbar{display:grid;grid-template-columns:44px 1fr 44px}
.mobile-picker-title{display:block}
.mobile-rolli-topbar button{min-height:0;width:44px;height:44px}
body[data-rolli-view] .app-topbar.nav{background:#fbf8f1;border-bottom:1px solid #eee7dc}
.app-topbar .logo{font-family:"Arial Rounded MT Bold","Nunito",system-ui,sans-serif;font-size:26px;font-weight:950;letter-spacing:.06em;text-transform:uppercase;color:#172337}
.app-topbar .logo span{display:none}

/* ---------- 1) กล้อง ---------- */
body.rolli-camera-mode .app-screen.scrapbook-workspace{display:block;min-height:100svh;padding:calc(12px + env(safe-area-inset-top,0px)) 16px calc(30px + env(safe-area-inset-bottom,0px))}
body.rolli-camera-mode .app-screen .panel-grid{width:100%;max-width:520px}

/* แถบฟิล์ม (ทับ position:absolute ของ rolli-home-2026) */
body.rolli-camera-mode .scrapbook-camera .camera-head,
body.rolli-developed-mode .scrapbook-camera .camera-head{display:grid;position:relative;top:auto;left:auto;right:auto;z-index:1;justify-content:normal}
body.rolli-camera-mode .scrapbook-camera .camera-head span{max-width:none;color:#172337;backdrop-filter:none;white-space:normal;overflow:visible;text-overflow:clip;font-size:inherit}
body.rolli-camera-mode .scrapbook-camera .camera-head span[data-v3]:after{content:none}
body.rolli-camera-mode .scrapbook-camera .camera-head span[data-v3] b{display:block;font-size:15px;font-weight:800;line-height:1.25}
body.rolli-camera-mode .scrapbook-camera .camera-head span[data-v3] b:after{content:" ›";color:#536170}
body.rolli-camera-mode .scrapbook-camera .camera-head span[data-v3] small{display:block;margin-top:2px;font-size:12px;font-weight:500;color:#707987}

/* ช่องมองภาพ */
body.rolli-camera-mode .scrapbook-camera .viewfinder{height:auto;min-height:0;aspect-ratio:4/5;border:0;border-radius:22px;background:#e6e0d5}
body.rolli-camera-mode .scrapbook-camera .camera-placeholder{background:#e9e3d9!important;color:#172337!important}
body.rolli-camera-mode .camera-placeholder .camera-off-icon{border-color:#9aa3ad;color:#172337}
body.rolli-camera-mode .camera-placeholder small{color:#667382}
body.rolli-camera-mode .camera-enable{background:var(--rolli-teal);color:#fff}

/* ปุ่มซูม: ลอยทับขอบล่างของช่องมองภาพ */
.mobile-zoom-control{display:flex;position:relative;top:auto;bottom:auto;right:auto;transform:none;z-index:3;width:max-content;margin:-58px auto 18px}
.mobile-zoom-control button{min-height:36px}
body.rolli-developed-mode .mobile-zoom-control,body.rolli-developed-mode .camera-native-cta{display:none}

/* แถบเครื่องมือ: Flash / ชัตเตอร์ / Switch */
body.rolli-camera-mode .scrapbook-camera .camera-tools{display:grid;grid-template-columns:1fr 96px 1fr;align-items:start;gap:8px;margin:6px 0 0;padding:0}
body.rolli-camera-mode .scrapbook-camera .cam-tool{flex:none;min-height:0;border:0;background:transparent;color:#172337;text-align:center}
body.rolli-camera-mode .scrapbook-camera .cam-tool b{font-size:13px;font-weight:700}
body.rolli-camera-mode .scrapbook-camera .cam-tool small{font-size:11px;font-weight:500;color:#707987}
body.rolli-camera-mode .scrapbook-camera .shutter{max-width:none}

/* ปุ่มจับเวลา / สถานะ */
body.rolli-camera-mode .scrapbook-camera .camera-native-cta{display:block;min-height:40px;margin:14px auto 0;border:1px solid #e3dcd1;background:#fff;color:#172337}
body.rolli-camera-mode .scrapbook-camera .camera-save-status{color:#667382}
body.rolli-camera-mode .scrapbook-camera .camera-recovery-actions .btn{background:#fff;color:#172337;border:1px solid #dcd5ca}

/* ---------- หน้าเข้าร่วมของแขก ---------- */
body.rolli-guest-mode .app-screen.scrapbook-workspace{justify-content:flex-start;padding-top:calc(34px + env(safe-area-inset-top,0px))}
body.rolli-guest-mode .guest-entry-card{background:#fff;border:1px solid #ebe4da;color:#172337;box-shadow:0 10px 28px #27384d14}
body.rolli-guest-mode .guest-entry-card>.label-sm{color:#0e8782}
body.rolli-guest-mode .guest-entry-card h1{color:#172337}
body.rolli-guest-mode .guest-entry-note,body.rolli-guest-mode .guest-entry-card>p:not(.label-sm){color:#6c7581}
body.rolli-guest-mode .guest-entry-stats{border-color:#ebe4da;color:#44505f}
body.rolli-guest-mode .guest-entry-stats span{background:#f6f2ea;border-color:#ebe4da}
body.rolli-guest-mode .guest-entry-stats b{color:#172337}
body.rolli-guest-mode .guest-entry-card .field label,body.rolli-guest-mode .guest-entry-card .checkline{color:#172337}
body.rolli-guest-mode .guest-entry-card .field input{background:#fff;border:1px solid #e3dcd1;color:#172337}
body.rolli-guest-mode .guest-entry-card .btn-coral{background:var(--rolli-teal);color:#fff}
body.rolli-guest-mode .guest-entry-card .fine{color:#707987}

/* ---------- แท็บล่าง ---------- */
body .app-tabbar{background:#fffffff2;border:1px solid #ebe4da;box-shadow:0 10px 30px #27384d26}
body .app-tabbar button{color:#516070}
body .app-tabbar button.active{background:#dff3f1;color:#0e8782}
body .app-tabbar button.active .tab-icon{color:#0e8782}

/* ---------- My rolls / Host space / Event studio ---------- */
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .app-screen-top{display:none}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .work-title{font-size:32px;line-height:1.1;letter-spacing:-.04em;color:#172337}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .work-title em{color:var(--rolli-teal);font-style:normal}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .work-sub{color:#6c7581}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .surface{border:1px solid #ebe4da;border-radius:22px;background:#fff;box-shadow:0 8px 24px #27384d0e}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .label-sm{color:#0e8782;letter-spacing:.14em}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .roll-list-item{border:1px solid #ebe4da;border-radius:18px;background:#fff;box-shadow:none}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .stat{border:1px solid #ebe4da;border-radius:18px;background:#fff}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .hint-box{border-radius:16px;background:#f1eee8;border:0}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .btn{border-radius:999px;font-weight:700}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .btn-ink,
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .btn-coral{background:var(--rolli-teal);border-color:var(--rolli-teal);color:#fff}
body:is([data-rolli-view="mine"],[data-rolli-view="account"],[data-rolli-view="join"]) .btn-outline{background:#fff;border:1px solid #dcd5ca;color:#172337}
body[data-rolli-view="account"] .rolli-auth-tabs button[aria-selected="true"]{background:var(--rolli-teal);color:#fff}
body[data-rolli-view="account"] .rolli-auth-form .field input:focus{outline:3px solid #17a8a32e;border-color:var(--rolli-teal)}
body[data-rolli-view="account"] .rolli-auth-footer button{color:#0e8782}

/* ---------- หน้าแรก (Landing) ---------- */
html:has(body[data-rolli-view="home"]),body[data-rolli-view="home"]{background:#fbf8f1;color:#172337}
body[data-rolli-view="home"] .two-tone-home{--paper:#fbf8f1;--ink:#172337;--ink-soft:#172337ad;background:#fbf8f1}
body[data-rolli-view="home"] .two-tone-home .hero h1{font-family:"Arial Rounded MT Bold","Nunito",system-ui,sans-serif;font-weight:900;transform:none;letter-spacing:-.05em}
body[data-rolli-view="home"] .app-topbar .nav-cta,
body[data-rolli-view="home"] .two-tone-home .button,
body[data-rolli-view="home"] .trial-toast-cta{background:var(--rolli-teal);border-color:var(--rolli-teal);color:#fff}
body[data-rolli-view="home"] .two-tone-home .counts button.active{background:var(--rolli-teal);color:#fff}
body[data-rolli-view="home"] .two-tone-home #how{background:#172337}

/* แถบเลือกฟิล์ม 01-05: เปลี่ยนจากแถบเลื่อนเป็นตาราง 2 คอลัมน์ ไม่มีสกอร์บาร์ */
body[data-rolli-view="home"] .two-tone-home .film-tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:26px;overflow:visible;border:0}
body[data-rolli-view="home"] .two-tone-home .film-tab{flex:none;min-height:66px;grid-template-columns:26px 1fr;padding:11px 12px;border:1px solid #e3dcd1;border-radius:16px;background:#fff}
body[data-rolli-view="home"] .two-tone-home .film-tab:last-child{grid-column:1/-1;border-right:1px solid #e3dcd1}
body[data-rolli-view="home"] .two-tone-home .film-tab.is-active{border:2px solid var(--rolli-teal);background:#e8f6f5}
body[data-rolli-view="home"] .two-tone-home .film-tab.is-active:after{display:none}
body[data-rolli-view="home"] .two-tone-home #how .steps{scrollbar-width:none}
}
/* Screen Orientation API fallback: keep the camera and shutter inside a
   portrait viewport when the browser refuses an orientation lock. */
html.rolli-camera-portrait-fallback body.rolli-camera-mode,
html.rolli-camera-portrait-fallback body.rolli-mobile-camera-route{overflow-x:hidden;overscroll-behavior:none}
html.rolli-camera-portrait-fallback body.rolli-mobile-camera-route .rolli-mobile-shell{min-height:100svh;height:auto;padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
html.rolli-camera-portrait-fallback body.rolli-mobile-camera-route .rolli-mobile-camera-card{max-height:none}
html.rolli-camera-portrait-fallback body.rolli-mobile-camera-route .rolli-mobile-viewfinder{aspect-ratio:4/5;max-height:48svh}
html.rolli-camera-portrait-fallback body.rolli-mobile-camera-route .rolli-mobile-camera-controls{position:relative;bottom:auto;z-index:4}
html.rolli-camera-portrait-fallback body.rolli-camera-mode .scrapbook-camera .viewfinder{height:min(52svh,560px);max-height:560px}
html.rolli-camera-portrait-fallback body.rolli-camera-mode .scrapbook-camera .camera-tools{position:relative;z-index:4}