#taxi-share-dialog{width:min(540px,calc(100vw - 28px));max-height:90dvh;box-sizing:border-box;padding:22px;overflow:auto;background:#f4ebd4;color:#283e36;border:2px solid #283e36;border-radius:18px}
#taxi-share-dialog::backdrop{background:#142d2caa}
#taxi-share-dialog h2{font-size:22px;line-height:1.4;margin:16px 0}
#taxi-share-dialog [data-share-preview]{display:block;width:100%;height:auto;border:1px solid #c9bea5;border-radius:12px}
#taxi-share-dialog [hidden]{display:none!important}
.taxi-share-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.taxi-share-actions .button{flex:1 1 120px;text-align:center;white-space:normal;text-decoration:none;font-size:14px}
.taxi-share-actions [data-share-kakao]{flex-basis:100%;background:#fee500;color:#191919;border-color:#e4ce00;font-weight:700}
.taxi-share-url{display:block;margin-top:16px;font-size:12px}
.taxi-share-url input{display:block;box-sizing:border-box;width:100%;margin-top:6px;padding:10px;border:1px solid #b9ac8e;background:#fff8e9;color:#283e36;font-size:13px;border-radius:6px}
#taxi-share-dialog [data-share-status]{font-size:13px;line-height:1.6;margin:12px 0 0}
/* Keep the card and all share actions inside the visible viewport. */
#taxi-share-dialog{width:min(820px,calc(100vw - 24px));max-width:820px;height:min(650px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);padding:18px;overflow:hidden;box-shadow:4px 4px 0 #283e3640}
#taxi-share-dialog[open]{display:flex;flex-direction:column}
#taxi-share-dialog>.dialog-top{flex:none;min-height:30px}
#taxi-share-dialog .dialog-top button{min-height:32px;padding:6px 12px}
#taxi-share-dialog h2{flex:none;margin:6px 0 12px;font-size:20px}
.taxi-share-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(240px,1fr);gap:18px;align-items:center}
#taxi-share-dialog [data-share-preview]{width:100%;height:100%;min-height:0;max-height:100%;object-fit:contain;border:0;border-radius:8px}
.taxi-share-controls{min-width:0;max-height:100%;overflow:auto;overscroll-behavior:contain;padding:0 4px 4px 0;scrollbar-width:thin}
.taxi-share-actions{margin:0;gap:8px}
.taxi-share-actions .button{min-height:44px;padding:10px 8px;font-size:13px;box-shadow:none;border-radius:7px}
.taxi-share-url{margin-top:12px}
.taxi-share-url input{padding:8px;font-size:12px}
#taxi-share-dialog [data-share-status]{font-size:12px;line-height:1.5;margin-top:8px;overflow-wrap:anywhere}
@media(max-width:600px) and (orientation:portrait){
 #taxi-share-dialog{width:calc(100vw - 20px);height:calc(100dvh - 24px);padding:12px}
 #taxi-share-dialog h2{font-size:18px;margin:4px 0 8px}
 .taxi-share-body{display:flex;flex-direction:column;gap:10px;align-items:stretch}
 #taxi-share-dialog [data-share-preview]{flex:1;width:100%;height:0;min-height:0}
 .taxi-share-controls{flex:none;max-height:55%;padding-bottom:2px}
 .taxi-share-url{margin-top:8px}
}
@media(orientation:landscape) and (max-height:550px){
 #taxi-share-dialog{height:calc(100dvh - 16px);max-height:calc(100dvh - 16px);padding:10px 14px}
 #taxi-share-dialog>.dialog-top{min-height:26px}
 #taxi-share-dialog h2{font-size:16px;margin:0 0 6px}
 .taxi-share-body{grid-template-columns:minmax(0,1fr) minmax(260px,1fr);gap:14px}
 .taxi-share-actions .button{min-height:38px;padding:7px 6px;font-size:12px}
 .taxi-share-url{margin-top:8px}
}