*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0;background:#faf9f6;color:#111;font:15px/1.45 Arial,sans-serif}a{color:inherit;text-decoration:none}header,main,footer{max-width:1440px;margin:auto;padding:0 48px}header{height:94px;display:flex;align-items:center;gap:36px;border-bottom:1px solid #d9d9d3}header .brand{font-size:30px;font-weight:900;letter-spacing:-1.5px;margin-right:auto}.hero{padding:66px 0 55px}.hero>span,.tag{font-size:11px;letter-spacing:.15em;font-weight:700}h1{font-size:clamp(46px,6.7vw,92px);line-height:.98;letter-spacing:-5px;margin:22px 0 25px}.hero p{font-size:19px;color:#6d6d66}.sectionhead{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:15px 0 22px}.sectionhead h2{font-size:30px;letter-spacing:-1px}.sectionhead span,.sectionhead a{font-size:13px;color:#6a6a62}.sectionhead a{border-bottom:1px solid #888;padding-bottom:4px}.cardboard{width:100%;max-height:600px;object-fit:contain;background:#fff;border-radius:12px}#collection{margin-top:60px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.tile{background:#fff;text-align:left;border:1px solid #e2e0d9;border-radius:12px;padding:0;cursor:pointer;overflow:hidden}.tile.selected{outline:3px solid #bbdf53;outline-offset:3px}.tile img{width:100%;aspect-ratio:2/3;object-fit:cover;display:block}.tile .label{display:flex;justify-content:space-between;padding:15px;font-size:13px;font-weight:700}.tile .label span{color:#8d8c83;font-weight:400}.editor{margin:85px 0;display:grid;grid-template-columns:330px 1fr;gap:50px;align-items:start;background:#eeeee7;border-radius:20px;padding:35px}.tools{position:sticky;top:25px}.tools h2{font-size:32px;margin:13px 0 30px;letter-spacing:-1.5px}label{display:block;font-size:12px;font-weight:bold;margin:20px 0 12px}input,select{display:block;margin-top:8px;width:100%;padding:15px;border:1px solid #d6d6cb;border-radius:8px;background:white;font:15px Arial}button{font:inherit}.tools>button{width:100%;border:0;background:#171b12;color:white;padding:16px;border-radius:9px;cursor:pointer;font-weight:bold}.tools .download{margin-top:18px;background:#c9ec75;color:#1b2111}.tools p{font-size:12px;color:#77786d}.textlink{display:block;font-size:12px;margin:18px 0}.hint{line-height:1.6}canvas{display:block;width:100%;max-width:700px;background:white;box-shadow:0 12px 32px #0002;border-radius:4px}footer{display:flex;justify-content:space-between;padding-top:30px;padding-bottom:35px;border-top:1px solid #d7d7cc;font-size:13px}footer b{font-size:22px;letter-spacing:-1px}@media(max-width:1000px){.grid{grid-template-columns:repeat(3,1fr)}.editor{grid-template-columns:260px 1fr;gap:25px;padding:25px}}@media(max-width:700px){header,main,footer{padding-left:18px;padding-right:18px}header{height:75px;gap:18px}header a:not(.brand){font-size:11px}header .brand{font-size:24px}.hero{padding-top:45px}h1{letter-spacing:-2.5px}.grid{grid-template-columns:repeat(2,1fr);gap:12px}.tile .label{padding:10px;font-size:11px}.sectionhead{align-items:start;flex-direction:column;gap:0}.sectionhead h2{font-size:26px}.editor{display:flex;flex-direction:column;padding:18px;margin:45px 0;gap:25px}.tools{position:static;width:100%}footer{flex-wrap:wrap;gap:18px}}
#poster{height:auto;image-rendering:auto;aspect-ratio:auto}
/* Fit any aspect ratio to the available editor viewport; output resolution stays independent. */
#poster{width:min(100%,calc(min(78dvh,820px)*var(--poster-ratio,.666667)));max-width:700px;max-height:min(78dvh,820px);height:auto;justify-self:center;object-fit:contain}
@media(min-width:701px){.editor{padding:24px;gap:32px}.tools{top:24px;max-height:calc(100dvh - 96px);overflow-y:auto;scrollbar-width:thin}.tools h2{margin:10px 0 18px}.tools label{margin:14px 0 10px}.tools input,.tools select{padding:12px}.tools>button{padding:13px}.tools .download{margin-top:12px}.tools .textlink{margin:14px 0}}
@media(max-width:700px){#poster{align-self:center;width:min(100%,calc((100dvh - 72px)*var(--poster-ratio,.666667)));max-height:calc(100dvh - 72px)}}
/* bureau.cards public-site shell. Creative canvas rendering is intentionally unchanged. */
body{background:#eff8fd;color:#151c29;font-family:Manrope,Arial,sans-serif}main{max-width:1336px}.hero>span,.tag{color:#3276e8}.hero p{color:#6b7a90}.sectionhead span,.sectionhead a{color:#6b7a90}.tile{border-color:#dfebf6;border-radius:20px;box-shadow:0 8px 30px #28547f05}.tile.selected{outline-color:#3276e8}.tile .label{font-family:Manrope,Arial,sans-serif}.editor{background:#e1efff;border-radius:30px}.tools input,.tools select{font-family:Manrope,Arial,sans-serif;border-color:#c7daef;border-radius:13px}.tools>button{background:#3276e8;border-radius:28px}.tools>button:hover{background:#225fcb}.tools .download{background:#3276e8;color:white}.tools p{color:#6b7a90}.tools h2{letter-spacing:-1.5px}canvas{box-shadow:0 16px 40px #24466b20}.textlink{color:#3276e8}.site-header{height:auto;min-height:72px;max-width:1380px}.site-header .brand{font-size:25px;letter-spacing:-1.5px;margin-right:0}.site-header nav{display:flex}.site-footer{display:block;max-width:none;margin-top:70px;font-size:14px}.site-footer .brand{font-size:25px}.site-footer b{letter-spacing:0;font-size:14px}.site-footer .brand{letter-spacing:-1.5px}h1{font-weight:700}#collection{margin-top:40px}
@media(max-width:800px){.site-header nav{display:none}.site-header.menu-open nav{display:flex}.site-header .brand{font-size:21px}.site-header a:not(.brand){font-size:13px}.site-header .brand-mark{display:grid}}
@media(max-width:540px){.site-header .brand{font-size:23px}.site-footer .footer-top{display:grid}.site-header .button{display:none}}