@import url('./playbill.css');

/* Shared Playbill identity for existing forms. Their IDs and controllers stay intact. */
body{background:var(--ink);color:var(--paper)}
#stage-designs{max-width:1180px;color:var(--paper);font:17px/1.6 "Source Serif 4",Georgia,serif}
#stage-designs .screen{--gold:var(--brass);background:var(--ink);color:var(--paper);overflow:visible}
#stage-designs .nav{position:static;display:flex;flex-wrap:wrap;justify-content:flex-start;gap:24px;padding:24px 32px;border-bottom:1px solid var(--line);background:var(--ink2)}
#stage-designs .nav .brand{font:30px "League Gothic",Impact,sans-serif;letter-spacing:.18em;color:var(--brass);margin-right:auto}
#stage-designs .nav>a:not(.brand){font:600 12px "Public Sans",sans-serif;letter-spacing:.05em;padding:10px 0}
#stage-designs .page{padding:44px 32px;min-width:0;max-width:1080px;margin:auto}
#stage-designs .page h1{font:clamp(44px,6vw,74px)/1.05 "League Gothic",Impact,sans-serif;letter-spacing:.02em;color:var(--paper);margin:22px 0}
#stage-designs h2{font:400 32px/1.2 "League Gothic",Impact,sans-serif;color:var(--paper);margin:22px 0 14px}
#stage-designs h3{font:600 17px/1.4 "Public Sans",sans-serif;color:var(--brass2)}
#stage-designs p,#stage-designs li{overflow-wrap:anywhere}
#stage-designs .eyebrow{font:600 11px "Public Sans",sans-serif;letter-spacing:.2em;color:var(--brass);line-height:1.6}
#stage-designs .form-panel,#stage-designs .summary{background:var(--ink2);border:1px solid var(--line);border-top:2px solid var(--brass);border-radius:2px;padding:28px;max-width:760px;margin:28px 0}
#stage-designs .form-panel label{font:600 12px/1.6 "Public Sans",sans-serif;color:var(--paper2);margin:22px 0 9px;letter-spacing:.04em}
#stage-designs input,#stage-designs select,#stage-designs textarea,#stage-designs .form-panel input,#stage-designs .form-panel select,#stage-designs .form-panel textarea{font:16px/1.4 "Public Sans",sans-serif;width:100%;max-width:100%;background:var(--ink);color:var(--paper);border:1px solid #5a4a2e;padding:13px 14px;border-radius:2px}
#stage-designs input[type=checkbox]{width:18px;height:18px;padding:0;flex:0 0 18px;accent-color:var(--brass)}
#stage-designs input[type=file]{font-size:14px}
#stage-designs .page button,#stage-designs .action-link{font:600 12px/1.5 "Public Sans",sans-serif;letter-spacing:.06em;background:var(--brass);color:var(--ink);border:1px solid var(--brass);border-radius:2px;padding:13px 18px;max-width:100%;white-space:normal;overflow-wrap:anywhere;margin:12px 10px 10px 0}
#stage-designs .action-link{display:inline-block;background:var(--ink2);color:var(--brass2)}
#stage-designs a:not(.action-link){color:var(--brass2)}
#stage-designs button:disabled{opacity:.55;cursor:not-allowed}
#stage-designs [role=status]{color:var(--paper2);line-height:1.6}
#stage-designs [role=alert]{color:#f0bcb0}
#stage-designs .notice{background:var(--ink3);color:var(--paper2);padding:18px;border-left:2px solid var(--brass)}
#stage-designs table{display:block;width:100%;max-width:100%;overflow-x:auto;border-collapse:collapse;font:14px/1.6 "Public Sans",sans-serif}
#stage-designs td,#stage-designs th{padding:14px 12px;border-color:var(--line);color:var(--paper2);overflow-wrap:anywhere}
#stage-designs th{color:var(--brass)}
#stage-designs img{max-width:100%;height:auto}
#stage-designs :focus-visible{outline:2px solid var(--brass2);outline-offset:4px}
#stage-designs [hidden]{display:none!important}
body.payment-test{max-width:none;margin:0;padding:0;font:17px/1.6 "Source Serif 4",Georgia,serif}
body.payment-test #purchase{max-width:680px;background:var(--ink2);padding:24px;border-top:2px solid var(--brass)}
body.payment-test pre{white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:650px){#stage-designs .nav{gap:16px;padding:20px}#stage-designs .page{padding:28px 20px}#stage-designs .form-panel,#stage-designs .summary{padding:20px}#stage-designs .page h1{font-size:48px}#stage-designs .page button{margin-right:6px}#stage-designs td,#stage-designs th{padding:12px 8px}}

#stage-designs .field-help{font:14px/1.5 "Public Sans",sans-serif;color:var(--paper2);margin:8px 0 12px}#stage-designs .field-count{font:13px/1.5 "Public Sans",sans-serif;color:var(--paper2);text-align:right;margin:6px 0 12px}

#stage-designs .upload-preview{margin:16px 0;padding:12px;border:1px solid var(--line);max-width:520px}#stage-designs .upload-preview img{display:block;max-width:100%;max-height:260px;object-fit:contain;margin:auto}#stage-designs .upload-preview figcaption{font:13px/1.5 "Public Sans",sans-serif;color:var(--paper2);margin-top:10px}

#stage-designs .appearance-preview{border:1px solid var(--line);padding:22px;margin:20px 0;background:var(--ink)}#stage-designs .appearance-preview .bio{display:flex;align-items:center;gap:24px;min-width:0}#stage-designs .appearance-preview h3{margin:0 0 8px}#stage-designs .appearance-preview p{margin:6px 0}#stage-designs .appearance-avatar{flex:0 0 76px;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;position:relative;background:var(--ink3);border:1px solid var(--brass);color:var(--brass2);font:32px "League Gothic",sans-serif}@media(max-width:480px){#stage-designs .appearance-preview .bio{flex-direction:column;text-align:center}#stage-designs .appearance-preview{padding:28px 16px}}

#stage-designs .account-danger{margin-top:40px;padding:24px;border:1px solid #9a5d53;border-left:4px solid #ce8b7c;background:#241512}#stage-designs .account-danger h3{color:#f0bcb0;margin-top:0}#stage-designs .page .danger-action{background:transparent;color:#f0bcb0;border-color:#ce8b7c}#stage-designs .page .danger-action:hover{background:#3d201b}@media(max-width:480px){#stage-designs .account-danger{padding:18px}}

#stage-designs .support-topics{margin:28px 0;max-width:760px}#stage-designs .support-topics [role=group]{display:flex;gap:10px;flex-wrap:wrap}#stage-designs .support-topics button{margin:0;background:transparent;color:var(--brass2)}#stage-designs .support-topics button[aria-pressed=true]{background:var(--brass);color:var(--ink)}

/* Policy guide: visible routes to full draft documents. */
#stage-designs .policy-guide{margin:32px 0 40px}
#stage-designs .policy-guide>h2{margin-bottom:12px}
#stage-designs .policy-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}
#stage-designs .policy-shortcuts>a{display:flex;flex-direction:column;gap:12px;padding:22px;border:1px solid var(--brass,#c9a24f);border-radius:6px;background:var(--ink2,#17130f);text-decoration:none;min-width:0}
#stage-designs .policy-shortcuts strong{font-size:22px;line-height:1.3}
#stage-designs .policy-shortcuts span{font-size:16px;line-height:1.5;color:var(--paper2,#d4c9b4)}
#stage-designs .policy-shortcuts .policy-shortcut-action{margin-top:auto;padding-top:10px;color:var(--brass2,#e2c677);font-weight:600}
#stage-designs .policy-shortcuts>a:hover,#stage-designs .policy-shortcuts>a:focus-visible{background:#292216;outline:2px solid var(--brass2,#e2c677);outline-offset:3px}
#stage-designs .policy-overview{padding:24px;border-left:3px solid var(--brass,#c9a24f);background:#191610}
#stage-designs .policy-overview h3{margin-top:0}#stage-designs .policy-overview ul{padding-left:22px}#stage-designs .policy-overview li{margin:14px 0;font-size:16px}
#stage-designs section[id]{scroll-margin-top:24px}
@media(max-width:700px){#stage-designs .policy-shortcuts{grid-template-columns:1fr}#stage-designs .policy-overview{padding:18px}#stage-designs .policy-shortcuts>a{padding:18px}}

/* Account: separate saved server images from local, unsaved selections. */
#stage-designs .account-profile-preview{scroll-margin-top:24px}
#stage-designs .account-profile-card{border:1px solid var(--line);background:var(--ink);overflow:hidden}
#stage-designs .account-cover{aspect-ratio:8/3;background:var(--ink3);overflow:hidden}
#stage-designs .account-cover img{display:block;width:100%;height:100%;object-fit:cover}
#stage-designs .account-empty-image{display:grid;place-items:center;color:var(--paper2);font-size:14px}
#stage-designs .account-profile-body{padding:24px}
#stage-designs .account-profile-identity{display:flex;align-items:center;gap:18px;min-width:0}
#stage-designs .account-profile-identity h3{margin:0;overflow-wrap:anywhere;min-width:0}
#stage-designs .account-avatar{width:80px;height:80px;flex:0 0 80px;border:1px solid var(--brass);border-radius:50%;display:grid;place-items:center;overflow:hidden;font:32px "League Gothic",sans-serif}
#stage-designs .account-avatar img{width:100%;height:100%;object-fit:cover}
#stage-designs [data-profile-frame=crown] .account-avatar{border:3px double var(--brass);box-shadow:0 0 0 4px var(--ink3)}
#stage-designs .account-profile-card[data-profile-theme=midnight]{background:#111827}
#stage-designs .account-profile-card[data-profile-theme=royal]{background:#281c36}
#stage-designs .account-bio{white-space:pre-wrap;overflow-wrap:anywhere}
#stage-designs .account-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#stage-designs .account-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover}
#stage-designs .account-photo-slot{border-top:1px solid var(--line);margin-top:28px;padding-top:12px}
#stage-designs .saved-image{margin:16px 0;max-width:520px;padding:12px;border:1px solid var(--brass)}
#stage-designs .saved-image img{display:block;max-height:240px;max-width:100%;object-fit:contain;margin:auto}
#stage-designs .saved-image figcaption{font:13px/1.5 "Public Sans",sans-serif;color:var(--paper2);margin-top:10px}
@media(max-width:480px){#stage-designs .account-profile-body{padding:16px}#stage-designs .account-avatar{width:60px;height:60px;flex-basis:60px}#stage-designs .account-gallery{gap:8px}}
