/* The approved full-width Autoscroll backdrop remains visible across the whole card. */
#mosaic .mosaic-card.as-demo-card{grid-column:1/-1;grid-row:span 56;min-height:900px;background:#173b45!important}
#mosaic .as-demo-card::after{display:none!important}
#mosaic .as-demo-card .as-scenery{inset:0;width:100%;height:100%}
#mosaic .as-demo-card .as-journey,#mosaic .as-demo-card .as-journey img{width:100%}
#mosaic .as-demo-card .card-meta,#mosaic .as-demo-card .card-meta .serial,#mosaic .as-demo-card .card-copy h2,#mosaic .as-demo-card .card-copy p,#mosaic .as-demo-card .shortcut{color:#fff!important;text-shadow:0 2px 9px #173525a8}
#mosaic .as-demo-card .shortcut{border-color:#ffffffb8!important}
#mosaic .as-demo-card .card-art{background:transparent!important;border:0!important;box-shadow:none!important;justify-content:flex-end;padding:0!important}
#mosaic .as-demo-card .as-chooser{background:linear-gradient(135deg,#402923ee,#6a432ced);border-color:#f1dcb1d9;box-shadow:0 15px 28px #15332b4d}
#mosaic .mosaic-card[data-setting="slowmo"] .art-image{transform:scale(.8)!important}
#mosaic .mosaic-card[data-setting="hide"] .art-image{transform:scale(.85);transform-origin:center}
#mosaic .mosaic-card[data-setting="hide"]{transition:background-color .24s ease,border-color .3s ease,box-shadow .3s ease}
.list-variation #mosaic .mosaic-card.as-demo-card{min-height:756px!important}
@media(max-width:800px){#mosaic .mosaic-card.as-demo-card{min-height:900px;grid-row:auto}#mosaic .as-demo-card .card-art{justify-content:center}}

/* One clean Forest Spring desktop with a single, readable audio notice. */
#mosaic .mosaic-card[data-setting="playing"] .green-card-art{width:100%;margin:0;padding:12px 0!important;overflow:visible!important}
#mosaic .mosaic-card[data-setting="playing"] .green-card-visual .sd-monitor{width:min(100%,850px);height:auto;aspect-ratio:1.67;border:2px solid #77644f;border-radius:15px;padding:7px;background:linear-gradient(145deg,#f9f4e9,#e4d8c4 70%,#fefbf3);box-shadow:0 12px 28px #6a4b2720}
#mosaic .mosaic-card[data-setting="playing"] .green-card-visual .sd-display{border:1px solid #b5a489;border-radius:8px;background-image:url('assets/desktop-wallpapers/lake-forest.jpg')!important;background-position:center;background-size:cover}
#mosaic .mosaic-card[data-setting="playing"] .green-card-visual .sd-menubar{display:flex}
.green-card-visual .sd-monitor[data-green-scene="playing"] .sd-browser,.green-card-visual .sd-monitor[data-green-scene="playing"] .sd-music{display:none}
.green-playing-notice{position:absolute;z-index:4;right:3.5%;top:12%;width:52%;min-height:23%;display:flex;align-items:center;gap:4%;padding:2.4%;border:1px solid #b7c9ae;border-radius:13px;background:#fafff2f5;box-shadow:0 9px 24px #193c2b4f;color:#173f2e;font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.green-playing-symbol{width:15%;aspect-ratio:1;flex:none;display:grid;place-items:center;border-radius:18%;background:#daefdb;color:#2f8d5c;font-size:clamp(20px,4.2cqi,48px)}
.green-playing-notice>div{min-width:0;flex:1}.green-playing-notice small{display:block;color:#4e9866;font-size:clamp(8px,.92cqi,13px);font-weight:750;letter-spacing:.1em}.green-playing-notice strong{display:block;margin-top:.35em;font-size:clamp(15px,2cqi,26px);line-height:1.13;letter-spacing:-.035em}.green-playing-notice p{margin:.4em 0 0;font-size:clamp(10px,1.12cqi,16px);line-height:1.3;color:#52745f}.green-playing-wave{display:flex;align-items:center;gap:3px;align-self:center;height:34px}.green-playing-wave i{width:3px;height:12px;border-radius:4px;background:#56a976;animation:pb-wave 1.2s ease-in-out infinite alternate}.green-playing-wave i:nth-child(2){height:24px;animation-delay:.14s}.green-playing-wave i:nth-child(3){height:16px;animation-delay:.28s}.green-playing-wave i:nth-child(4){height:29px;animation-delay:.42s}.green-playing-wave i:nth-child(5){height:11px;animation-delay:.56s}@keyframes pb-wave{to{height:6px}}

/* Browser chrome and actual page content are distinct, with complete tab and toolbar rows. */
.green-card-visual .sd-monitor .polished-browser{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#fffdf8;color:#24362d;display:flex;flex-direction:column;border-color:#869988;border-radius:10px;box-shadow:0 10px 23px #0f332d4a}
.pb-tabbar{height:15%;min-height:22px;display:flex;align-items:end;gap:1.5%;padding:0 2.5%;background:#e8eae3;border-bottom:1px solid #c8cfc1;white-space:nowrap;font-size:clamp(8px,1.07cqi,14px)}
.pb-lights{align-self:center;display:flex;gap:3px;margin-right:3%}.pb-lights i{width:.7em;height:.7em;border-radius:50%;background:#eb7462}.pb-lights i:nth-child(2){background:#eab847}.pb-lights i:nth-child(3){background:#6fb982}
.pb-tab{height:80%;min-width:40%;max-width:67%;display:flex;align-items:center;gap:.45em;padding:.2em .8em;background:#fffdf8;border-radius:7px 7px 0 0;overflow:hidden;text-overflow:ellipsis}.pb-tab span{margin-left:auto;color:#6e776c}.pb-favicon{color:#57996a}.pb-plus{align-self:center;color:#617166;font-size:1.2em}
.pb-toolbar{height:15%;min-height:22px;display:flex;align-items:center;gap:2%;padding:0 3%;border-bottom:1px solid #e0e4d9;background:#fffdf8;font-size:clamp(7px,.92cqi,13px);white-space:nowrap}.pb-nav{color:#566a5e}.pb-address{flex:1;min-width:0;padding:.38em .8em;border-radius:5px;background:#f1f3ec;color:#596b5d;text-align:center;overflow:hidden;text-overflow:ellipsis}.pb-menu{color:#576e60}
.pb-page{height:70%;min-height:0;padding:3.5%;background:#fffcf6;overflow:hidden}.pb-page header{display:flex;justify-content:space-between;align-items:center;gap:2%;padding-bottom:3%;border-bottom:1px solid #d7ddcf;font-size:clamp(7px,1cqi,13px);white-space:nowrap}.pb-page header strong{font-weight:750;letter-spacing:.08em}.pb-page header span{font-size:.8em;color:#738473}.pb-content{display:flex;align-items:stretch;gap:4%;height:76%;padding-top:4%}.pb-picture{width:47%;flex:none;border-radius:4px;background-size:cover;background-position:center;position:relative;overflow:hidden}.pb-journal{background-image:url('assets/desktop-wallpapers/green-treetops.jpg')}.pb-places{background-image:url('assets/desktop-wallpapers/green-woodland-path.jpg')}.pb-radio{background:linear-gradient(140deg,#1c665c,#8ac08c 65%,#ecddb0)}.pb-studio{background:linear-gradient(140deg,#315467,#91b0a4 60%,#ead09c)}.pb-radio::after,.pb-studio::after{content:'▶';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:29%;aspect-ratio:1;display:grid;place-items:center;border:2px solid #fff9;border-radius:50%;background:#092e31a3;color:#fff;font-size:clamp(12px,2cqi,25px)}
.pb-copy{min-width:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.pb-copy small{font-size:clamp(6px,.68cqi,10px);letter-spacing:.12em;color:#63846d;font-weight:700}.pb-copy h3{font-size:clamp(11px,1.75cqi,23px);line-height:1.06;letter-spacing:-.05em;margin:.45em 0}.pb-copy p{font-size:clamp(8px,.96cqi,13px);line-height:1.35;margin:0;color:#657367}.pb-action{font-size:clamp(7px,.87cqi,12px);background:#457d5f;color:#fff;border-radius:4px;padding:.55em .85em;margin-top:1em;font-weight:650}.pb-foot{font-size:clamp(6px,.7cqi,10px);color:#899888;padding-top:2%}
.green-card-visual .sd-monitor[data-green-scene="competingAudio"] .pb-audio-alert{z-index:5;right:3%;bottom:5%;width:49%;padding:1.5%;font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#fffef7f7}.pb-audio-alert strong{display:block;font-size:clamp(11px,1.2cqi,17px);color:#214634}.pb-audio-alert p{font-size:clamp(8px,.85cqi,12px);margin:.2em 0 .5em;color:#657569}.pb-audio-source{display:flex;align-items:center;gap:.5em;padding:.45em 0;border-top:1px solid #dce6d7;font-size:clamp(7px,.86cqi,12px)}.pb-audio-source>span{display:grid;place-items:center;width:1.8em;height:1.8em;border-radius:4px;background:#d9ecdf;color:#2c8053}.pb-audio-source small{margin-left:auto;color:#718273}

/* Spread consistent folders and documents across most of the desktop before they fade. */
.green-card-visual .sd-monitor[data-green-scene="desktopIcons"] .green-desktop-icons{inset:14% 5% 7%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));align-items:start;justify-items:center;gap:0;width:auto}
.green-card-visual .sd-monitor[data-green-scene="desktopIcons"] .green-desktop-item{width:auto;min-width:0;gap:.4cqi;font-size:clamp(7px,.87cqi,12px)}
.green-card-visual .sd-monitor[data-green-scene="desktopIcons"] .green-folder{width:5.1cqi;height:3.8cqi}.green-card-visual .sd-monitor[data-green-scene="desktopIcons"] .green-document{width:4.2cqi;height:4.6cqi}
@media(max-width:800px){.green-playing-notice{width:62%}.green-playing-wave{display:none}}
.green-playing-notice{width:58%;min-height:28%;padding:2.8%}
.green-playing-notice small{font-size:clamp(10px,1.18cqi,15px)}
.green-playing-notice strong{font-size:clamp(19px,2.7cqi,30px)}
.green-playing-notice p{font-size:clamp(12px,1.5cqi,18px)}
/* The list layout gives the Autoscroll photograph the whole viewport width. */
.list-variation #mosaic .mosaic-card.as-demo-card{width:100vw;margin-left:-4.2vw;padding-left:4.2vw;padding-right:4.2vw}
@media(max-width:800px){.list-variation #mosaic .mosaic-card.as-demo-card{margin-left:-5vw;padding-left:5vw;padding-right:5vw}}

/* Detach tab: ordinary Chrome proportions, no oversized visual callout. */
.green-card-visual .sd-monitor[data-green-scene="detachTab"] .polished-browser .pb-tabbar{height:10%;min-height:22px;padding:0 2%;font-size:clamp(8px,1.1cqi,12px)}
.green-card-visual .sd-monitor[data-green-scene="detachTab"] .polished-browser .pb-tab{height:77%;min-width:0;width:35%;max-width:45%;padding:.15em .65em;border-radius:5px 5px 0 0}
.green-card-visual .sd-monitor[data-green-scene="detachTab"] .polished-browser .pb-toolbar{height:11%;min-height:22px;font-size:clamp(7px,.95cqi,11px)}
.green-card-visual .sd-monitor[data-green-scene="detachTab"] .polished-browser .pb-page{height:79%}
.green-card-visual .sd-monitor[data-green-scene="detachTab"] .polished-browser .pb-favicon{font-size:.75em}

/* macOS desktop icons stack down the right edge, then continue left. */
.green-card-visual .sd-monitor[data-green-scene="desktopIcons"] .green-desktop-icons{inset:12% 3.5% auto auto;width:32%;height:80%;display:grid;grid-auto-flow:column;grid-template-rows:repeat(7,minmax(0,1fr));grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;justify-items:center;column-gap:.3cqi;row-gap:0}
.green-card-visual .sd-monitor[data-green-scene="desktopIcons"] .green-desktop-item{width:100%;max-width:9cqi;min-width:0}
.green-card-visual .sd-monitor[data-green-scene="desktopIcons"] .green-folder{width:4.2cqi;height:3.1cqi}
.green-card-visual .sd-monitor[data-green-scene="desktopIcons"] .green-document{width:3.5cqi;height:3.9cqi}

/* The list layout's centered art column otherwise collapses this preview to a line. */
.list-variation #mosaic .cursor-effects-art{align-items:stretch;justify-content:center;gap:clamp(12px,1.3vw,18px);padding:0 12px!important;box-sizing:border-box}
.list-variation #mosaic .cursor-effect-choices{width:100%;max-width:760px;align-self:center;gap:12px}
.list-variation #mosaic .cursor-effect-choices button{min-height:70px;height:clamp(70px,7.5vw,82px);gap:4px}
.list-variation #mosaic .cursor-effect-stage{flex:0 1 auto;align-self:stretch;width:100%;height:clamp(180px,20vw,230px);min-height:0;box-sizing:border-box}
@media(max-width:800px){.list-variation #mosaic .cursor-effects-art{padding:0!important}.list-variation #mosaic .cursor-effect-choices{gap:7px}.list-variation #mosaic .cursor-effect-choices button{min-height:66px;height:66px}}
