/* BLF v74 – Chrome desktop/mobile compatibility layer */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;touch-action:manipulation}
body{min-width:0;max-width:100%;overflow-x:hidden}
img,svg,video,canvas{max-width:100%;height:auto}
button,a,input,select,textarea{touch-action:manipulation}
button,a,[role="button"]{-webkit-tap-highlight-color:rgba(255,214,107,.18)}
input,select,textarea{max-width:100%}
@supports(padding:max(0px)){
 body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
}
@media(max-width:900px){
 html,body{min-height:100%;min-height:100dvh}
 body{background-attachment:scroll!important;background-position:center top!important}
 button,.gold-btn,.swap,.close,.album-close{min-width:44px;min-height:44px}
 input,select,textarea{font-size:16px!important}
 .close,.album-close{top:max(10px,env(safe-area-inset-top))!important;right:max(10px,env(safe-area-inset-right))!important}
 .box{max-width:100%!important;margin-left:auto!important;margin-right:auto!important}
}
@media(max-width:600px){
 .box{padding-left:16px!important;padding-right:16px!important}
 .actions{flex-wrap:wrap}
 .actions button{flex:1 1 140px}
}
@media(hover:none) and (pointer:coarse){
 button,a,[role="button"]{cursor:default}
}

/* BLF v74 – broad phone layout (Chrome on Android/iOS) */
html,body{width:100%;max-width:100%;}
body{overscroll-behavior-y:auto}
@media(max-width:760px){
  body{overflow-x:hidden!important}
  .page{max-width:100%!important}
  .modal-bg,.modal-wrap,.logout-modal{padding-left:max(12px,env(safe-area-inset-left))!important;padding-right:max(12px,env(safe-area-inset-right))!important}
  .dialog,.modal,.logout-box{max-width:calc(100vw - 24px)!important}
  .actions,.modal-actions,.logout-actions{flex-wrap:wrap!important}
  .actions button,.modal-actions button,.logout-actions button{min-height:44px}
}
@media(max-width:430px){
  /* common controls */
  button,.gold-btn,.swap,.btn,.menu-btn,.album-btn{font-size:.88rem}
  input,select,textarea{width:100%;min-width:0}
  h1{overflow-wrap:anywhere}

  /* home screen */
  .page{padding-left:12px!important;padding-right:12px!important;padding-bottom:max(18px,env(safe-area-inset-bottom))!important}
  .account{width:100%!important;min-width:0!important;margin:0!important;padding:12px 14px!important}
  .user,.money{justify-content:center!important}
  .logout-btn{min-height:44px}
  .message-board{width:100%!important;margin:12px 0 0!important}
  .message-list{max-height:350px!important}
  .message-input-row{padding:9px!important}
  .message-send{flex-basis:44px!important;width:44px!important;height:44px!important}
  .menu{margin-top:18px!important;gap:10px!important}
  .menu-btn,.album-btn{padding:13px 12px!important;min-height:48px}
  .admin-btn,.new-pack-btn{width:100%!important;margin-top:12px!important;min-height:48px}
  .album-panel{width:100vw!important;padding:24px 14px max(20px,env(safe-area-inset-bottom))!important}

  /* market / trade / rules */
  .box{width:100%!important;margin:0!important;padding:68px 12px 20px!important;border-left:0!important;border-right:0!important;border-radius:0!important}
  .market{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .listing{padding:9px!important;min-width:0}
  .seller,.price{font-size:.78rem;overflow-wrap:anywhere}
  .timer{font-size:.82rem!important}
  .trade{gap:12px!important}
  .side{padding:12px!important}
  .side img{max-height:52vh;object-fit:contain}
  .rules{padding-left:20px!important;font-size:.92rem}

  /* admin */
  .topbar{flex-wrap:wrap!important}
  .topbar h1{font-size:25px!important}
  .topbar a{min-height:44px;display:flex;align-items:center}
  .panel{border-radius:16px!important;padding:13px!important}
  .toolbar>*{width:100%!important;min-width:0!important}
  .user-row{grid-template-columns:1fr!important;padding:12px!important}
  .user-row .btn{width:100%}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .card{padding:7px!important;border-radius:12px!important;min-width:0}
  .card small{font-size:10px;overflow-wrap:anywhere}
  .pack-preview{grid-template-columns:repeat(5,minmax(76px,1fr))!important;overflow-x:auto!important;padding-bottom:6px}
  .modal{width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px)!important;border-radius:16px!important}
  .edit-grid,.upload-grid,.coin-tools,.album-tools{grid-template-columns:1fr!important}
  .album-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
  .slot .x{width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important}

  /* album – retain book feel but keep cards readable */
  .album-page-body .album{width:100%!important;padding-left:4px!important;padding-right:4px!important}
  .v24-open{width:100%!important;height:88dvh!important}
  .v24-book{padding:5px!important}
  .v24-page{margin-left:8px!important;padding:6px!important}
  .v24-pocket-grid{gap:3px!important}
  .v24-page-head{font-size:10px!important}
}
@media(max-width:360px){
  .market{grid-template-columns:1fr!important}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .menu-btn,.album-btn{font-size:.8rem!important}
  .message-item{font-size:.72rem!important}
  .paper-page{padding-left:4px!important;padding-right:4px!important}
}
@media(orientation:landscape) and (max-height:500px){
  .account{padding:8px 12px!important}
  .menu{gap:7px!important}
  .menu-btn,.album-btn{padding-top:9px!important;padding-bottom:9px!important;min-height:44px}
  .dialog,.modal{max-height:calc(100dvh - 12px)!important}
}

/* BLF v75 – iPhone 13 / 390px portrait hardening */
@media (max-width:430px) and (orientation:portrait){
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{min-width:0!important;overflow-x:hidden!important}
  body,button,input,select,textarea{font-family:Montserrat,Arial,sans-serif}
  h1,h2,h3,p,li,.user,.money,.message-item,.seller,.price,.name,.card b,.card small{max-width:100%;overflow-wrap:anywhere;word-break:normal}

  /* Landing page: keep the long Hungarian title readable on 390px. */
  body>.page{width:100%!important;min-height:100dvh!important;padding:calc(20px + env(safe-area-inset-top)) 14px calc(20px + env(safe-area-inset-bottom))!important}
  body>.page>h1{width:100%!important;max-width:360px!important;font-size:clamp(1.75rem,8.1vw,2.35rem)!important;line-height:1.12!important;letter-spacing:0!important;-webkit-text-stroke:1.5px #f5c84c!important;text-shadow:-2px -2px 0 #000,2px -2px 0 #000,-2px 2px 0 #000,2px 2px 0 #000,0 0 14px rgba(0,0,0,.9)!important;margin-bottom:28px!important}

  /* Logged-in home: switch the desktop absolute layout to a real mobile flow. */
  .page>.account,.page>.message-board,.page>.menu,.page>.admin-btn,.page>.new-pack-btn{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important}
  .page>.account{order:1!important;width:100%!important;margin:0 0 10px!important}
  .page>.message-board{order:2!important;width:100%!important;margin:0 0 12px!important}
  .page>.menu{order:3!important;width:100%!important;margin:0!important;display:grid!important;gap:9px!important}
  .page>.new-pack-btn{order:4!important;width:100%!important;margin:12px 0 0!important}
  .page>.admin-btn{order:5!important;width:100%!important;margin:9px 0 0!important}
  .page{display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;padding-top:calc(14px + env(safe-area-inset-top))!important}
  .user,.money{font-size:.9rem!important;line-height:1.25!important;flex-wrap:wrap!important}
  .message-list{max-height:350px!important}
  .message-item{font-size:.75rem!important;line-height:1.4!important}
  .menu-btn,.album-btn,.admin-btn,.new-pack-btn{font-size:.78rem!important;line-height:1.2!important;white-space:normal!important}

  /* Pack reveal: five cards must fit inside 390px without text collision. */
  .pack-title{top:max(5%,env(safe-area-inset-top))!important;width:92%!important;font-size:clamp(18px,6vw,26px)!important;line-height:1.12!important}
  .pack-cards{gap:4px!important;padding:15vh 7px 10vh!important;align-items:center!important}
  .reveal-card{width:calc((100vw - 34px)/5)!important;max-width:72px!important;border-radius:7px!important}
  .reveal-placeholder{padding:4px!important}.reveal-placeholder b{font-size:16px!important}.reveal-placeholder span{font-size:6px!important;overflow-wrap:anywhere}
  .pack-done{width:92%!important;text-align:center!important;font-size:.68rem!important;line-height:1.3!important}

  /* Dialogs and forms */
  .dialog,.logout-box,.modal{width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)!important;padding:18px 14px!important}
  .actions,.logout-actions{gap:8px!important}
  .actions button,.logout-actions button{flex:1 1 120px!important;padding-left:10px!important;padding-right:10px!important;font-size:.8rem!important;white-space:normal!important}

  /* Market and trade */
  .box h1{font-size:1.65rem!important;line-height:1.12!important;padding-right:42px!important}
  .market{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .listing{padding:7px!important}.listing img{width:100%!important}.seller,.price{font-size:.7rem!important;line-height:1.25!important}.timer{font-size:.72rem!important}
  .trade{grid-template-columns:1fr!important;gap:9px!important}.side{padding:9px!important}.name{font-size:.95rem!important;line-height:1.25!important}.waiting{padding:25px 0!important}.swap{width:100%!important;min-width:0!important}

  /* Rules */
  .rules{font-size:.84rem!important;line-height:1.5!important;padding-left:18px!important}.rules ol{padding-left:18px!important}.rules>li{padding-left:2px!important}

  /* Admin: avoid label/button collisions at 390px. */
  .topbar{gap:8px!important}.topbar h1{width:100%!important;font-size:21px!important;line-height:1.12!important}
  .panel h2,.panel h3{font-size:1rem!important;line-height:1.25!important;overflow-wrap:anywhere}
  .toolbar{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .toolbar>*{width:100%!important;max-width:100%!important}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}.card b{font-size:.72rem!important;line-height:1.2!important}.card small{display:block;font-size:.62rem!important;line-height:1.25!important}
  .btn{white-space:normal!important;line-height:1.15!important;font-size:.72rem!important;padding-left:8px!important;padding-right:8px!important}
  .log-row{grid-template-columns:1fr!important;gap:5px!important}.log-time,.log-text{overflow-wrap:anywhere!important}
  .album-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}

  /* Album book: prioritize card space and prevent headers from colliding. */
  .v24-album-shell{padding:3px!important}
  .v24-open{width:100%!important;height:88dvh!important}
  .v24-book{padding:4px!important;border-width:2px!important}
  .v24-spine{width:10px!important}
  .v24-page{margin-left:8px!important;padding:5px!important}
  .v24-page-head{height:30px!important;font-size:9px!important;line-height:1.1!important;letter-spacing:.03em!important;gap:4px!important;white-space:normal!important}
  .v24-pocket-grid{height:calc(100% - 30px)!important;gap:3px!important}
  .v24-pocket.empty span{font-size:6px!important;right:3px!important;bottom:2px!important}
}

@media (max-width:380px) and (orientation:portrait){
  .market{grid-template-columns:1fr!important}
  .cards{grid-template-columns:1fr 1fr!important}
  body>.page>h1{font-size:1.72rem!important}
}

/* BLF v76 – mobile home layout: no overlapping fixed help panel */
@media (max-width:760px){
  .page>.album-help{
    position:relative!important;
    left:auto!important;right:auto!important;bottom:auto!important;top:auto!important;
    transform:none!important;
    width:100%!important;
    max-width:100%!important;
    margin:14px 0 0!important;
    padding:12px 14px!important;
    z-index:2!important;
  }
}
@media (max-width:430px) and (orientation:portrait){
  .page>.account{order:1!important}
  .page>.message-board{order:2!important}
  .page>.menu{order:3!important}
  .page>.new-pack-btn{order:4!important}
  .page>.admin-btn{order:5!important}
  .page>.won-cards{order:6!important}
  .page>.album-help{order:7!important;font-size:.72rem!important;line-height:1.42!important;margin-top:12px!important}
  .page>.won-cards:empty{display:none!important}
  .page>.menu{visibility:visible!important;opacity:1!important}
}

/* V80 – mobil: minden albumon kívüli felület kb. 10%-kal kisebb. */
@media (max-width:760px){
  body:not(.album-page-body){zoom:.9}
}


/* V82 – mobil fekvő Safari: a V80 zoom kikapcsolása és stabil kétoszlopos elrendezés. */
@media (max-width:900px) and (max-height:500px) and (orientation:landscape){
  body:not(.album-page-body){zoom:1!important;min-width:0!important;overflow-x:hidden!important}
  body:not(.album-page-body)>.page{width:100%!important;max-width:100vw!important;min-height:100dvh!important;margin:0!important;transform:none!important}
}