/* ROLLI v0.10.0 shared UI tokens; applies to app screens without altering camera capture. */
:root{--rolli-butter:#FAEFCB;--rolli-pink:#F8D1DC;--rolli-ivory:#FFFDF8;--rolli-navy:#203354;--rolli-coral:#D94F5B;--rolli-sage:#DCEBDD;--rolli-stroke:#EADCD5;--rolli-soft-shadow:0 12px 34px rgba(41,49,73,.075)}
body:not(.rolli-camera-mode){background:var(--rolli-ivory);color:var(--rolli-navy)}
body:not(.rolli-camera-mode) .app-topbar.site-nav{background:rgba(255,253,248,.97);border-bottom:1px solid var(--rolli-stroke);box-shadow:0 3px 18px rgba(36,48,74,.025)}
body:not(.rolli-camera-mode) .app-topbar .nav-create{background:var(--rolli-coral);border-radius:999px;color:#fff}
body:not(.rolli-camera-mode) .app-preview-tag{background:var(--rolli-butter);color:#935148}
body:not(.rolli-camera-mode) .app-screen.scrapbook-workspace{position:relative;isolation:isolate;padding-top:clamp(28px,3.2vw,56px);padding-bottom:90px}
body:not(.rolli-camera-mode) .app-screen.scrapbook-workspace::before{content:'';position:absolute;z-index:-1;left:-8vw;right:-8vw;top:0;height:clamp(255px,23vw,350px);border-radius:0 0 42px 42px;background:radial-gradient(circle at 86% 27%,var(--rolli-pink) 0,transparent 25%),linear-gradient(105deg,var(--rolli-butter),#fff9e8 72%);pointer-events:none}
body:not(.rolli-camera-mode) .app-screen-top{margin-bottom:30px;position:relative}
body:not(.rolli-camera-mode) .app-screen .crumb{background:#fffdfa;border-color:#e6d7d0;border-radius:999px;color:var(--rolli-navy);min-height:42px}
body:not(.rolli-camera-mode) .app-screen-label{color:#bb5960;letter-spacing:1.3px}
body:not(.rolli-camera-mode) .app-screen-intro{position:relative;margin-bottom:32px;min-height:125px}
body:not(.rolli-camera-mode) .app-screen-intro::after{content:'✿  ♡';position:absolute;right:8px;top:0;font:500 clamp(31px,4vw,52px) Georgia,serif;letter-spacing:12px;color:#e78291;opacity:.7;pointer-events:none}
body:not(.rolli-camera-mode) .app-screen .work-title{color:var(--rolli-navy);font-size:clamp(39px,5vw,64px);letter-spacing:-1.9px;line-height:1.1;overflow-wrap:anywhere;max-width:calc(100% - 95px)}
body:not(.rolli-camera-mode) .app-screen .work-title em{color:#bf493e}
body:not(.rolli-camera-mode) .app-screen .work-sub{color:#54627a;font-size:15px;max-width:660px;line-height:1.7}
body:not(.rolli-camera-mode) .app-screen .surface,body:not(.rolli-camera-mode) .app-screen .event-card,body:not(.rolli-camera-mode) .app-screen .keybox,body:not(.rolli-camera-mode) .app-screen .privacy-settings{background:#fffefa;border:1px solid var(--rolli-stroke);box-shadow:var(--rolli-soft-shadow);border-radius:25px}
body:not(.rolli-camera-mode) .app-screen .surface:nth-of-type(3n+2){border-color:#eedbe2}
body:not(.rolli-camera-mode) .app-screen .label-sm,body:not(.rolli-camera-mode) .app-screen .surface .label-sm{color:#bd534f}
body:not(.rolli-camera-mode) .app-screen .surface h2,body:not(.rolli-camera-mode) .app-screen .surface h3{color:var(--rolli-navy)}
body:not(.rolli-camera-mode) .app-screen .event-card{background:#fff6e7}
body:not(.rolli-camera-mode) .app-screen .hint-box{background:#fff5de;border:1px dashed #e8c99f;color:#735a54}
body:not(.rolli-camera-mode) .app-screen .field input:not([type=checkbox]):not([type=file]),body:not(.rolli-camera-mode) .app-screen select,body:not(.rolli-camera-mode) .app-screen textarea{background:#fff;border:1px solid #e4dce2;border-radius:15px;min-height:48px}
body:not(.rolli-camera-mode) .app-screen .field input:focus,body:not(.rolli-camera-mode) .app-screen select:focus,body:not(.rolli-camera-mode) .app-screen textarea:focus{outline:2px solid #efb6c6;border-color:#bf687e}
body:not(.rolli-camera-mode) .app-screen .btn-coral,body:not(.rolli-camera-mode) .app-screen button.btn-coral{background:var(--rolli-coral);border-color:var(--rolli-coral);border-radius:16px}
body:not(.rolli-camera-mode) .app-screen .stats .stat{background:#fff8e9;border-color:#ecdfce;border-radius:20px}
body:not(.rolli-camera-mode) .app-screen .stats .stat:nth-child(2){background:#fff0f4}
body:not(.rolli-camera-mode) .app-screen .stats .stat:nth-child(3){background:#edf5ed}
body:not(.rolli-camera-mode) .app-screen .memory-card{border-radius:18px;box-shadow:var(--rolli-soft-shadow)}
body:not(.rolli-camera-mode) .app-screen .panel-grid{gap:18px}
@media(max-width:700px){body:not(.rolli-camera-mode) .app-screen.scrapbook-workspace{padding:24px 16px 100px}body:not(.rolli-camera-mode) .app-screen.scrapbook-workspace::before{left:-16px;right:-16px;height:270px;border-radius:0 0 30px 30px}body:not(.rolli-camera-mode) .app-screen-intro::after{font-size:28px;letter-spacing:3px;right:0}body:not(.rolli-camera-mode) .app-screen .work-title{max-width:calc(100% - 52px);font-size:clamp(36px,9vw,50px)}body:not(.rolli-camera-mode) .app-screen .panel-grid{grid-template-columns:minmax(0,1fr)}body:not(.rolli-camera-mode) .app-screen .surface{padding:19px}}
@media(prefers-reduced-motion:reduce){.app-screen *{scroll-behavior:auto!important}}