.collage-page{margin:0;background:#17181c;color:#f5f5f8;font:14px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:dark}.collage-page *{box-sizing:border-box}.collage-page [hidden]{display:none!important}.collage-page .cg-main{max-width:1800px;margin:auto;padding:28px 30px 44px}.cg-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:24px}.cg-heading h1{font-size:clamp(27px,2.3vw,37px);letter-spacing:-1px;line-height:1.2;margin:5px 0 8px}.cg-heading p{color:#bbbcc7;margin:0}.cg-heading .cg-kicker{color:#b5a0d9;letter-spacing:1.7px;font-size:10px;font-weight:800}.cg-local{font-size:11px;color:#c5e5d5;border:1px solid #465b50;background:#24332a;padding:8px 12px;border-radius:20px;white-space:nowrap}.cg-workspace{display:grid;grid-template-columns:310px minmax(0,1fr);gap:22px;align-items:start}.cg-controls{min-width:0;padding:18px;background:#24252b;border:1px solid #3c3d47;border-radius:16px}.collage-page button,.collage-page input,.collage-page select{font:inherit}.collage-page button{min-height:42px;border:1px solid #50515e;background:#34353f;color:#f6f5fc;border-radius:9px;padding:10px 12px;font-size:12px;font-weight:700;cursor:pointer}.collage-page button:hover:not(:disabled){background:#444550;border-color:#85818f}.collage-page button:disabled{opacity:.42;cursor:not-allowed}.collage-page :is(button,input,select,summary,a):focus-visible{outline:3px solid #c6b0f5;outline-offset:3px}.collage-page .cg-add{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:7px;width:100%;padding:16px 8px;background:#2e2b37;border:1px dashed #9681ae}.cg-add>span{font-size:24px;line-height:1}.cg-add small{display:block;flex-basis:100%;color:#beb2cc;font-size:10px;font-weight:400;line-height:1.65}.cg-controls h2{font-size:12px;margin:0;font-weight:750}.cg-photo-heading{display:flex;align-items:center;justify-content:space-between;margin:18px 0 10px;gap:10px}.cg-photo-heading h2 span{font-size:10px;color:#a8a5b4;font-weight:400;margin-left:6px}.cg-photo-heading button{min-height:32px;padding:5px 10px;font-size:10px;background:transparent}.cg-photos{display:grid;gap:7px;list-style:none;padding:0;margin:0}.cg-photo{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:8px;align-items:center;background:#1e1f25;border:1px solid #3b3b47;border-radius:8px;padding:6px}.cg-photo img{height:38px;width:38px;object-fit:cover;border-radius:5px}.cg-photo-name{min-width:0;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#cfccd8}.cg-photo-actions{display:flex;gap:3px}.cg-photo-actions button{min-height:32px;width:29px;font-size:12px;padding:3px;background:#30313a}.cg-help{font-size:10px;line-height:1.65;color:#b5b0c0;margin:10px 0 15px}.cg-controls fieldset{padding:17px 0 0;border:0;border-top:1px solid #41414b;margin:0;min-width:0}.cg-layouts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:10px 0 18px}.cg-layouts button{font-size:9px;padding:8px 3px;background:#2d2e36}.cg-layouts button[aria-pressed="true"]{background:#463857;border-color:#b59acc;color:#f6eaff}.cg-grid-icon{display:grid;gap:3px;height:28px;width:34px;margin:0 auto 7px}.cg-grid-icon i{background:currentColor;opacity:.65;border-radius:2px}.cg-grid-2{grid-template-columns:repeat(2,1fr)}.cg-grid-3{grid-template-columns:repeat(3,1fr)}.cg-grid-4{grid-template:repeat(2,1fr)/repeat(2,1fr)}.cg-grid-6{grid-template:repeat(2,1fr)/repeat(3,1fr)}.cg-controls label{display:block;color:#cac5d2;font-size:11px;font-weight:650;margin:14px 0 7px}.cg-controls select{width:100%;min-height:43px;border:1px solid #52515e;border-radius:8px;background:#1c1d23;color:#f5f2fa;font-size:12px;padding:9px 10px}.cg-controls input[type="range"]{width:100%;accent-color:#b79adc;min-height:28px;margin:0}.cg-controls output{float:right;font-size:10px;color:#ada4bc;font-weight:400}.cg-colour-row{display:flex;align-items:center;justify-content:space-between;margin:13px 0 20px;gap:15px}.cg-colour-row label{margin:0}.cg-controls input[type="color"]{width:60px;height:37px;padding:3px;border:1px solid #57515f;border-radius:7px;background:#1c1d23}.cg-controls .cg-export-heading{border-top:1px solid #41414b;padding-top:17px;margin-bottom:11px}.collage-page .cg-download{width:100%;background:linear-gradient(120deg,#ff4260,#ed2856);border-color:#ff6680;min-height:48px;margin-top:11px;font-size:12px}.collage-page .cg-download:hover:not(:disabled){background:#f94269}.cg-stage{min-width:0;background:#202127;border:1px solid #3c3d47;border-radius:16px;overflow:hidden;position:sticky;top:18px}.cg-stage-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #3c3d47;padding:14px 18px}.cg-stage-heading h2{font-size:12px;margin:0}.cg-stage-heading span{font-size:11px;color:#b7b2c2}.cg-drop{height:clamp(400px,66vh,800px);padding:24px;display:flex;align-items:center;justify-content:center;background:#15161b;background-image:radial-gradient(#ffffff10 1px,transparent 1px);background-size:18px 18px;overflow:hidden}.cg-drop.is-dragging{outline:3px dashed #c9adef;outline-offset:-7px;background-color:#30263b}.cg-drop canvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;box-shadow:0 10px 40px #0006}.cg-empty{text-align:center;max-width:360px;padding:25px 12px}.cg-empty-art{display:grid;place-items:center;font-size:45px;width:83px;height:83px;border:1px solid #655473;border-radius:22px;color:#d8bdec;background:#342a3e;margin:0 auto 24px;transform:rotate(-5deg)}.cg-empty h2{font-size:30px;letter-spacing:-.8px;line-height:1.2;margin:0 0 14px}.cg-empty p{font-size:12px;color:#b3aabd;line-height:1.75;margin:0 0 24px}.cg-empty button{background:#654c7d;border-color:#9b7caf;padding:11px 23px}.cg-status{font-size:11px;line-height:1.65;color:#c4bdcf;padding:14px 18px;margin:0;border-top:1px solid #3c3d47;overflow-wrap:anywhere}.cg-status[data-error="true"]{color:#ffc0cd;background:#35202a}.cg-footnote{font-size:10px;color:#a29aae;padding:0 18px 14px;margin:0}.cg-about{max-width:930px;margin:35px 0 0;color:#b7b2c1;font-size:12px;line-height:1.8}.cg-about h2{font-size:18px;color:#e5deec;margin:0 0 8px}.cg-about p{margin:8px 0 15px}.cg-about details{border-top:1px solid #34323d;padding:12px 0}.cg-about summary{color:#d4cdda;cursor:pointer;font-weight:600}.cg-about details p{margin-bottom:0}.cg-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:1100px){.collage-page .cg-main{padding:22px 18px}.cg-heading{align-items:flex-start;flex-direction:column;gap:12px}.cg-workspace{grid-template-columns:280px minmax(0,1fr);gap:16px}.cg-drop{padding:15px}}@media(max-width:760px){.collage-page .cg-main{padding:20px 12px 32px}.cg-heading{margin-bottom:18px}.cg-heading h1{font-size:27px}.cg-heading p{font-size:12px}.cg-local{font-size:10px}.cg-workspace{display:flex;flex-direction:column;gap:15px}.cg-stage{position:static;order:0;width:100%}.cg-controls{order:1;width:100%;padding:18px}.cg-drop{height:400px;max-height:60vh;padding:15px}.cg-empty h2{font-size:26px}.cg-empty-art{width:62px;height:62px;font-size:36px;margin-bottom:18px}.cg-empty p{font-size:12px}.cg-controls :is(select,input){font-size:16px}.cg-controls button{min-height:44px}.cg-photo-actions button{width:36px}.cg-photo-name{font-size:11px}.cg-layouts button{font-size:11px}.cg-layouts{gap:10px}.cg-controls h2{font-size:13px}.cg-help{font-size:11px}.cg-about{font-size:12px;margin-top:25px}}@media(prefers-reduced-motion:reduce){.collage-page *{scroll-behavior:auto!important}}