.deep-aarti { background:radial-gradient(ellipse at 10% 50%,#f4deb1,transparent 65%),#fff8e8; scroll-margin-top:100px; }
.deep-aarti-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:clamp(24px,5vw,72px); }
.deep-aarti-art { position:relative; width:100%; max-width:480px; margin:auto; overflow:hidden; border:6px solid #b2853e; border-radius:160px 160px 18px 18px; background:#382d12; box-shadow:0 22px 60px #57300c26,0 0 0 1px #e8cb88; }
.deep-aarti-art img { display:block; width:100%; height:auto; aspect-ratio:1048 / 1500; }
.deep-aarti-overlay { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.deep-aarti-art > img { transition:filter .7s ease; }
.deep-aarti-art.has-offering-light > img { filter:brightness(.8) saturate(.96); }
.deep-aarti-radiance { mix-blend-mode:screen; }
.deep-aarti-light-controls { display:flex; justify-content:center; margin-top:10px; }
.deep-aarti-light-controls button { font-size:.78rem; min-height:44px; }
.deep-aarti-art-caption { position:absolute; bottom:0; left:0; right:0; padding:22px 12px 12px; background:linear-gradient(transparent,#241407d9); color:#ffe9b5; text-align:center; font-family:Georgia,serif; font-size:1rem; letter-spacing:.06em; }
.deep-aarti-copy .deep-title { margin:.8rem 0 1rem; }
.deep-aarti-copy .deep-subtitle { margin:0; }
.deep-aarti-controls { max-width:480px; margin:18px auto 0; }
.deep-aarti-steps { list-style:none; padding:0; margin:1.6rem 0; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.deep-aarti-steps li { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid #e9d7b5; border-radius:14px; background:#ffffff80; }
.deep-aarti-steps li[aria-current="step"] { border-color:#9b4f26; background:#ffedc3; box-shadow:inset 3px 0 #9b4f26; }
.deep-aarti-steps li.is-complete { background:#f0f1dc; border-color:#c8cba5; }
.deep-aarti-steps li > span { display:grid; place-items:center; flex:0 0 32px; height:32px; border-radius:50%; color:#7a2432; background:#f9e5bb; font-size:1.1rem; font-weight:800; }
.deep-aarti-steps strong { display:block; color:#49252a; font-size:.94rem; }
.deep-aarti-steps small { display:block; margin-top:3px; color:#705c4c; font-size:.76rem; line-height:1.5; }
.deep-aarti-status { min-height:3em; margin-bottom:8px; font-size:.95rem; font-weight:700; color:#702936; }
.deep-aarti-progress { display:block; width:100%; height:7px; margin:0 0 20px; overflow:hidden; border:0; border-radius:20px; accent-color:#962f3c; background:#e9d9bc; }
.deep-aarti-progress::-webkit-progress-bar { background:#e9d9bc; }
.deep-aarti-progress::-webkit-progress-value { background:#962f3c; }
.deep-aarti-progress::-moz-progress-bar { background:#962f3c; }
.deep-aarti-restart { color:#682b32; background:transparent; border-color:#c7a87a; }
.deep-aarti button:disabled { opacity:.55; cursor:default; transform:none; }
.deep-aarti button:focus-visible,.deep-aarti a:focus-visible { outline:3px solid #7e2938; outline-offset:4px; }
.deep-aarti-note,.deep-aarti-motion-note { margin:20px 0 0; color:#776050; font-size:.82rem; line-height:1.7; }
.deep-aarti-note a { color:#812b37; text-decoration:underline; }
.deep-aarti [hidden] { display:none !important; }
.deep-aarti-guest { margin:12px 0; }
.deep-aarti-guest label { display:block; margin-bottom:6px; color:#5e3035; font-size:.82rem; font-weight:800; }
.deep-aarti-guest label span { color:#806d62; font-weight:500; }
.deep-aarti-guest input { width:100%; min-height:46px; padding:10px 13px; border:1px solid #c7a87a; border-radius:12px; background:#fffdf8; color:#3f2520; }
.deep-aarti-guest input:focus { outline:3px solid #7e293833; border-color:#7e2938; }
.deep-aarti-identity { margin:10px 0; color:#705c4c; font-size:.84rem; }
.deep-aarti-community { margin-top:44px; padding:28px; border:1px solid #e4c990; border-radius:24px; background:#fffdf8aa; text-align:center; }
.deep-aarti-community h3 { margin:8px 0; color:#4a2228; font:700 clamp(1.45rem,3vw,2rem) Georgia,serif; }
.deep-aarti-community p { color:#78665c; }
.deep-aarti-initials { display:flex; flex-wrap:wrap; justify-content:center; gap:9px; margin-top:18px; }
.deep-aarti-initials span { display:grid; width:44px; height:44px; place-items:center; border:1px solid #ddb971; border-radius:50%; color:#7b2331; background:#fff0ca; font-size:.82rem; font-weight:900; }
.deep-aarti-initials em { color:#806d62; }
.deep-aarti-sound { display:flex; align-items:center; gap:12px; margin-top:14px; color:#705c4c; font-size:.8rem; }
.deep-aarti-sound-toggle { flex-shrink:0; padding:8px 14px; min-height:44px; border:1px solid #c7a87a; border-radius:24px; background:transparent; color:#682b32; font:inherit; font-weight:700; }
.deep-aarti-dialog { width:100%; max-width:none; height:100%; height:100dvh; max-height:none; margin:0; padding:16px 24px 24px; border:0; color:#f8e5bc; background:radial-gradient(ellipse at 50% 40%,#291c10 0%,#100d0b 55%,#080706 100%); overflow:auto; overscroll-behavior:contain; }
.deep-aarti-dialog::backdrop { background:#080706; }
.deep-aarti-dialog:not([open]) { display:none; }
.deep-aarti-dialog[open] { display:flex; flex-direction:column; }
.deep-aarti-dialog-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; max-width:1000px; margin:0 auto 14px; }
.deep-aarti-dialog-heading h2 { margin:0; color:#f8e5bc; font:1.15rem Georgia,serif; }
.deep-aarti-lyrics-link { margin-left:auto; color:#f8e5bc; font-size:.85rem; text-decoration:underline; }
.deep-aarti-close { min-height:44px; padding:8px 18px; border:1px solid #b59b65; border-radius:30px; color:#f8e5bc; background:#ffffff0a; font-size:.9rem; }
.deep-aarti-close span { margin-left:8px; font-size:1.3rem; }
.deep-aarti-dialog-content { width:100%; margin:auto; }
.deep-aarti-dialog .deep-aarti-art { max-width:480px; max-width:clamp(180px,calc((100dvh - 285px) * .6987),480px); border-width:3px; box-shadow:0 0 65px #efae4720; }
.deep-aarti-dialog .deep-aarti-art.has-offering-light { box-shadow:0 0 70px #efae4736,0 0 20px #ffca6720; }
.deep-aarti-dialog .deep-aarti-controls { width:100%; max-width:440px; margin:12px auto 0; padding:0; border:0; }
.deep-aarti-dialog .deep-aarti-status { min-height:0; margin:0 0 8px; color:#f8e5bc; text-align:center; }
.deep-aarti-dialog .deep-aarti-progress { margin-bottom:12px; background:#493d2b; accent-color:#e5b85e; }
.deep-aarti-dialog .deep-aarti-progress::-webkit-progress-bar { background:#493d2b; }
.deep-aarti-dialog .deep-aarti-progress::-webkit-progress-value { background:#e5b85e; }
.deep-aarti-dialog .deep-aarti-progress::-moz-progress-bar { background:#e5b85e; }
.deep-aarti-dialog .deep-actions { flex-direction:row; justify-content:center; }
.deep-aarti-dialog .deep-button { flex:1; width:auto; min-height:48px; padding:10px; font-size:.85rem; }
.deep-aarti-dialog .deep-aarti-restart,.deep-aarti-dialog .deep-aarti-sound-toggle { color:#f8e5bc; border-color:#b59b65; }
.deep-aarti-dialog .deep-aarti-guest label,.deep-aarti-dialog .deep-aarti-identity { color:#f8e5bc; }
.deep-aarti-dialog .deep-aarti-guest label span { color:#d9c8a3; }
.deep-aarti-dialog .deep-aarti-guest input { border-color:#8d7548; background:#17130f; color:#fff8e8; }
.deep-aarti-dialog .deep-aarti-sound { justify-content:center; margin-top:8px; color:#e2cfaa; }
.deep-aarti-dialog .deep-aarti-motion-note { margin-top:8px; color:#e2cfaa; font-size:.75rem; }
.deep-aarti-dialog button:focus-visible { outline-color:#ffda7b; }
html.deep-aarti-focus-open { overflow:hidden; }
@media(prefers-reduced-motion:reduce) { .deep-aarti-art > img { transition:none; } }
@media(max-height:550px) and (min-width:600px) {
    .deep-aarti-dialog .deep-aarti-media { display:grid; grid-template-columns:auto minmax(230px,370px); align-items:center; justify-content:center; gap:24px; }
    .deep-aarti-dialog .deep-aarti-art { width:calc((100dvh - 100px) * .6987); max-width:320px; }
}
@media(max-width:767px) {
    .deep-aarti-grid { grid-template-columns:1fr; gap:28px; }
    .deep-aarti-art { max-width:360px; max-width:clamp(240px,calc((100svh - 220px) * .6987),360px); border-width:4px; border-radius:110px 110px 14px 14px; }
    .deep-aarti-copy { max-width:500px; margin:auto; width:100%; }
    .deep-aarti-copy .deep-title br { display:none; }
    .deep-aarti-steps { margin:1.2rem 0; }
    .deep-aarti-controls { max-width:360px; padding:12px; border:1px solid #e9d7b5; border-radius:18px; }
    .deep-aarti-status { min-height:0; }
    .deep-aarti-controls .deep-actions { flex-direction:row; gap:8px; }
    .deep-aarti-controls .deep-button { width:auto; flex:1; min-height:48px; padding:10px; font-size:.8rem; }
    .deep-aarti-community { margin-top:32px; padding:22px 14px; }
}
