/* PGLAB v20 — shared mobile editor system for ALUR + LAKAR */
.pglab-mobile-only{display:none!important}

@media(max-width:900px){
  html,body,.map-main,.brand-trail,.brand-carto{max-width:100%;overflow-x:hidden}
  .pglab-mobile-only{display:block!important}
  .pglab-scroll-rail{display:flex;align-items:center;gap:7px;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:3px 2px 7px}
  .pglab-scroll-rail::-webkit-scrollbar{display:none}
  .pglab-rail-btn{flex:0 0 auto;min-height:38px;border:1px solid #d8d3ca;background:#fff;color:#111;border-radius:999px;padding:9px 14px;font:750 11px/1 Inter,Arial,sans-serif;white-space:nowrap;cursor:pointer}
  .pglab-rail-btn.active{background:#fff;color:#FF5A1F;border-color:#FF5A1F;box-shadow:0 0 0 1px #FF5A1F inset}
  .pglab-rail-btn.accent{background:#FF5A1F;color:#fff;border-color:#FF5A1F}
  .pglab-control-panel{display:none;padding:9px 10px 11px;border:1px solid #ded9d0;border-radius:14px;background:#faf9f6}
  .pglab-control-panel.active{display:block}
  .pglab-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 8px}
  .pglab-panel-head strong{font-size:12px}.pglab-panel-head small{font-size:10px;color:#777}
  .pglab-option-row{display:flex;gap:7px;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px 1px 5px}
  .pglab-option-row::-webkit-scrollbar{display:none}
  .pglab-option-btn{flex:0 0 auto;border:1px solid #d7d2ca;background:#fff;border-radius:999px;padding:9px 13px;font:700 11px/1 Inter,Arial,sans-serif;color:#222;white-space:nowrap;cursor:pointer}
  .pglab-option-btn.active{border-color:#111;box-shadow:0 0 0 1px #111 inset;background:#f0eee9}
  .pglab-option-btn.orange{background:#FF5A1F;color:#fff;border-color:#FF5A1F}
  .pglab-compact-range{display:grid;gap:6px;margin:7px 0 10px}.pglab-compact-range>div{display:flex;justify-content:space-between;gap:10px;font-size:11px;font-weight:700}.pglab-compact-range output{color:#777;font-weight:600}.pglab-compact-range input[type=range]{width:100%;margin:0;padding:0}
  .pglab-compact-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:6px 0;padding:9px 10px;border:1px solid #e2ddd5;border-radius:10px;background:rgba(255,255,255,.58);font:700 11px Inter,Arial,sans-serif}
  .pglab-compact-toggle input{width:19px;height:19px;margin:0;accent-color:#111}
  .pglab-compact-select{display:grid;gap:5px;margin:7px 0;font-size:10px;font-weight:800;color:#666}.pglab-compact-select select,.pglab-compact-select input[type=number],.pglab-compact-select input[type=text],.pglab-compact-select textarea{width:100%;box-sizing:border-box;border:1px solid #d7d2ca;border-radius:9px;background:rgba(255,255,255,.58);padding:9px;font:600 12px Inter,Arial,sans-serif;color:#222}
  .pglab-compact-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pglab-compact-grid.one{grid-template-columns:1fr}
  .pglab-icon-btn{width:38px;height:38px;display:grid;place-items:center;border:1px solid #d7d2ca;background:#fff;border-radius:999px;font-size:18px;cursor:pointer}

  /* ALUR 3D model controls */
  .brand-trail .customizer{padding-top:10px}
  .brand-trail .customizer .customizer-head{margin-bottom:8px}
  .brand-trail .customizer .custom-grid{display:none!important}
  .pglab-alur-model-compact{display:block;margin-top:4px}
  .pglab-alur-model-compact .pglab-control-panel{margin-top:2px}
  .pglab-color-tabs{display:flex;gap:6px;margin-bottom:8px;overflow-x:auto;scrollbar-width:none}.pglab-color-tabs::-webkit-scrollbar{display:none}
  .pglab-color-row{display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 3px 8px}.pglab-color-row::-webkit-scrollbar{display:none}
  .pglab-alur-model-compact,.pglab-alur-model-compact>div,.pglab-alur-model-compact .pglab-control-panel{min-width:0;max-width:100%;box-sizing:border-box}
  .pglab-alur-model-compact .pglab-control-panel{overflow:hidden}
  .pglab-color-chip{flex:0 0 34px;width:34px;height:34px;border-radius:50%;border:2px solid #fff;background:var(--chip);box-shadow:0 0 0 1px #cfcac2;padding:0;cursor:pointer}.pglab-color-chip.active{box-shadow:0 0 0 2px #111}

  /* ALUR Color: viewport-bound panel. Keep the switch beside the Color label,
     and fit the complete 11-colour palette inside the block on normal phones. */
  .pglab-alur-model-compact .pglab-color-panel{
    width:min(100%,calc(100vw - 48px));
    max-width:calc(100vw - 48px);
    min-width:0;
    margin-right:auto;
    box-sizing:border-box;
    overflow:hidden;
  }
  .pglab-alur-model-compact .pglab-color-panel>.pglab-panel-head{
    justify-content:flex-start;
    gap:10px;
    width:100%;
    min-width:0;
    margin-bottom:7px;
  }
  .pglab-inline-toggle{
    display:inline-flex;
    align-items:center;
    gap:6px;
    flex:0 0 auto;
    margin-left:0;
    font:750 10px/1 Inter,Arial,sans-serif;
    color:#333;
    white-space:nowrap;
    cursor:pointer;
  }
  .pglab-inline-toggle input{appearance:none;-webkit-appearance:none;position:relative;width:32px;height:20px;margin:0;border:0;border-radius:999px;background:#d7d2ca;box-shadow:inset 0 0 0 1px rgba(17,17,17,.08);transition:background .16s ease;cursor:pointer}
  .pglab-inline-toggle input::after{content:'';position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.18);transition:transform .16s ease}
  .pglab-inline-toggle input:checked{background:#FF5A1F}
  .pglab-inline-toggle input:checked::after{transform:translateX(12px)}
  .pglab-alur-model-compact .pglab-color-tabs{width:100%;min-width:0;max-width:100%;overflow:visible;margin:0 0 7px;padding:1px 0 4px}
  .pglab-alur-model-compact .pglab-color-swatch-section{display:block;width:100%;min-width:0;max-width:100%;overflow:hidden;border-top:1px solid rgba(17,17,17,.07);border-bottom:1px solid rgba(17,17,17,.07);padding:6px 0 3px}
  .pglab-alur-model-compact .pglab-color-swatch-viewport{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 0 8px;position:relative}
  .pglab-alur-model-compact .pglab-color-swatch-viewport::-webkit-scrollbar{display:none}
  .pglab-alur-model-compact .pglab-color-swatch-viewport[hidden]{display:none!important}
  .pglab-alur-model-compact .pglab-color-swatch-track{
    display:grid;
    grid-template-columns:repeat(11,minmax(0,1fr));
    align-items:center;
    gap:clamp(1px,.7vw,3px);
    width:100%;
    min-width:0;
    padding:0 2px;
    box-sizing:border-box;
  }
  .pglab-alur-model-compact .pglab-color-swatch-track .pglab-color-chip{
    justify-self:center;
    flex:none;
    width:min(6.5vw,28px);
    height:min(6.5vw,28px);
    min-width:20px;
    min-height:20px;
  }

  /* LAKAR live composition mobile controls */
  .brand-carto #composer.pglab-mobile-composer{display:block!important}
  .brand-carto #composer.pglab-mobile-composer .map-controls{display:block!important;padding-right:0}
  .brand-carto #composer.pglab-mobile-composer .map-stage{margin-top:10px}
  .brand-carto #composer.pglab-mobile-composer .map-controls [data-mobile-compact-hidden="true"]{display:none!important}
  .pglab-lakar-compose-compact{margin:10px 0 2px}
  .pglab-lakar-compose-compact .pglab-control-panel{margin-top:2px}
  .pglab-lakar-compose-compact .pglab-show-cta{margin-top:10px}

  /* shared A4 sticky editing surface */
  #layoutEditor.pglab-mobile-editor{position:relative;margin-top:8px!important}
  #layoutEditor.pglab-mobile-editor>.customizer-head{margin-bottom:8px}
  #layoutEditor.pglab-mobile-editor .design-theme-panel,
  #layoutEditor.pglab-mobile-editor .lakar-design-theme-panel,
  #layoutEditor.pglab-mobile-editor .lakar-design-tools-panel{display:none!important}
  #layoutEditor.pglab-mobile-editor .editor-shell>.editor-toolbar,
  #layoutEditor.pglab-mobile-editor .editor-shell>.editor-subtoolbar,
  #layoutEditor.pglab-mobile-editor .editor-workspace>.editor-properties{display:none!important}
  #layoutEditor.pglab-mobile-editor .editor-workspace{display:block!important}
  #layoutEditor.pglab-mobile-editor .editor-workspace>.a4-stage-wrap{display:none!important}

  .pglab-mobile-artwork-shell{position:sticky;top:0;z-index:70;margin:0 -4px 10px;padding:5px 4px 7px;background:rgba(244,243,238,.96);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(17,17,17,.08);box-shadow:0 9px 24px rgba(17,17,17,.05)}
  .brand-carto .pglab-mobile-artwork-shell{background:rgba(245,242,235,.96)}
  .pglab-stage-holder{position:relative;display:flex;justify-content:center;align-items:flex-start;box-sizing:border-box;width:100%;max-height:59dvh;min-height:240px;padding:4px 2px 6px;border-radius:13px;background:#e9e6df;overflow:hidden}
  .pglab-stage-holder>.a4-stage-wrap{display:flex!important;justify-content:center!important;align-items:flex-start!important;box-sizing:border-box!important;width:100%!important;min-height:0!important;max-height:58dvh!important;margin:0!important;padding:2px!important;border-radius:10px!important;background:#e9e6df!important;overflow:hidden!important}
  .pglab-stage-holder #a4Canvas{width:auto!important;height:auto!important;max-width:96vw!important;max-height:57dvh!important;object-fit:contain!important;box-shadow:0 8px 24px rgba(0,0,0,.15)}
  .pglab-stage-tools{position:absolute;top:8px;right:8px;z-index:12;display:flex;gap:5px}.pglab-stage-tools button{width:35px;height:35px;border:1px solid rgba(0,0,0,.16);border-radius:999px;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);font-size:17px;box-shadow:0 3px 10px rgba(0,0,0,.08)}
  .pglab-a4-rail{padding:7px 2px 2px}
  .pglab-a4-inline{display:none;padding:6px 2px 0}.pglab-a4-inline.active{display:block}

  .pglab-show-cta{display:block;width:100%;margin:10px 2px 0;padding:13px 16px;border:1px solid #111;border-radius:14px;background:#111;color:#FF5A1F;font:800 14px/1.1 Inter,Arial,sans-serif;text-align:center;box-shadow:0 8px 20px rgba(17,17,17,.08)}
  .pglab-show-cta:active{transform:translateY(1px)}

  /* translucent overlay panels intentionally sit on the artwork */
  .pglab-editor-overlay{position:absolute;left:7px;right:7px;bottom:7px;z-index:11;display:none;max-height:52%;box-sizing:border-box;padding:12px;border:1px solid rgba(17,17,17,.12);border-radius:16px;background:rgba(248,247,243,.64);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 14px 36px rgba(0,0,0,.14);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .brand-carto .pglab-editor-overlay{background:rgba(248,246,240,.64)}
  .pglab-editor-overlay.active{display:block}
  .pglab-overlay-head{position:sticky;top:-12px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-12px -12px 10px;padding:10px 12px;background:rgba(248,247,243,.74);backdrop-filter:blur(12px);border-bottom:1px solid rgba(17,17,17,.08)}
  .brand-carto .pglab-overlay-head{background:rgba(248,246,240,.74)}
  .pglab-overlay-head strong{font-size:12px}.pglab-overlay-close{width:32px;height:32px;border:0;border-radius:999px;background:#111;color:#fff;font-size:16px}
  .pglab-overlay-section{display:grid;gap:8px;margin:0 0 12px}.pglab-overlay-section:last-child{margin-bottom:0}.pglab-overlay-section>strong{font-size:10px;letter-spacing:.11em;color:#777;text-transform:uppercase}
  .pglab-overlay-actions{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}.pglab-overlay-actions::-webkit-scrollbar{display:none}.pglab-overlay-actions button{flex:0 0 auto}
  .pglab-layer-mirror{display:grid;gap:6px}.pglab-layer-mirror button{width:100%;text-align:left;border:1px solid rgba(221,216,208,.9);background:rgba(255,255,255,.56);border-radius:9px;padding:9px;font:650 11px Inter,Arial,sans-serif}.pglab-layer-mirror button.active{background:rgba(17,17,17,.88);color:#fff;border-color:#111}

  .pglab-stage-fullscreen{position:fixed!important;inset:0!important;z-index:20000!important;margin:0!important;padding:env(safe-area-inset-top) 4px env(safe-area-inset-bottom)!important;background:#e9e6df!important}
  .pglab-stage-fullscreen .pglab-stage-holder{max-height:calc(100dvh - 64px)!important;height:calc(100dvh - 64px)!important;border-radius:0!important}
  .pglab-stage-fullscreen .pglab-stage-holder>.a4-stage-wrap{max-height:calc(100dvh - 70px)!important;height:100%!important}
  .pglab-stage-fullscreen .pglab-stage-holder #a4Canvas{max-height:calc(100dvh - 76px)!important;max-width:99vw!important}
  body.pglab-stage-fullscreen-open{overflow:hidden!important}

  /* Hide v19 LAKAR direct moved stage: v20 owns the mobile stage position */
  .brand-carto #layoutEditor>.a4-stage-wrap{display:none!important}

  /* LAKAR compact design rail */
  .pglab-lakar-quick .pglab-rail-btn{padding-left:12px;padding-right:12px}
  .pglab-map-layer-list{display:grid;grid-template-columns:1fr 1fr;gap:7px}.pglab-map-layer-list label{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0!important;padding:8px 9px;border:1px solid #ded8ce;border-radius:9px;background:rgba(255,255,255,.56);font-size:10px!important}.pglab-map-layer-list input{width:18px!important;height:18px!important;margin:0!important}

  /* reduce vertical whitespace in mobile editors */
  #layoutEditor.pglab-mobile-editor .customizer-head{padding-bottom:2px}
  #layoutEditor.pglab-mobile-editor .editor-shell{padding:0!important;border:0!important;background:transparent!important}
  #layoutEditor.pglab-mobile-editor{padding-bottom:8px}
}

@media(max-width:480px){
  .pglab-stage-holder{max-height:57dvh}.pglab-stage-holder>.a4-stage-wrap{max-height:56dvh!important}.pglab-stage-holder #a4Canvas{max-height:55dvh!important}
  .pglab-editor-overlay{max-height:56%}
  .pglab-compact-grid{grid-template-columns:1fr}
}

/* v21 — preserve every editor command and never crop the artwork on mobile */
@media(max-width:900px){
  .pglab-stage-holder{max-height:none!important;min-height:0!important;height:auto!important;overflow:visible!important;align-items:flex-start!important}
  .pglab-stage-holder>.a4-stage-wrap{max-height:none!important;min-height:0!important;height:auto!important;overflow:visible!important;width:100%!important;padding:3px!important;box-sizing:border-box!important}
  .pglab-stage-holder #a4Canvas{max-width:none!important;max-height:none!important;object-fit:contain!important;flex:0 0 auto!important}
  .pglab-stage-tools{top:7px;right:7px;gap:4px}
  .pglab-stage-tools button{width:34px;height:34px;min-width:34px;padding:0;display:grid;place-items:center}
  .pglab-mobile-artwork-shell{max-height:none!important}
  .pglab-stage-fullscreen .pglab-stage-holder{height:auto!important;max-height:none!important;overflow:auto!important}
  .pglab-stage-fullscreen .pglab-stage-holder>.a4-stage-wrap{height:auto!important;max-height:none!important}
  .pglab-stage-fullscreen .pglab-stage-holder #a4Canvas{max-width:none!important;max-height:none!important}
  .pglab-overlay-actions{padding-bottom:2px}
  .pglab-overlay-actions .pglab-option-btn{min-height:38px}
}
@media(max-width:480px){
  .pglab-stage-holder,.pglab-stage-holder>.a4-stage-wrap,.pglab-stage-holder #a4Canvas{max-height:none!important}
}

/* v25 — completed LAKAR Live Composition mobile controls */
@media(max-width:900px){
  .brand-carto #composer.pglab-mobile-composer{display:block!important;position:relative!important;overflow:visible!important}
  .brand-carto #composer.pglab-mobile-composer .map-controls.pglab-mobile-source-controls{display:none!important}
  .brand-carto #composer.pglab-mobile-composer .map-stage{
    position:relative!important;top:auto!important;z-index:1!important;
    width:100%!important;box-sizing:border-box!important;margin:0!important;
    padding:10px 8px 14px!important;overflow:visible!important;
    background:#e9e6df!important;box-shadow:none!important
  }
  .brand-carto #composer.pglab-mobile-composer .map-stage #mapCanvas{
    width:100%!important;max-width:100%!important;height:auto!important;max-height:none!important;
    object-fit:contain!important
  }
  .pglab-lakar-compose-compact{display:block!important;margin:7px 8px 12px;padding:0;min-width:0}
  .pglab-lakar-compose-rail{margin:0;padding:3px 0 7px}
  .pglab-lakar-compose-inline{display:none;margin-top:2px;padding:8px 9px 9px;border:1px solid #ded9d0;border-radius:14px;background:#faf9f6}
  .pglab-lakar-compose-inline.active{display:block}
  .pglab-lakar-compose-compact .pglab-show-cta{margin:8px 0 0}

  .pglab-lakar-compose-overlay{
    position:absolute;left:9px;right:9px;bottom:10px;z-index:45;display:none;
    max-height:min(72%,460px);box-sizing:border-box;padding:12px;
    border:1px solid rgba(17,17,17,.12);border-radius:18px;
    background:rgba(248,246,240,.64);
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
    box-shadow:0 16px 44px rgba(0,0,0,.18);
    overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch
  }
  .pglab-lakar-compose-overlay.active{display:block}
  .pglab-lakar-compose-overlay-head{
    position:sticky;top:-12px;z-index:2;display:flex;align-items:center;justify-content:space-between;
    gap:10px;margin:-12px -12px 10px;padding:10px 12px;
    background:rgba(248,246,240,.76);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(17,17,17,.08)
  }
  .pglab-lakar-compose-overlay-head strong{font-size:12px;color:#111}
  .pglab-lakar-compose-overlay-head button{
    width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:999px;
    background:#111;color:#fff;font-size:18px;line-height:1;padding:0
  }
  .pglab-compose-fade-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .pglab-compose-fade-card{
    min-width:0;padding:8px;border:1px solid rgba(221,216,208,.9);border-radius:11px;
    background:rgba(255,255,255,.50)
  }
  .pglab-compose-hint{display:block;color:#6f6b64;font-size:10px;line-height:1.4;margin-top:4px}
  .pglab-lakar-compose-overlay .pglab-compact-toggle,
  .pglab-lakar-compose-overlay .pglab-compact-select,
  .pglab-lakar-compose-overlay .pglab-map-layer-list label{background:rgba(255,255,255,.50)}
}
@media(max-width:480px){
  .pglab-lakar-compose-overlay{max-height:76%;left:7px;right:7px;bottom:8px}
  .pglab-compose-fade-grid{grid-template-columns:1fr}
}