.honey-ar { --ar-ink:#173138; --ar-paper:#eff2ee; --ar-muted:#526970; --ar-rule:#c9d3cd; color:var(--ar-ink); font:400 15px/1.65 "Avenir Next",Avenir,"Segoe UI",sans-serif; box-sizing:border-box; }
.honey-ar *, .honey-ar *::before, .honey-ar *::after { box-sizing:border-box; }
.honey-ar[hidden] { display:none!important; }
dialog.honey-ar { border:0; padding:0; border-radius:12px; width:min(880px,calc(100% - 32px)); max-height:calc(100svh - 32px); background:var(--ar-paper); box-shadow:0 25px 100px #07191d60; }
dialog.honey-ar::backdrop { background:#07191d9c; backdrop-filter:blur(5px); }
.ar-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px 28px; border-bottom:1px solid var(--ar-rule); }
.ar-heading p { margin:0; font-size:11px; font-weight:600; letter-spacing:.13em; }
.ar-close { color:var(--ar-ink); background:transparent; border:1px solid var(--ar-rule); border-radius:50%; height:42px; width:42px; font:22px/1 sans-serif; cursor:pointer; }
.ar-layout { display:grid; grid-template-columns:1.05fr 1fr; }
.ar-artwork { margin:0; padding:26px; background:#e5ebe7; display:flex; flex-direction:column; justify-content:space-between; }
.ar-poster-link { display:flex; align-items:center; flex:1; }
.ar-poster { display:block; width:100%; max-height:320px; object-fit:contain; aspect-ratio:1/1; }
.ar-caption { margin-top:22px; border-top:1px solid #b7c5bd; padding-top:16px; }
.ar-caption h2 { margin:0 0 3px; font:400 35px/1.14 "Iowan Old Style",Palatino,serif; letter-spacing:-.025em; }
.ar-caption p { margin:0; color:var(--ar-muted); font-size:14px; }
.ar-copy { padding:28px 32px; }
.ar-kicker { margin:0 0 12px; color:#936440; font-size:10px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; }
.ar-copy h3 { margin:0; font:400 30px/1.18 "Iowan Old Style",Palatino,serif; letter-spacing:-.025em; }
.ar-instruction { color:var(--ar-muted); margin:16px 0 20px; font-size:14px; line-height:1.7; }
.ar-qr { display:block; width:174px; height:174px; background:white; border:1px solid #d5ddd6; border-radius:8px; }
.ar-hint { font-size:12px; color:var(--ar-muted); margin:16px 0 0; }
.ar-native-link { display:block; width:100%; max-width:300px; border-radius:6px; overflow:hidden; margin:16px 0 0; }
.ar-native-link img { display:block; width:100%; height:54px; }
.ar-download { display:flex; align-items:center; justify-content:center; min-height:44px; max-width:300px; margin-top:10px; padding:8px 12px; border:1px solid #9daea6; border-radius:6px; color:var(--ar-ink); text-decoration:none; font-size:13px; }
.ar-download:hover { background:#e0e8e2; }
.ar-download-note { margin:10px 0 18px; color:var(--ar-muted); font-size:11px; line-height:1.5; }
.ar-page-link { display:inline-block; margin-top:14px; min-height:36px; padding:7px 0; color:var(--ar-ink); font-size:12px; text-underline-offset:4px; }
.ar-size { margin-top:14px; color:var(--ar-muted); font-size:11px; }
.ar-status { color:#8a4336; font-size:12px; }
.honey-ar a:focus-visible, .honey-ar button:focus-visible { outline:3px solid #9a643a; outline-offset:4px; }
.ar-page { margin:0; background:#d9e3df; min-height:100svh; padding:35px 20px; }
.ar-page .honey-ar { max-width:960px; margin:0 auto; background:#eff2ee; border-radius:12px; overflow:hidden; }
.ar-brand { display:block; max-width:960px; margin:0 auto 26px; color:#173138; text-decoration:none; font:600 12px "Avenir Next",sans-serif; letter-spacing:.16em; }
.ar-collection { display:flex; flex-wrap:wrap; gap:10px 24px; padding:22px 28px; border-top:1px solid var(--ar-rule); }
.ar-collection a { color:var(--ar-muted); font-size:12px; text-underline-offset:4px; }
.ar-collection a[aria-current] { color:var(--ar-ink); font-weight:600; }
.ar-footer { max-width:960px; margin:18px auto; font:12px/1.7 "Avenir Next",sans-serif; color:#526970; }
.ar-footer a { color:inherit; }
@media (max-width:620px) { .ar-page { padding:20px 14px; } .ar-layout { grid-template-columns:1fr; } .ar-heading { padding:16px 20px; } .ar-artwork { padding:18px 22px; } .ar-poster { max-height:215px; aspect-ratio:1.5/1; } .ar-caption { margin-top:12px; padding-top:12px; } .ar-caption h2 { font-size:29px; } .ar-copy { padding:22px; } .ar-copy h3 { font-size:27px; } .ar-native-link { max-width:none; } .ar-qr { width:150px; height:150px; } .ar-instruction { margin-bottom:14px; } }
@media (max-width:620px) { .ar-download { max-width:none; } }
@media (prefers-reduced-motion:reduce) { dialog.honey-ar::backdrop { backdrop-filter:none; } }