/* Simulador da app Grabme (demo.grabme.pt) — reproduz a geometria da app real */
:root{
  --gm-orange:#FF9800;
  --gm-orange-2:#FFB547;
  --gm-ink:#1A1A1A;
  --gm-ink-2:#4A4A4A;
  --gm-bg:#FBF8FC;
  --gm-card:#FFFFFF;
  --gm-line:#E6E1EA;
  --gm-shade:rgba(0,0,0,.45);
}
html,body{height:100%}
body.gm{margin:0;background:#E9E5DF;font-family:"Inter",Roboto,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--gm-ink);-webkit-tap-highlight-color:transparent}
.gm *{box-sizing:border-box}
.gm-phone{position:relative;max-width:430px;height:100%;margin:0 auto;background:var(--gm-bg);overflow:hidden;display:flex;flex-direction:column}
@media (min-width:700px){
  body.gm{display:flex;align-items:center;justify-content:center;padding:24px 0}
  .gm-phone{height:min(880px,calc(100vh - 48px));width:410px;border-radius:44px;border:12px solid #1A1A1A;box-shadow:0 30px 60px rgba(0,0,0,.25)}
  .gm-side{display:block!important}
}
.gm-side{display:none;position:fixed;left:max(24px,calc(50% - 560px));top:50%;transform:translateY(-50%);width:300px;font-size:15px;line-height:1.55;color:#3A3A3A}
.gm-side b{display:block;font-size:22px;color:var(--gm-ink);margin-bottom:8px}

.gm-sim{background:var(--gm-ink);color:#FFFFFF;font-size:11.5px;text-align:center;padding:6px 12px;flex:none}
.gm-sim a{color:var(--gm-orange)}

.gm-bar{flex:none;background:var(--gm-orange);display:flex;align-items:center;gap:18px;padding:14px 14px;min-height:60px}
.gm-bar h1{margin:0;flex:1;font-size:21px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gm-ib{width:40px;height:40px;border:0;background:transparent;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--gm-ink);flex:none}
.gm-ib:active{background:rgba(0,0,0,.08)}

.gm-view{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;position:relative}
.gm-view[hidden]{display:none}

/* Início */
.gm-tiles{display:flex;gap:8px;padding:12px 10px 0;overflow-x:auto}
.gm-tile{flex:0 0 31%;aspect-ratio:9/16;max-height:190px;border-radius:12px;overflow:hidden;position:relative;border:0;padding:0;cursor:pointer;background:#2F7A65}
.gm-tile img{width:100%;height:100%;object-fit:cover;display:block}
.gm-tile span{position:absolute;left:0;right:0;bottom:0;padding:22px 8px 9px;background:linear-gradient(transparent,rgba(0,0,0,.75));color:#FFFFFF;font-size:15px;font-weight:700;text-align:left;line-height:1.1}
.gm-tile--ghost{background:#D9D3DE;display:flex;align-items:center;justify-content:center;color:#6B6470;font-size:12px;font-weight:600;text-align:center;padding:8px}

.gm-cards{padding:12px 10px 110px;display:flex;flex-direction:column;gap:12px}
.gm-card{display:block;width:100%;text-align:left;background:var(--gm-card);border:0;padding:0;border-radius:14px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.14);cursor:pointer;font:inherit;color:inherit}
.gm-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.gm-card__f{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;font-size:18px}
.gm-card__f svg{flex:none}

.gm-ccover{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:16px solid #9E9E9E;border-top:0}

/* Barra inferior do início */
.gm-tab{position:absolute;left:0;right:0;bottom:0;background:var(--gm-orange);display:flex;align-items:center;gap:22px;padding:10px 16px calc(14px + env(safe-area-inset-bottom,0px))}
.gm-tab__home{background:var(--gm-orange-2);border-radius:999px;padding:8px 18px;display:flex;align-items:center;gap:10px;font-size:17px}
.gm-fab{position:absolute;right:14px;bottom:calc(64px + env(safe-area-inset-bottom,0px));width:58px;height:58px;border-radius:50%;background:var(--gm-orange);border:0;box-shadow:0 3px 10px rgba(0,0,0,.28);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3}

/* Card aberto */
.gm-video{position:relative;background:#000;aspect-ratio:16/9;width:100%;flex:none}
.gm-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.gm-video__ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#FFFFFF;background:linear-gradient(160deg,#1F5A4A,#0F2E27);border:0;width:100%;cursor:pointer;font:inherit}
.gm-video__ph .p{width:72px;height:72px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center}
.gm-video__ph small{opacity:.8;font-size:12px}
.gm-content{background:#FFFFFF}
.gm-content .ribbon{display:none}
.gm-content .page{max-width:none;box-shadow:none;border-radius:0;min-height:0}
.gm-content .foot{padding-bottom:24px}
.gm-actions{flex:none;background:var(--gm-orange);display:flex;align-items:center;gap:26px;padding:10px 16px calc(12px + env(safe-area-inset-bottom,0px))}

/* Palavra-passe */
.gm-lock{padding:40px 24px;display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center}
.gm-lock input{font:inherit;font-size:18px;padding:12px 14px;border:2px solid var(--gm-line);border-radius:10px;width:100%;max-width:260px;text-align:center;letter-spacing:2px}
.gm-lock button{font:inherit;font-weight:600;background:var(--gm-orange);border:0;border-radius:10px;padding:12px 22px;min-height:46px;cursor:pointer}
.gm-lock .err{color:#A4271C;font-size:14px;min-height:20px}

/* Folhas e menus */
.gm-shade{position:absolute;inset:0;background:var(--gm-shade);z-index:10}
.gm-sheet{position:absolute;left:0;right:0;bottom:0;background:#FFFFFF;border-radius:22px 22px 0 0;padding:10px 0 calc(18px + env(safe-area-inset-bottom,0px));z-index:11}
.gm-sheet h2{font-size:15px;color:var(--gm-ink-2);font-weight:600;margin:8px 22px 6px}
.gm-sheet a,.gm-sheet button.row{display:flex;align-items:center;gap:16px;width:100%;padding:14px 22px;font:inherit;font-size:17px;color:var(--gm-ink);text-decoration:none;background:none;border:0;cursor:pointer;text-align:left}
.gm-sheet a:active,.gm-sheet button.row:active{background:#F3EFF5}
.gm-grip{width:44px;height:5px;border-radius:3px;background:#D9D3DE;margin:0 auto 6px}
.gm-qr{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 22px 8px}
.gm-qr img{width:220px;height:220px;image-rendering:pixelated;background:#FFFFFF;padding:10px;border-radius:14px;border:1px solid var(--gm-line)}
.gm-drawer{position:absolute;top:0;bottom:0;left:0;width:78%;max-width:330px;background:#F7F2F8;z-index:11;border-radius:0 24px 24px 0;display:flex;flex-direction:column;padding:40px 0 20px}
.gm-drawer .logo{font-family:"Playfair Display",Georgia,serif;font-weight:900;font-size:40px;padding:10px 26px 26px;border-bottom:1px solid #DDD5E0;margin-bottom:10px}
.gm-drawer a,.gm-drawer button{display:flex;align-items:center;gap:18px;padding:14px 26px;font:inherit;font-size:18px;color:var(--gm-ink);text-decoration:none;background:none;border:0;text-align:left;cursor:pointer}

.gm-toast{position:absolute;left:16px;right:16px;bottom:90px;background:var(--gm-ink);color:#FFFFFF;font-size:14px;padding:12px 14px;border-radius:12px;z-index:20;box-shadow:0 8px 24px rgba(0,0,0,.25)}

@media (prefers-reduced-motion:no-preference){
  .gm-sheet{animation:gmUp .22s ease-out}
  .gm-drawer{animation:gmIn .22s ease-out}
  .gm-view{animation:gmFade .18s ease-out}
}
@keyframes gmUp{from{transform:translateY(30px);opacity:.4}to{transform:none;opacity:1}}
@keyframes gmIn{from{transform:translateX(-30px);opacity:.4}to{transform:none;opacity:1}}
@keyframes gmFade{from{opacity:.4}to{opacity:1}}