/* App-level additions on top of the Toss design system (styles.css). */
body{background:var(--grey100)}
.ds-page{padding-block:16px 140px}
.build{position:fixed;right:8px;bottom:calc(4px + env(safe-area-inset-bottom,0px));margin:0;font-size:11px;color:var(--grey400);pointer-events:none;z-index:1}

/* Home tiles: one job per tile, big tap targets */
.home-hello{padding:8px 4px 4px}
.tiles{display:grid;gap:12px}
.tile{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;background:#fff;border:0;border-radius:var(--r-lg);padding:22px 20px;text-align:left;cursor:pointer;width:100%;min-height:96px}
.tile:active{transform:scale(.99)}
.tile h2{font-size:20px;font-weight:700;line-height:1.4}
.tile p{font-size:15px;color:var(--text3);margin-top:4px;line-height:1.5}
.tile .go{font-size:24px;color:var(--grey400)}
.tile .ds-badge{margin-top:8px}
.notice{display:flex;gap:10px;align-items:flex-start;background:var(--blue50);color:var(--blue700);border-radius:var(--r-md);padding:14px 16px;font-size:15px;line-height:1.55}
.notice.grey{background:#fff;color:var(--text3)}
.notice.orange{background:var(--orange50);color:#8A4B00}

/* Step header (1/3 …) */
.steps{display:flex;gap:6px;align-items:center;font-size:14px;font-weight:600;color:var(--text3)}
.steps b{color:var(--primary)}

/* Kakao in-app browser guide */
.inapp{background:#fff;border-radius:var(--r-lg);padding:24px 20px;display:grid;gap:16px;margin-top:24px}
.inapp ol{margin:0;padding-left:20px;display:grid;gap:8px;font-size:17px;color:var(--text2)}

/* In-page confirm sheet */
.sheet-wrap{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:flex-end;justify-content:center;z-index:50}
.sheet{background:#fff;border-radius:24px 24px 0 0;padding:24px 20px calc(20px + env(safe-area-inset-bottom,0px));width:100%;max-width:600px;display:grid;gap:16px}

#view:focus{outline:none}