/* QuintID: preserve the original card, with layouts for each screen size. */
html{scrollbar-gutter:stable}body{overflow-wrap:break-word}.app{width:calc(100% - 32px);display:flex;flex-direction:column;min-height:calc(100dvh - 48px)}.app-auth{max-width:480px;min-height:0}.app-auth .brandbar{justify-content:center}.app-auth .content{padding:24px}.app-workspace{max-width:1180px}.app-workspace>.content{flex:1;padding:24px}.app-workspace .brandbar{gap:16px}.app-workspace .brandbar .back{flex:none}.app-workspace[data-view="card"]>.brandbar{display:none}.heading{flex-wrap:wrap}.heading h1{min-width:0}.pet-grid{display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}.pet-grid .pet-tile{margin:0;min-width:0}.pet-tile.selected{border-color:#1874f7;background:#f5faff}.pet-info small{overflow-wrap:anywhere}.desktop-pets{display:none}.pet-detail{min-width:0;max-width:720px;margin:0 auto}.toolbar h1{min-width:0;overflow-wrap:anywhere}.card-heading{flex-wrap:wrap}.card-main>*{min-width:0}.secondary>div{min-width:0}.modules button{min-width:0;overflow-wrap:anywhere}.photo-action input{max-width:100%}.app-workspace nav{padding-bottom:max(12px,env(safe-area-inset-bottom))}.app-workspace[data-view="add"]{max-width:900px}.app-workspace[data-view="account"]{max-width:760px}.app-workspace[data-view="account"]>.content{width:100%;max-width:640px;margin:auto}.empty{padding:48px 16px}.muted{line-height:1.7}.app-auth .back{margin-top:8px}input[type="file"]{white-space:normal;max-width:100%}
@media(min-width:640px){
 .pet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.app-workspace>.content{padding:30px}.brandbar{padding:14px 30px}.app-workspace nav{display:flex;justify-content:center;gap:24px}.app-workspace nav button{min-width:88px}.app-workspace[data-view="add"] form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;align-items:start}.app-workspace[data-view="add"] form>label:first-child,.app-workspace[data-view="add"] form>label:has(textarea),.app-workspace[data-view="add"] form>.primary{grid-column:1/-1}.app-workspace[data-view="add"] form>label{min-width:0}.pet-detail .card-main{grid-template-columns:140px minmax(0,1fr) 112px;gap:18px}.pet-detail .card-main .pet-photo{width:140px;height:210px}.pet-detail .qr img{width:112px;height:112px}.digital-card{padding:22px}.card-heading img{width:150px;height:80px}dt{font-size:12px}dd{font-size:14px}.qid-number{font-size:12px}.modules button{font-size:13px;min-height:100px}.app-auth{margin:32px auto}.app-auth .content{padding:28px 32px}
}
@media(min-width:1024px){
 .app-workspace[data-view="card"]>.brandbar{display:flex}.app-workspace[data-view="list"] .pet-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pet-workspace{display:grid;grid-template-columns:minmax(280px,330px) minmax(0,1fr);gap:32px;align-items:start}.desktop-pets{display:block;min-width:0}.desktop-pets .heading{align-items:flex-start;gap:12px}.desktop-pets .heading h1{font-size:18px}.desktop-pets .pet-grid{grid-template-columns:minmax(0,1fr)}.desktop-pets .pet-photo{width:56px;height:64px}.desktop-pets .open-pet{gap:10px}.desktop-pets .pet-bottom{padding-left:78px}.pet-detail{width:100%;margin:0}.digital-card{padding:20px}.pet-detail .card-main{grid-template-columns:128px minmax(0,1fr) 104px;gap:14px}.pet-detail .card-main .pet-photo{width:128px;height:195px}.pet-detail .qr img{width:104px;height:104px}
}
@media(max-width:639px){
 html{scrollbar-gutter:auto}.app{width:100%;margin:0;min-height:100dvh;border:0;border-radius:0;box-shadow:none}.app-workspace>.content,.app-auth .content{padding:22px 18px}.brandbar{padding:10px 18px}.app-auth .brandbar img{width:160px;height:88px}.pet-detail .card-main{grid-template-columns:90px minmax(0,1fr) 78px;gap:10px}.pet-detail .card-main .pet-photo{width:90px;height:145px}.toolbar .role{max-width:85px;white-space:normal;text-align:center}.pet-bottom{padding-left:90px}.app-workspace[data-view="account"]>.content{max-width:none}
}
@media(max-width:359px){
 .app-workspace>.content,.app-auth .content{padding:18px 12px}.pet-detail .card-main{grid-template-columns:76px minmax(0,1fr) 66px;gap:8px}.pet-detail .card-main .pet-photo{width:76px;height:124px}.pet-detail .qr img{width:66px;height:66px}.pet-bottom{padding-left:12px}.brandbar img{max-width:150px}.digital-card{padding:10px}
}
