@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Newsreader:opsz,wght@6..72,500;6..72,650&display=swap";:root{color:#172531;--sans:"DM Sans", ui-sans-serif, system-ui, sans-serif;--serif:"Newsreader", Georgia, serif;--paper:#fffdf8;--canvas:#eeece7;--ink:#172531;--muted:#5c656e;--line:#d8d6d0;--accent:#e65345;--accent-dark:#c93d32;--accent-button:#c93d32;--accent-button-hover:#b8352b;--sage:#407f5c;--focus:#1477b8;font-synthesis:none;background:#ebe9e4;font-family:DM Sans,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}html,body,#root{min-width:320px;height:100%;margin:0}body{overflow:hidden}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[role=button]:focus-visible{outline:2px solid var(--focus);outline-offset:2px;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus) 30%, transparent);border-color:var(--focus)!important}.preview-overlay :focus-visible,.crop-toolbar :focus-visible,.export-toast :focus-visible{outline-color:#7cc4f0;box-shadow:0 0 0 4px #7cc4f059}button{color:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.42}::selection{color:var(--ink);background:#f5b8b0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#a6aaa9 padding-box padding-box;border:3px solid #0000;border-radius:9px}::-webkit-scrollbar-track{background:0 0}.app-shell{background:var(--canvas);grid-template-rows:64px minmax(0,1fr) 148px;grid-template-columns:minmax(0,1fr);height:100dvh;display:grid}.topbar{border-bottom:1px solid var(--line);z-index:20;background:#fbfaf7;grid-template-columns:165px minmax(0,220px) minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:0 20px;display:grid;overflow:hidden}.brand{color:var(--ink);font-family:var(--serif);align-items:center;gap:9px;font-size:26px;font-weight:650;text-decoration:none;display:inline-flex}.brand svg{width:24px}.brand-button{background:0 0;border:0;border-radius:4px;width:fit-content;min-height:38px;padding:0}.brand-button:hover{color:var(--accent-dark);background:0 0;border-color:#0000}.project-picker{align-items:center;gap:7px;min-width:0;display:flex}.project-picker>svg{width:17px;color:var(--muted);flex:none}.project-picker label{flex:1;min-width:0;position:relative}.project-picker label>span{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.project-picker select{width:100%;min-width:0;min-height:38px;color:var(--ink);text-overflow:ellipsis;background:#fff;border:1px solid #c8c8c4;border-radius:8px;padding:0 30px 0 10px;font-weight:650}.project-picker .icon-button{flex:none}.project-name{align-items:center;gap:10px;max-width:440px;display:flex}.project-name>span{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:700}.project-name input{width:100%;min-width:0;color:var(--ink);font-family:var(--serif);background:0 0;border:0;border-bottom:1px solid #b8b7b2;padding:7px 3px 5px;font-size:19px}.save-state{min-width:116px;color:var(--muted);align-items:center;gap:7px;font-size:13px;display:flex}.save-state svg{width:16px;height:16px}.save-state.saved{color:var(--sage)}.save-state.failed{color:#ad2d27}.top-actions{align-items:center;gap:8px;display:flex}button,.upload-button{background:#fff;border:1px solid #c8c8c4;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:38px;padding:0 12px;font-size:13px;font-weight:600;display:inline-flex}button:hover,.upload-button:hover{background:#faf9f5;border-color:#838985}button svg,.upload-button svg{stroke-width:1.8px;width:17px;height:17px}button.primary{color:#fff;background:var(--accent-button);border-color:var(--accent-button);padding-inline:16px}button.primary:hover{background:var(--accent-button-hover);border-color:var(--accent-button-hover)}button.secondary{border-color:var(--ink)}.icon-button{width:38px;padding:0}.spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.editor-grid{grid-template-columns:268px minmax(420px,1fr) 288px;min-height:0;display:grid}.photo-library,.layout-panel{z-index:10;background:#fbfaf7;flex-direction:column;min-height:0;display:flex;position:relative;overflow:hidden}.photo-library{border-right:1px solid var(--line)}.layout-panel{border-left:1px solid var(--line)}.panel-heading{justify-content:space-between;align-items:center;padding:16px 16px 10px;display:flex}.panel-heading h2{font-family:var(--serif);margin:0;font-size:21px;line-height:1.1}.panel-heading p{max-width:34ch;color:var(--muted);margin:3px 0 0;font-size:11px;line-height:1.45}.mobile-close{display:none}.search{background:#fff;border:1px solid #c8c8c4;border-radius:8px;align-items:center;gap:7px;height:38px;margin:0 14px 9px;padding:0 10px;display:flex}.search svg{width:16px}.search input{background:0 0;border:0;width:100%;height:100%;font-size:13px}.segmented{grid-template-columns:repeat(3,1fr);gap:3px;padding:0 14px 12px;display:grid}.segmented button{background:0 0;border:0;min-height:30px;padding:0 5px;font-size:11px}.segmented button.active{background:var(--ink);color:#fff}.photo-scroll{flex:1;min-height:0;padding:0 14px 12px;overflow:auto}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(112px,1fr));align-content:start;gap:10px;display:grid}.photo-tile{aspect-ratio:1;background:#ddd;border:1px solid #0000;border-radius:6px;min-height:0;padding:0;display:block;position:relative;overflow:hidden}.photo-tile:hover,.photo-tile:focus-visible{transform:translateY(-1px);box-shadow:0 6px 16px #17253133}.photo-tile:hover{border-color:var(--accent)}.photo-tile img{object-fit:cover;width:100%;height:100%;display:block}.tile-name{color:#fff;text-align:left;text-overflow:ellipsis;white-space:nowrap;opacity:0;background:linear-gradient(#17253100,#172531c7);padding:12px 6px 4px;font-size:10px;line-height:1.2;transition:opacity .14s;position:absolute;inset:auto 0 0;overflow:hidden}.photo-tile:hover .tile-name,.photo-tile:focus-visible .tile-name{opacity:1}.used{background:var(--accent-button);color:#fff;border:2px solid #fff;border-radius:50%;place-items:center;width:20px;height:20px;display:grid;position:absolute;top:5px;right:5px}.used svg{width:12px}.empty-library{text-align:center;color:var(--muted);flex:1;place-content:center;display:grid;position:relative;overflow:hidden}.demo-contact-sheet{object-fit:cover;opacity:.22;filter:saturate(.35);width:100%;height:100%;position:absolute;inset:0}.empty-copy{z-index:1;background:#fffdf8e8;border:1px solid #d8d6d0e6;border-radius:12px;margin:18px;padding:24px 14px;position:relative}.empty-library svg{color:#5f6666;width:30px;height:30px;margin:0 auto 8px}.demo-label{color:var(--accent-dark);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px;font-size:9px;font-weight:700;display:block}.empty-library h3{color:var(--ink);font-family:var(--serif);margin:0 0 6px;font-size:18px}.empty-library p{margin:0;font-size:12px;line-height:1.5}.import-actions{grid-template-columns:1fr 1fr;gap:6px;padding:10px 14px 14px;display:grid}.upload-button{flex:none;min-width:0;margin:0;padding-inline:8px}.upload-button input{display:none}.upload-progress{border:1px solid var(--line);background:#fff;border-radius:8px;margin:-5px 14px 14px;padding:10px}.upload-progress>div{justify-content:space-between;gap:8px;font-size:10px;display:flex}.upload-progress strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.upload-progress span{color:var(--muted);white-space:nowrap}.upload-progress progress,.export-toast progress{width:100%;height:5px;accent-color:var(--accent)}.upload-progress.failed{color:#a42720;border-color:#e7a29d}.workspace{background:#efede8;grid-template-rows:52px minmax(0,1fr);min-width:0;min-height:0;display:grid;position:relative}.canvas-toolbar{border-bottom:1px solid var(--line);background:#f8f7f3;justify-content:center;align-items:center;gap:18px;display:flex}.canvas-toolbar>div{align-items:center;gap:4px;display:flex}.canvas-toolbar>div>span{text-align:center;font-variant-numeric:tabular-nums;min-width:46px;font-size:12px}.canvas-toolbar .icon-button{width:32px;min-height:32px}.toggle{background:0 0;border:0;min-height:32px}.toggle.active{color:#fff;background:var(--ink)}.canvas{place-items:center;min-height:0;padding:26px 34px;display:grid;overflow:auto}.page-stage{justify-content:center;align-items:center;gap:2px;min-width:340px;max-width:920px;display:flex}.book-page{background:var(--paper);flex:1 1 0;width:100%;min-width:0;animation:.32s cubic-bezier(.2,.9,.2,1) settle;position:relative;overflow:hidden;box-shadow:0 14px 34px #22252626,0 2px 6px #2225261f}@keyframes settle{0%{transform:translateY(-5px);box-shadow:0 24px 48px #2225262e}}.spread .book-page:first-child{transform-origin:100%}.spread .book-page:last-child{transform-origin:0}.bleed-guide,.safe-guide{z-index:3;pointer-events:none;position:absolute}.bleed-guide{border:1px dashed #e653459e;inset:2.2%}.safe-guide{border:1px dashed #56646f61;inset:5%}.photo-frame,.text-frame{background:#f2f0ea;position:absolute;overflow:hidden}.photo-frame{cursor:grab}.photo-frame:active{cursor:grabbing}.photo-frame.selected{z-index:4;outline:3px solid var(--accent);outline-offset:1px}.photo-frame img{-webkit-user-select:none;user-select:none;transform-origin:50%;width:100%;height:100%;transition:filter .12s;display:block}.photo-frame .demo-frame-image{object-fit:cover;opacity:.42;filter:saturate(.55);position:absolute;inset:0}.photo-frame .empty-frame{z-index:1;background:#fffdf861;position:relative}.photo-frame.selected img{filter:saturate(1.04)}.empty-frame{color:#4f5658;text-align:center;text-wrap:balance;border:1px dashed #8e938f;place-content:center;justify-items:center;gap:8px;width:100%;height:100%;padding:6px;font-size:11px;line-height:1.35;display:grid}.empty-frame svg{width:28px;height:28px}.resolution-warning{color:#6b4e00;background:#fff5d6;border-radius:3px;max-width:calc(100% - 10px);padding:4px 6px;font-size:10px;font-weight:700;line-height:1.25;position:absolute;bottom:5px;right:5px}.text-frame{flex-direction:column;justify-content:center;padding:clamp(10px,3vw,32px);display:flex}.text-frame h2{letter-spacing:-.02em;margin:0 0 .5em;line-height:1.05}.text-frame p{white-space:pre-wrap;margin:0;font-size:13px;line-height:1.55}.text-page .text-frame h2{font-size:clamp(24px,4vw,46px)!important}.text-page .text-frame p{max-width:58ch;font-size:clamp(13px,1.5vw,18px)}.crop-toolbar{z-index:12;background:var(--ink);color:#fff;border-radius:10px;align-items:center;gap:3px;padding:5px;display:flex;position:absolute;bottom:18px;left:50%;transform:translate(-50%);box-shadow:0 10px 24px #17253147}.crop-toolbar button{color:#fff;background:0 0;border:0;min-height:32px;padding-inline:8px}.crop-toolbar button:hover{background:#ffffff1f}.crop-toolbar input{width:80px;accent-color:var(--accent)}.crop-toolbar .danger{color:#ff9b91}.layout-filters{padding:0 14px 10px}.layout-filters select,.page-settings select,.text-controls select,.text-controls input,.text-controls textarea{width:100%;color:var(--ink);background:#fff;border:1px solid #c8c8c4;border-radius:7px;padding:8px 10px}.layout-scroll{flex:auto;min-height:150px;padding:0 14px 16px;overflow:auto}.layout-grid{grid-template-columns:1fr 1fr;align-content:start;gap:10px;display:grid}.layout-grid>button{text-align:center;background:0 0;border-color:#0000;grid-template-columns:minmax(0,1fr);place-content:start stretch;gap:4px;min-height:0;padding:7px 5px;font-size:11px;font-weight:600;line-height:1.25;display:grid}.layout-grid>button small{color:var(--muted);font-size:10px;font-weight:500}.layout-grid>button:hover{background:#f1efea}.layout-grid>button.selected{border-color:var(--accent);color:var(--accent-dark);background:#fff}.layout-grid>button.selected small{color:var(--accent-dark)}.layout-mini{aspect-ratio:1.42;background:var(--paper);border:1px solid #b8b7b2;width:100%;display:block;position:relative;overflow:hidden}.layout-grid .layout-mini{width:auto;height:72px;margin:0 auto 1px;box-shadow:0 1px 3px #17253124}.layout-mini i,.layout-mini img{display:block;position:absolute}.layout-mini i{background:#c0c3c2;box-shadow:inset 0 0 0 1px #ffffffd9}.layout-mini img{object-fit:cover}.layout-mini i.text{box-shadow:none;opacity:.8;background:repeating-linear-gradient(#0000 0 1.5px,#8d949a 1.5px 2.5px,#0000 2.5px 5px)}.page-settings,.text-controls{border-top:1px solid var(--line);background:#f8f7f3;flex:none;max-height:40%;padding:14px;overflow:auto}.page-settings h3,.text-controls h3{font-family:var(--serif);margin:0 0 13px;font-size:17px}.page-settings label{grid-template-columns:1fr auto;align-items:center;gap:5px;margin-bottom:11px;font-size:11px;display:grid}.page-settings label input[type=range]{height:26px;accent-color:var(--accent);grid-column:1/-1}.page-settings label select{grid-column:1/-1}.setting-hint{color:var(--muted);margin:-6px 0 12px;font-size:11px;line-height:1.45}.print-note{color:var(--muted);font-size:11px}.notice{color:#5a4213;text-align:center;background:#fdf3e3;border-top:1px solid #e6d5b4;margin:0;padding:9px 18px;font-size:12px}.delete-project{color:#a52e27;background:0 0;border-color:#dfaaa5;width:100%;margin-top:10px}.text-controls>label,.text-controls .control-row label{gap:5px;margin-bottom:10px;font-size:11px;display:grid}.text-controls textarea{resize:vertical;min-height:82px}.control-row{grid-template-columns:1fr 1fr;gap:8px;display:grid}.control-row input[type=color]{height:37px;padding:3px}.page-strip{border-top:1px solid var(--line);z-index:15;background:#fbfaf7;align-items:center;gap:12px;padding:14px 18px;display:flex}.page-list{flex:1;align-items:center;gap:12px;min-width:0;height:100%;padding:3px;display:flex;overflow-x:auto}.page-list>button{background:0 0;border-color:#0000;flex-direction:column;flex:0 0 118px;gap:3px;height:102px;padding:7px}.page-list>button.active{border-color:var(--accent);background:#fff;box-shadow:0 5px 14px #1725311a}.page-list .layout-mini{width:96px}.page-list>button>span:last-child{font-size:10px}.page-actions{flex:none;grid-template-columns:1fr 1fr;gap:6px;display:grid}.page-actions button{min-height:32px;font-size:11px}.danger{color:#b8322b}.mobile-switcher{display:none}.preview-overlay{z-index:100;color:#fff;background:#151f27;grid-template-rows:64px 1fr;display:grid;position:fixed;inset:0;overflow:hidden}.preview-overlay header{border-bottom:1px solid #ffffff24;justify-content:space-between;align-items:center;padding:0 22px;display:flex}.preview-overlay header>div{align-items:baseline;gap:13px;display:flex}.preview-overlay header span{color:#aeb8bf;font-size:12px}.preview-overlay header strong{font-family:var(--serif);font-size:21px}.preview-overlay header button{color:#fff;background:0 0;border-color:#ffffff73}.preview-overlay header button:hover{background:#ffffff1f;border-color:#ffffffb3}.preview-pages{grid-template-columns:repeat(2,minmax(360px,720px));place-content:start center;gap:50px 6px;min-height:0;padding:42px;display:grid;overflow:auto}.preview-page-wrap{color:#bac2c8;justify-items:center;gap:10px;font-size:11px;display:grid}.preview-page-wrap .book-page{width:100%}.export-toast{z-index:150;background:var(--ink);color:#fff;border-radius:12px;align-items:center;gap:12px;width:320px;min-height:72px;padding:14px;display:flex;position:fixed;top:76px;right:18px;box-shadow:0 14px 34px #17253147}.export-toast>div{flex:1;gap:5px;min-width:0;display:grid}.export-toast span{color:#cdd5da;font-size:11px;line-height:1.4}.export-toast a{color:#ffb2aa;text-underline-offset:3px;font-size:12px}.export-toast button{color:#fff;background:0 0;border:0;min-height:32px}.loading-screen{height:100%;color:var(--muted);background:#f6f2ea;place-content:center;justify-items:center;gap:12px;display:grid}.loading-screen svg{width:28px}.login-screen{overscroll-behavior:contain;background:var(--paper);grid-template-columns:minmax(400px,44%) 1fr;height:100dvh;display:grid;overflow-y:auto}.login-sheet{flex-direction:column;justify-content:center;padding:clamp(36px,6vw,104px);display:flex;position:relative}.login-brand{font:650 27px/1 var(--serif);align-items:center;gap:10px;display:flex;position:absolute;top:28px;left:clamp(36px,6vw,104px)}.login-brand svg{flex:none;width:25px}.login-copy h1{font:650 clamp(38px, 4.1vw, 66px)/1 var(--serif);letter-spacing:-.032em;text-wrap:balance;margin:0 0 18px}.login-copy p{max-width:46ch;color:var(--muted);margin:0 0 34px;font-size:15px;line-height:1.6}.login-sheet form{gap:16px;max-width:420px;display:grid}.login-sheet form label{gap:7px;font-size:12px;font-weight:700;display:grid}.login-sheet form input{background:#fff;border:1px solid #aaa9a4;border-radius:8px;height:48px;padding:0 12px;font-size:16px;font-weight:500}.login-sheet form button{height:48px;margin-top:4px;font-size:15px}.login-error{color:#a52e27;margin:-5px 0 0;font-size:12px}.login-footnote{color:#6a706e;max-width:50ch;margin:24px 0 0;font-size:11px;line-height:1.5}.login-art{background:var(--ink);position:relative;overflow:hidden}.login-art>img{object-fit:cover;opacity:.9;width:100%;height:100%}.login-art:after{content:"";border:1px dashed #ffffff9e;position:absolute;inset:4%}.login-art>div{z-index:2;color:#fff;background:#172531eb;gap:3px;padding:16px 18px;display:grid;position:absolute;bottom:7%;left:6%;right:6%}.login-art strong{font-family:var(--serif);font-size:20px}.login-art span{color:#d6dddf;font-size:12px}.overview-shell,.album-shell{background:var(--canvas);min-height:100dvh;overflow:auto}.overview-header{border-bottom:1px solid var(--line);background:#fbfaf7;justify-content:space-between;align-items:center;height:64px;padding:0 24px;display:flex}.overview-main,.album-main{width:min(1120px,100% - 40px);margin:0 auto;padding:54px 0 80px}.overview-intro{justify-content:space-between;align-items:end;gap:28px;margin-bottom:48px;display:flex}.overview-intro h1,.album-toolbar h1{font-family:var(--serif);letter-spacing:-.035em;margin:0;font-size:clamp(36px,5vw,64px);font-weight:600}.overview-intro p,.album-toolbar p{color:var(--muted);margin:8px 0 0}.overview-intro>div:last-child,.album-toolbar>div:last-child{gap:9px;display:flex}.overview-section+.overview-section{margin-top:52px}.section-title{border-bottom:1px solid var(--ink);align-items:center;gap:10px;padding-bottom:10px;display:flex}.section-title h2{font-family:var(--serif);margin:0;font-size:25px;font-weight:600}.section-title span{color:#fff;background:var(--ink);text-align:center;border-radius:99px;min-width:25px;padding:2px 7px;font-size:11px}.section-intro{max-width:78ch;color:var(--muted);margin:12px 0 4px;font-size:13px;line-height:1.55}.section-intro strong{color:var(--ink);font-weight:650}.overview-list{display:grid}.overview-row{border-bottom:1px solid var(--line);grid-template-columns:126px minmax(0,1fr) auto;align-items:center;gap:20px;min-height:126px;padding:17px 0;display:grid}.album-preview{padding:0}.overview-preview{background:#e7e3da;border-color:#b8b7b2;border-radius:4px;width:126px;height:104px;padding:7px;overflow:hidden}.overview-preview .layout-mini{width:auto;max-width:100%;height:90px;margin:auto}.album-preview{grid-template-columns:repeat(2,1fr);gap:2px;display:grid}.album-preview img{object-fit:cover;width:100%;height:100%;min-height:0}.album-preview>svg{width:28px;height:28px;color:var(--muted);grid-column:1/-1;margin:auto}.overview-details{min-width:0}.overview-details input{width:min(100%,520px);color:var(--ink);font-family:var(--serif);background:0 0;border:0;border-bottom:1px solid #0000;padding:2px 0 5px;font-size:21px;font-weight:650}.overview-details input:hover,.overview-details input:focus{border-bottom-color:#aaa9a4}.overview-details p{color:var(--ink);margin:7px 0 4px;font-size:12px}.overview-details span{color:var(--muted);font-size:11px}.overview-actions{align-items:center;gap:7px;display:flex}.overview-actions .danger{color:#a52e27}.overview-empty{border-bottom:1px solid var(--line);text-align:center;justify-items:center;padding:44px 20px;display:grid}.overview-empty>svg{width:32px;height:32px;color:var(--muted)}.overview-empty h3{font-family:var(--serif);margin:13px 0 4px;font-size:21px}.overview-empty p{color:var(--muted);margin:0 0 17px}.album-title-input{width:min(520px,60vw);min-height:34px;color:var(--ink);font-family:var(--serif);text-align:center;background:0 0;border:0;border-bottom:1px solid #aaa9a4;padding:4px 6px;font-size:20px}.album-main{padding-top:40px}.album-toolbar{border-bottom:1px solid var(--ink);justify-content:space-between;align-items:end;gap:28px;padding-bottom:22px;display:flex}.album-toolbar h1{font-size:clamp(32px,4vw,52px)}.album-toolbar .import-actions{border:0;padding:0}.album-upload{border:1px solid var(--line);background:#fbfaf7;grid-template-columns:1fr auto;gap:7px 16px;margin-top:18px;padding:12px 14px;display:grid}.album-upload progress{width:100%;accent-color:var(--accent);grid-column:1/-1}.album-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px 12px;padding-top:28px;display:grid}.album-grid figure{min-width:0;margin:0}.album-grid img{aspect-ratio:1;object-fit:cover;background:#e3e0d8;width:100%;display:block}.album-grid figcaption{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin-top:6px;font-size:11px;overflow:hidden}.album-empty{margin-top:26px}@media (width<=1100px){.app-shell{grid-template-rows:60px 46px minmax(0,1fr) 126px}.topbar{grid-template-columns:auto minmax(0,190px) minmax(0,1fr) auto auto;gap:9px;padding-inline:14px}.project-name>span{display:none}.save-state{min-width:auto}.save-state svg,.top-actions .icon-button{display:none}.top-actions .logout-button{display:inline-flex}.top-actions .secondary{padding-inline:9px}.mobile-switcher{border-bottom:1px solid var(--line);background:#fbfaf7;grid-row:2;justify-content:center;gap:7px;padding:5px;display:flex}.mobile-switcher button{min-height:36px}.mobile-switcher button.active{color:#fff;background:var(--ink);border-color:var(--ink)}.editor-grid{grid-row:3;grid-template-columns:minmax(0,1fr);position:relative}.photo-library,.layout-panel{z-index:40;width:min(340px,90vw);transition:transform .24s cubic-bezier(.2,.9,.2,1);position:absolute;inset:0 auto 0 0;transform:translate(-105%);box-shadow:10px 0 30px #1725312e}.layout-panel{inset:0 0 0 auto;transform:translate(105%)}.photo-library.mobile-open,.layout-panel.mobile-open{transform:translate(0)}.mobile-close{display:inline-flex}.page-strip{grid-row:4;padding:10px}.page-actions button:nth-child(n+3){display:none}.login-screen{grid-template-columns:minmax(360px,46%) 1fr}.login-sheet{padding:clamp(32px,5.2vw,60px)}.login-brand{left:clamp(32px,5.2vw,60px)}.login-copy h1{font-size:clamp(34px,4.6vw,46px)}}@media (width<=680px){body{overflow:hidden}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}.layout-grid{gap:8px}.app-shell{grid-template-rows:56px 44px minmax(0,1fr) 104px}.topbar{grid-template-columns:auto minmax(0,1fr) auto;gap:7px}.brand span,.project-name,.save-state,.top-actions .secondary .label,.top-actions .primary .label{display:none}.top-actions .secondary,.top-actions .primary{width:40px;padding:0}.project-picker .icon-button,.canvas-toolbar .toggle .label{display:none}.brand{font-size:0}.project-picker>svg{display:none}.project-name input{font-size:17px}.canvas-toolbar{justify-content:space-between;padding-inline:8px}.canvas{padding:15px}.page-stage{min-width:270px;width:100%!important}.spread .page-stage .book-page:first-child{display:none}.crop-toolbar{max-width:calc(100% - 16px);bottom:8px;overflow-x:auto}.crop-toolbar input{width:55px}.page-list>button{flex-basis:92px;height:80px}.page-list .layout-mini{width:72px}.page-actions{grid-template-columns:1fr}.page-actions button .label{display:none}.page-actions button{width:38px;padding:0}.preview-pages{grid-template-columns:1fr;padding:24px 14px}.export-toast{width:calc(100% - 24px);top:66px;right:12px}.login-screen{grid-template-columns:1fr}.login-art{display:none}.login-sheet{padding:72px 22px 30px}.login-brand{top:22px;left:22px}.login-copy h1{font-size:clamp(30px,8.6vw,40px)}.login-copy p{margin-bottom:26px;font-size:14px}.login-footnote{margin-top:20px}.overview-header{height:56px;padding-inline:14px}.overview-main,.album-main{width:min(100% - 28px,1120px);padding:30px 0 54px}.overview-intro,.album-toolbar{flex-direction:column;align-items:stretch;margin-bottom:30px}.overview-intro>div:last-child,.album-toolbar>div:last-child{grid-template-columns:1fr 1fr;display:grid}.overview-row{grid-template-columns:84px minmax(0,1fr);gap:13px;min-height:108px}.overview-preview{width:84px;height:78px;padding:5px}.overview-preview .layout-mini{width:auto;max-width:100%;height:66px}.overview-actions{grid-column:1/-1;justify-content:flex-end}.overview-actions>button:first-child{margin-right:auto}.album-title-input{width:min(220px,62vw);font-size:17px}.album-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}}@media (height<=620px){.login-screen{grid-template-columns:1fr}.login-art{display:none}.login-sheet{justify-content:flex-start;padding:20px 22px 26px}.login-brand{margin-bottom:14px;font-size:22px;position:static}.login-brand svg{width:21px}.login-copy h1{margin-bottom:10px;font-size:clamp(26px,4.4vw,34px)}.login-copy p{margin-bottom:20px;font-size:14px}.login-copy h1 br{display:none}.login-sheet form{gap:12px}.login-footnote{margin-top:16px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}