.demo-login{min-height:100dvh;position:relative;display:flex;align-items:center;justify-content:flex-end;padding:clamp(28px,5vw,76px);overflow:hidden;background:#e9d6ba;color:#342c24}
.demo-login-scene{position:absolute;inset:16px;pointer-events:none;overflow:hidden;border-radius:20px;background:#efe0c7 url("assets/login-storefront-v3.png") 44% center/cover no-repeat;box-shadow:0 20px 70px #49331b40}
.demo-login-scene:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 56%,#4736221a 100%)}
.demo-login-caption{position:absolute;left:clamp(24px,4vw,64px);bottom:clamp(27px,5vw,72px);z-index:2;text-align:left;color:#fff9e9;text-shadow:0 2px 12px #321e15}
.demo-login-caption span{display:block;font-size:11px;letter-spacing:.24em;font-weight:700}
.demo-login-caption strong{font-family:Georgia,serif;font-size:clamp(19px,2.4vw,32px)}
.demo-login-card{position:relative;z-index:3;width:min(410px,100%);padding:clamp(26px,3.5vw,45px);background:#fffaf2f7;border:1px solid #fffdf7;border-radius:23px;box-shadow:0 20px 65px #2b1c124d;backdrop-filter:blur(8px);text-align:center}
.demo-login-sprig{font:40px Georgia,serif;line-height:1;color:#6c7e58;margin-bottom:10px}
.demo-login-card .file-label{letter-spacing:.21em;color:#947653;font-size:11px}
.demo-login-card h1{font:700 clamp(31px,3vw,42px)/1.08 Georgia,serif;margin:8px 0 5px;color:#34271f}
.demo-login-card>p{line-height:1.5;color:#6a5a4a;font-size:13px;margin:13px 0 0}
.demo-login-card .demo-login-subtitle{font-size:10px;letter-spacing:.25em;color:#876f54;margin:0}
.demo-login-card form{display:grid;gap:8px;margin-top:22px;text-align:left}
.demo-login-card label{font-size:13px;font-weight:700;margin-top:8px}
.demo-login-card input{width:100%;padding:12px 14px;border:1px solid #e8dacc;border-radius:22px;background:#f5ece0;color:#34271f;font:inherit}
.demo-login-card input:focus{outline:3px solid #a7c8b4;outline-offset:1px}
.demo-login-card form button{width:100%;margin-top:5px;padding:13px;font-weight:700;border-radius:12px;background:#637a58;color:#fff;box-shadow:0 4px 0 #3f5238}
.demo-login-card form button:hover{background:#536b4a}
.demo-login-error{min-height:1.2em;margin:3px 0 0!important;color:#ac3f32!important;font-size:12px}
.demo-login-note{font-size:11px;margin:22px 0 0;max-width:33em}
.story .offers-exhausted{background:#925b4c;color:#fff;border-color:#814b3f}
.admin-link{display:inline-flex;align-items:center;gap:7px;padding:10px 14px;border-radius:10px;background:#e6efe5;color:#23483e;font-weight:700;text-decoration:none}
.admin-link:hover,.admin-link:focus-visible{background:#d7e8d7;text-decoration:underline}
.story-tutorial{max-width:640px;margin:auto;padding:4px 6px;color:#234246}
.story-tutorial .file-label{color:#947653;letter-spacing:.18em}
.tutorial-progress{display:flex;gap:6px;margin:14px 0 18px}
.tutorial-progress span{width:34px;height:5px;background:#e5d9c4;border-radius:10px}
.tutorial-progress span.on{background:#b98848}
.tutorial-illustration{height:126px;border-radius:15px;background:linear-gradient(135deg,#d2e3d7,#f1debe);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px #fff9}
.tutorial-illustration span{display:grid;place-items:center;width:84px;height:84px;border-radius:25px;background:#fffaf0;border:2px solid #d7b881;box-shadow:7px 8px 0 #a77b4a44;font:700 50px Georgia,serif;color:#7e6445;transform:rotate(-6deg)}
.story-tutorial h2{font:700 clamp(26px,3vw,36px)/1.16 Georgia,serif;margin:23px 0 12px}
.story-tutorial p{font-size:16px;line-height:1.6;margin:0 0 18px}
.story-tutorial aside{background:#edf6f0;border-left:4px solid #7ca48c;padding:12px 15px;border-radius:0 9px 9px 0;font-size:13px}
.story-tutorial footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px}
.story-tutorial footer>div{display:flex;gap:9px}
.story-tutorial footer button{font-size:13px}
@media(max-width:760px){.demo-login{align-items:flex-end;padding:12px;min-height:100dvh}.demo-login-scene{inset:8px 8px 38% 8px;background-position:42% center}.demo-login-scene:after{background:linear-gradient(0deg,#ead8be66,transparent 35%)}.demo-login-caption{display:none}.demo-login-card{width:100%;padding:20px;max-height:70dvh;overflow:auto;margin-bottom:1px}.demo-login-sprig{font-size:27px;margin-bottom:2px}.demo-login-card h1{font-size:28px;margin:5px 0}.demo-login-card>p{font-size:12px;margin:6px 0}.demo-login-card form{margin-top:8px}.demo-login-card input{padding:9px 11px}.demo-login-note{margin-top:8px!important}.story-tutorial footer{flex-wrap:wrap}.story-tutorial footer>div{margin-left:auto}}