/* Skyline HQ Step 33 — Premium Poster Studio. Isolated to the studio route. */
#skylinePosterStudio{--ps-blue:#5ac5ff;color:#eaf5ff}
#skylinePosterStudio *{box-sizing:border-box}
#skylinePosterStudio .ps-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:5px 0 18px}
#skylinePosterStudio .ps-hero h2{margin:0;font-size:clamp(21px,3vw,29px);line-height:1.14;color:#f5fbff}
#skylinePosterStudio .ps-hero p{margin:7px 0 0;color:#b7d6ef;font-size:13px}
#skylinePosterStudio .ps-counter{border:1px solid #397ba7;color:#bfeaff;background:#123453;padding:9px 13px;border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap}
#skylinePosterStudio .ps-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,1fr);gap:16px;align-items:start}
#skylinePosterStudio .ps-panel{background:linear-gradient(145deg,#0d2c4c,#081f3a);border:1px solid #305e85;border-radius:17px;padding:18px;min-width:0;box-shadow:0 12px 26px #0002}
#skylinePosterStudio .ps-panel h3{margin:0 0 12px;font-size:17px;color:#f1f9ff}
#skylinePosterStudio label{display:grid;gap:6px;font-size:12px;font-weight:750;color:#c5e1f5}
#skylinePosterStudio input,#skylinePosterStudio select{width:100%;min-width:0;background:#071a32;color:#f6faff;border:1px solid #37638d;border-radius:10px;padding:11px 10px;font:inherit;font-size:14px}
#skylinePosterStudio input[type=file]{padding:8px 6px;font-size:12px;max-width:100%}
#skylinePosterStudio input[type=range]{padding:0;accent-color:#29bfff;min-height:24px}
#skylinePosterStudio input:focus,#skylinePosterStudio select:focus,#skylinePosterStudio button:focus-visible{outline:2px solid #67caff;outline-offset:2px}
#skylinePosterStudio .ps-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
#skylinePosterStudio .ps-form{display:grid;gap:14px}
#skylinePosterStudio .ps-form .ps-caption{font-size:11px;line-height:1.5;color:#aacce6;margin:0}
#skylinePosterStudio .ps-divider{height:1px;background:#28547a;margin:2px 0}
#skylinePosterStudio .ps-category-list{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}
#skylinePosterStudio .ps-filter{border:1px solid #33648d;border-radius:99px;background:#123a5d;color:#d1e8ff;padding:8px 11px;font-size:12px;font-weight:750;cursor:pointer}
#skylinePosterStudio .ps-filter[aria-pressed=true]{color:#fff;background:linear-gradient(95deg,#006eae,#168eeb);border-color:#65d5ff}
#skylinePosterStudio .ps-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:355px;overflow:auto;padding:2px 5px 2px 0;scrollbar-color:#326990 transparent}
#skylinePosterStudio .ps-template{position:relative;overflow:hidden;border:2px solid #315d83;border-radius:11px;background:#0a2343;color:#f5faff;min-height:120px;cursor:pointer;padding:0;text-align:left}
#skylinePosterStudio .ps-template.selected{border-color:#73daff;box-shadow:0 0 0 2px #21b7fb70}
#skylinePosterStudio .ps-template:before{content:'';position:absolute;inset:0;background:linear-gradient(145deg,var(--t1),var(--t2),var(--t3));opacity:.92}
#skylinePosterStudio .ps-template[data-picture]:before{background:linear-gradient(180deg,transparent,#0009),var(--thumb) center/cover no-repeat}
#skylinePosterStudio .ps-template:after{content:'✦';position:absolute;top:5px;right:10px;color:#fff9;font-size:23px;filter:drop-shadow(0 0 5px #fff)}
#skylinePosterStudio .ps-template strong{position:absolute;bottom:0;left:0;right:0;padding:24px 7px 9px;font-size:11px;line-height:1.16;background:linear-gradient(transparent,#071425db);overflow-wrap:break-word}
#skylinePosterStudio .ps-template small{position:absolute;left:7px;top:8px;font-size:9px;text-shadow:0 1px 3px #000d;opacity:.94}
#skylinePosterStudio .ps-visuals{display:grid;gap:11px}
#skylinePosterStudio .ps-canvas-shell{background:#06152c;border-radius:17px;border:1px solid #3a6c93;padding:10px;position:sticky;top:70px}
#skylinePosterStudio canvas{display:block;width:100%;height:auto;aspect-ratio:1/1;border-radius:10px;background:#07192c;box-shadow:0 12px 36px #0006}
#skylinePosterStudio .ps-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:11px 0 0}
#skylinePosterStudio .ps-btn{border-radius:10px;padding:12px 16px;background:#163e61;color:#f1fbff;border:1px solid #4484af;font-size:13px;font-weight:800;cursor:pointer}
#skylinePosterStudio .ps-btn.primary{border-color:#51c9ff;background:linear-gradient(115deg,#087bbd,#148ff0);flex:1 1 185px}
#skylinePosterStudio .ps-status{font-size:12px;color:#b4d9ef;margin:6px 0 0;line-height:1.5}
#skylinePosterStudio .ps-badge-line{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:4px}
#skylinePosterStudio .ps-tag{background:#123f62;border-radius:7px;padding:3px 7px;font-size:10px;color:#b9f0ff}
#skylinePosterStudio .ps-note{background:#0d3559;border:1px solid #2d6592;padding:10px 12px;border-radius:10px;color:#bcddf5;font-size:12px;line-height:1.55}
#skylinePosterStudio .ps-empty{padding:15px;text-align:center;color:#b4d2ea;grid-column:1/-1}
@media(max-width:1040px){#skylinePosterStudio .ps-layout{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr)}#skylinePosterStudio .ps-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:790px){#skylinePosterStudio .ps-layout{display:flex;flex-direction:column}#skylinePosterStudio .ps-panel,#skylinePosterStudio .ps-visuals{width:100%}#skylinePosterStudio .ps-canvas-shell{position:static;order:-1}#skylinePosterStudio .ps-gallery{grid-template-columns:repeat(3,minmax(0,1fr));max-height:360px}}
@media(max-width:440px){#skylinePosterStudio .ps-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}#skylinePosterStudio .ps-template{min-height:109px}#skylinePosterStudio .ps-panel{padding:13px}#skylinePosterStudio .ps-pair{gap:8px}}

/* Step 34 — visibility and controls */
#skylinePosterStudio .ps-form input[type=range]{width:100%;height:28px;cursor:pointer;accent-color:#38c8ff}
#skylinePosterStudio .ps-panel .ps-caption{color:#bce4fb;font-size:12px;line-height:1.5}
#skylinePosterStudio .ps-template[data-picture]:before{background:linear-gradient(180deg,transparent 70%,#0006),var(--thumb) center/cover no-repeat}