@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--ink:#313131;--muted:#848484;--line:#e3e3e3;--green:#434343}*{box-sizing:border-box}body{margin:0;background:#f5f5f5;color:var(--ink);font:14px 'DM Sans',sans-serif}button,input,select{font:inherit}button{cursor:pointer}button,input,select{outline-offset:4px}button{border:0}aside{position:fixed;inset:0 auto 0 0;width:216px;background:#313131;color:#efefef;padding:36px 22px;display:flex;flex-direction:column}.brand{color:inherit;text-decoration:none;font:bold italic 42px Georgia;display:flex;align-items:center;gap:12px;margin:0 8px 65px}.brand span{font:600 11px 'DM Sans';letter-spacing:2px;max-width:70px;line-height:1.7}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:#838383}aside .eyebrow{font-size:9px;margin:0 12px 18px;color:#a2a2a2}.nav{background:none;color:#b8b8b8;padding:14px 12px;text-align:left;border-radius:7px;margin-bottom:8px}.nav.active{background:#434343;color:#fff}.nav span{float:right}.aside-bottom{margin-top:auto;display:flex;align-items:center;gap:10px;font-size:11px}.avatar{border:1px solid #7f7f7f;border-radius:50%;padding:10px;font-style:italic}.aside-bottom small{display:block;color:#a1a1a1;font-size:9px;margin-top:5px}main{margin-left:216px;padding:0 42px;max-width:1700px}header{height:84px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.crumb{font-size:10px;letter-spacing:1.5px;color:#7f7f7f}.crumb span{margin:0 15px;color:#c0c0c0}.badge{font-size:10px;color:#757575;background:#ebebeb;padding:8px 11px;border-radius:20px}.heading{display:flex;justify-content:space-between;align-items:center;padding:34px 0 28px}h1{font:400 36px Georgia;margin:10px 0}p{color:var(--muted);line-height:1.6;margin:6px 0}h2{font-size:15px;margin:0}h3{font:400 23px Georgia;margin:0}.primary{background:var(--green);color:white;padding:13px 21px;border-radius:6px;font-size:12px;font-weight:600}.primary:hover{background:#5a5a5a}.secondary{background:white;border:1px solid #d1d1d1;border-radius:5px;padding:11px;color:var(--green)}.wide{width:100%}.studio{display:grid;grid-template-columns:330px 1fr;gap:25px}.controls{border:1px solid var(--line);background:#fff;border-radius:9px;padding:22px}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.panel-title span{font-size:8px;letter-spacing:1px;color:#999999}label{display:block;font-size:11px;font-weight:600;margin:0 0 15px;color:#5d5d5d}input:not([type=file]):not([type=range]):not([type=color]),select{width:100%;display:block;border:1px solid #e3e3e3;border-radius:5px;padding:10px;background:#fcfcfc;color:#3c3c3c;margin-top:7px;font-size:12px;min-width:0}.pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.logo-row{display:flex;gap:13px;align-items:center;margin:6px 0 18px}#logoThumb{width:48px;height:48px;display:grid;place-items:center;background:#f2f2f2;border:1px dashed #c8c8c8;border-radius:5px;font:bold italic 21px Georgia;overflow:hidden}#logoThumb img{width:100%;height:100%;object-fit:contain}.upload{cursor:pointer;margin-bottom:4px;color:#545454}.logo-row small{font-size:9px;color:#959595}.divider{border-top:1px solid var(--line);margin:20px 0}.styles{display:flex;gap:9px;margin-bottom:20px}.style{flex:1;border:1px solid var(--line);background:#fff;border-radius:5px;padding:7px;font-size:9px;color:#777777}.style.selected{border-color:#696969;background:#f2f2f2;color:#464646}.mini{display:block;height:32px;margin-bottom:7px;background:linear-gradient(#242626 50%,#101111 50%);border-bottom:2px solid #c43a37;border-radius:2px}.mini.green{background:linear-gradient(#527257 50%,#264632 50%);border-color:#d8bb79}.mini.white{background:linear-gradient(#e6e6e6 50%,#fff 50%);border:1px solid #d4d4d4}.color-field{min-width:0;margin-bottom:15px}
.color-label{display:block;color:#5d5d5d;font-size:11px;font-weight:600}
.color-trigger{width:100%;margin-top:7px;display:flex;align-items:center;gap:8px;min-height:37px;padding:5px 8px;border:1px solid var(--line);border-radius:5px;background:#fff;text-align:left}
.color-trigger:hover{border-color:#8f8f8f}
.color-swatch{flex:0 0 20px;height:20px;border:1px solid #0003;border-radius:4px;background:var(--swatch)}
.color-value{font:11px ui-monospace,monospace}.local-note{text-align:center;font-size:9px;margin-top:10px}.preview-column{min-width:0}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;margin:0 0 13px;font-size:9px;letter-spacing:1px}.live-dot{display:inline-block;width:6px;height:6px;background:#8b8b8b;border-radius:50%;margin-right:7px}.segmented{display:flex;background:#ebebeb;padding:3px;border-radius:5px}.segmented button{background:none;padding:7px 11px;font-size:10px;color:#7c7c7c;border-radius:4px}.segmented .selected{background:#fff;color:#474747;box-shadow:0 1px 3px #0001}.stage{aspect-ratio:16/9;position:relative;border-radius:9px;overflow:hidden;background:#e3e3e3}.course-art{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,28,19,.2),transparent 45%,rgba(10,28,19,.12)),url("assets/aerial-golf-course.png") center/cover no-repeat}.stage-caption{position:absolute;top:13%;left:7%;font-size:9px;letter-spacing:3px;color:#fff;text-shadow:0 1px 4px #232323}.stage canvas{width:100%;height:100%;position:relative;display:block}.stage-label{position:absolute;bottom:12px;left:18px;right:18px;display:flex;justify-content:space-between;font-size:7px;letter-spacing:1px;color:#f9f9f9;text-shadow:0 1px 2px #404040}.stage.check{background:repeating-conic-gradient(#e2e2e2 0% 25%,#f3f3f3 0% 50%) 50%/24px 24px}.check .course-art,.check .stage-caption{display:none}.check .stage-label{color:#6c6c6c;text-shadow:none}.preview-foot{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#8e8e8e;padding:13px 0 21px}.text-btn{font-size:10px;color:#616161;background:none;padding:5px}.export-panel{border:1px solid var(--line);border-radius:8px;padding:24px;background:#efefef}.export-panel p{font-size:11px}.export-options{display:flex;align-items:end;gap:12px;margin-top:20px}.export-options label{flex:1;margin-bottom:0}.export-options button{height:37px}.placement{display:flex;align-items:center;gap:24px;border-top:1px solid #dedede;margin-top:22px;padding-top:16px}.placement label{flex:1;margin:0}.placement input{width:100%;display:block;margin-top:15px;accent-color:#5c5c5c}.scores{background:white;border:1px solid var(--line);border-radius:9px;margin-top:26px;padding:24px}.score-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.score-heading h2{font:400 25px Georgia;margin-top:8px}.totals{display:flex;gap:30px}.totals small{display:block;font-size:8px;letter-spacing:1px;color:#939393}.totals strong{display:block;font:400 25px Georgia;margin-top:5px}.score-scroll{overflow:auto}table{border-collapse:collapse;width:100%;min-width:760px;text-align:center}th{font-size:10px;color:#8c8c8c;background:#f4f4f4;font-weight:500;padding:10px 2px}th:first-child{text-align:left;padding-left:10px;width:65px}td{border-bottom:1px solid #ececec;padding:5px 2px}td input{width:34px!important;margin:0 auto!important;text-align:center;padding:8px 0!important;border-color:transparent!important;background:transparent!important;appearance:textfield}td input:focus{background:#f3f3f3!important;border-color:#a0a0a0!important}td input::-webkit-inner-spin-button{appearance:none}.score-footer{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#929292;margin-top:15px}footer{display:flex;justify-content:space-between;font-size:9px;color:#9f9f9f;letter-spacing:1px;padding:26px 0}footer span{letter-spacing:0}dialog{border:1px solid #dcdcdc;border-radius:12px;width:480px;max-width:92vw;padding:26px;color:var(--ink)}dialog::backdrop{background:#15312266}dialog button{background:#f0f0f0;border-radius:4px;padding:8px}.saved-row{border-top:1px solid #e4e4e4;padding:14px 0;display:flex;align-items:center;gap:8px}.saved-row div{flex:1}.saved-row small{display:block;color:#8d8d8d;font-size:10px;margin-top:5px}#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);background:#323232;color:white;border-radius:7px;padding:14px 24px;z-index:5;display:none;font-size:12px}canvas.enter{animation:entrance 1.1s ease both}@keyframes entrance{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1500px){.studio{grid-template-columns:350px 1fr}.stage{max-height:480px}}@media(max-width:1150px){aside{width:170px;padding:30px 12px}main{margin-left:170px;padding:0 24px}.studio{grid-template-columns:290px 1fr;gap:18px}.preview-foot{flex-wrap:wrap;gap:8px}.export-options{flex-wrap:wrap}.export-options .primary{width:100%}.heading h1{font-size:30px}}@media(max-width:850px){aside{position:static;width:100%;height:64px;flex-direction:row;align-items:center;padding:12px 20px;gap:16px}.brand{margin:0;font-size:28px}.brand span{font-size:8px}aside>.eyebrow,.aside-bottom{display:none}.nav{margin:0;font-size:11px;padding:9px}main{margin:0;padding:0 18px}header{height:55px}.studio{grid-template-columns:1fr}.preview-column{grid-row:1}.heading{gap:10px}.heading h1{font-size:29px}.heading p{font-size:12px}.heading>.primary{display:none}.preview-foot{font-size:9px}.export-panel{padding:18px}.export-options{flex-wrap:nowrap}.export-options .primary{width:auto}.controls{padding:20px}.score-heading{align-items:start;gap:15px}.score-heading h2{font-size:21px}.totals{gap:15px}.totals strong{font-size:20px}.scores{padding:18px}.score-footer{gap:15px}footer{font-size:8px}}@media(prefers-reduced-motion:reduce){canvas.enter{animation:none}}

.styles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.mini.tour{background:linear-gradient(150deg,transparent 0 68%,#fff 69% 100%) top/100% 35% no-repeat,linear-gradient(90deg,#850700 0 8%,transparent 8%),linear-gradient(#141414 0 35%,#242424 35% 62%,#484848 62%);border-bottom:2px solid #dc3434}

.details-hint{font-size:11px;margin:-8px 0 18px;line-height:1.6}

#scoreTable th[data-player-label]{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.course-finder{margin:18px 0;padding:16px;border:1px solid #dbdbdb;border-radius:10px;background:#f6f6f6}.course-finder h3{margin:0 0 10px;font-size:16px}.course-finder p{font-size:12px;line-height:1.5}.course-result{display:block;text-align:left;width:100%;padding:10px;margin:6px 0;border:1px solid #d1d1d1;border-radius:6px;background:white;color:#222222;cursor:pointer}.course-result small{display:block;margin-top:4px}.course-finder button:disabled{opacity:.6;cursor:wait}.course-finder a{color:inherit}#loadedCourse{font-weight:600}#teeSummary{color:#5c5c5c}

/* Black interface accents */
:root{--ink:#202020;--muted:#7f7f7f;--line:#e2e2e2;--green:#000}aside{background:#101010;color:#f2f2f2}.nav.active{background:#303030;color:#fff}.primary:hover{background:#292929}.style.selected{border-color:#111;background:#f1f1f1;color:#111}.live-dot{background:#111}.placement input{accent-color:#000}#toast{background:#111}dialog::backdrop{background:#0006}
/* Vertical social workspace */
.format-choice{margin-bottom:6px}.format-hint{font-size:11px;margin:0 0 18px}.stage.vertical{aspect-ratio:9/16;width:min(100%,350px);max-height:none;margin:0 auto}.vertical .stage-caption{top:8%;font-size:8px;letter-spacing:2px}.vertical .course-art{background-position:57% center}.vertical .stage-label{font-size:6px;left:12px;right:12px;bottom:10px}.style:disabled{cursor:default;opacity:.45}.style.selected:disabled{opacity:1}.social-gallery{margin-top:28px;padding:26px;background:#fff;border:1px solid var(--line);border-radius:9px}.gallery-heading h2{font:400 27px Georgia;margin:10px 0}.gallery-heading p{font-size:12px;max-width:680px}.social-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:23px}.social-example{min-width:0}.example-scene{width:100%;max-width:250px;aspect-ratio:9/16;margin:0 auto 15px;background:linear-gradient(#0002,#0002),url('assets/aerial-golf-course.png') 57% center/cover;border-radius:7px;overflow:hidden}.example-scene canvas{display:block;width:100%;height:100%}.social-example h3{font:600 16px 'DM Sans',sans-serif;margin:0 0 7px}.social-example p{font-size:11px;min-height:36px}.example-actions{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-top:12px}.example-actions .primary{font-size:10px;padding:10px 12px}.social-gallery>.local-note{text-align:left;margin-top:20px}.format-choice select{max-width:350px}@media(max-width:650px){.social-gallery{padding:18px}.social-examples{grid-template-columns:1fr}.social-example{display:grid;grid-template-columns:110px 1fr;column-gap:16px}.example-scene{grid-row:1/4;margin:0}.social-example h3{align-self:end}.social-example p{min-height:0}.example-actions{align-content:start;margin-top:4px}}
[hidden]{display:none!important}
.par-toggle{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid var(--line);border-radius:6px;background:#fafafa}.par-toggle input[type=checkbox]{appearance:auto;width:16px!important;height:16px;margin:0!important;padding:0!important;flex:0 0 16px;accent-color:#000}.par-toggle span{line-height:1.5}.par-toggle small{display:block;margin-top:4px;font-size:10px;font-weight:400;color:#777}
.mini.glass{position:relative;border:1px solid #ffffff80;border-radius:9px;background:linear-gradient(155deg,#65666f 0%,#13151bcc 42%,#0009 100%);box-shadow:inset 0 1px 2px #fff9,0 3px 8px #0002;overflow:hidden}.mini.glass:after{content:'';position:absolute;inset:2px 4px 55%;border-radius:40%;background:linear-gradient(100deg,#fff5,#fff0);transform:rotate(-8deg)}.mini.glass.clear{background:linear-gradient(145deg,#fff,#dfe5ed99 48%,#fff6);border-color:#d1d6de;box-shadow:inset 0 1px 2px #fff,0 3px 8px #0001}
.score-actions{display:flex;flex-direction:column;align-items:flex-end;gap:10px;flex-shrink:0}.score-actions .primary{white-space:nowrap}@media(max-width:650px){.score-footer{align-items:flex-start;flex-wrap:wrap}.score-actions{margin-left:auto}}
#exportDialog{width:560px}
#exportInfo{font-size:13px;margin:0 0 12px}
#exportImage{display:block;width:100%;max-height:46vh;object-fit:contain;border-radius:6px;background:repeating-conic-gradient(#e0e0e0 0% 25%,#f4f4f4 0% 50%) 0 0/20px 20px}
.export-links{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:16px}
.export-links a{font-size:13px}
.export-links .primary{text-decoration:none}


#colorPicker{width:610px;max-width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:24px;background:#1d1d20;color:#f6f6f7;border-color:#48484e;color-scheme:dark}
#colorPicker h2{margin:0;font-size:22px}
#colorPickerTarget{margin:4px 0 20px;color:#bdbdc5;font-size:13px}
.picker-body{display:grid;grid-template-columns:minmax(0,1fr) 155px;gap:20px}
.picker-spectrum{display:grid;grid-template-columns:minmax(0,1fr) 24px;gap:12px;align-items:stretch;min-width:0}
#colorPlane{position:relative;aspect-ratio:1;touch-action:none;cursor:crosshair;border:1px solid #777;border-radius:5px;background:linear-gradient(to bottom,#000,transparent),linear-gradient(to right,#fff,var(--picker-hue,#f00))}
#colorMarker{position:absolute;display:block;width:15px;height:15px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #000;transform:translate(-50%,-50%);pointer-events:none}
#colorPicker #colorHue{writing-mode:vertical-lr;direction:ltr;appearance:none;width:24px;height:100%;margin:0;padding:0;border:1px solid #777;border-radius:5px;background:linear-gradient(to bottom,red,#ff0,#0f0,#0ff,#00f,#f0f,red);cursor:ns-resize;touch-action:none}
#colorHue::-webkit-slider-thumb{appearance:none;width:24px;height:8px;border:2px solid #fff;border-radius:3px;background:#242426;box-shadow:0 0 0 1px #000}
#colorHue::-moz-range-thumb{width:20px;height:5px;border:2px solid #fff;border-radius:3px;background:#242426;box-shadow:0 0 0 1px #000}
.picker-swatches,.picker-rgb{display:grid;gap:6px}
.picker-swatches{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:12px;color:#bdbdc5;font-size:11px;text-align:center}
.picker-swatches span{display:block;height:50px;margin-bottom:5px;border:1px solid #777;border-radius:5px}
.picker-rgb{grid-template-columns:repeat(3,minmax(0,1fr))}
#colorPicker label{margin:0 0 9px;color:#dedee3}
#colorPicker label input{min-width:0;width:100%;height:33px;margin:4px 0 0;padding:4px 6px;border:1px solid #55555d;border-radius:5px;background:#111114;color:#fff;font:12px ui-monospace,monospace}
#colorPicker input[type=number]{appearance:textfield}
#colorPicker input[type=number]::-webkit-inner-spin-button{appearance:none}
#colorPlaneHelp{margin:15px 0 0;color:#bdbdc5;font-size:11px}
.picker-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
#colorPicker .picker-actions button{padding:9px 14px;border-radius:6px;background:#38383e;color:#fff}
#colorPicker .picker-actions .primary{background:#1268d8}
#colorPicker :focus-visible{outline:2px solid #8fc0ff;outline-offset:2px}
@media(max-width:520px){
 #colorPicker{padding:16px}
 .picker-body{grid-template-columns:minmax(0,1fr);gap:14px}
 .picker-spectrum{width:min(100%,280px);margin-inline:auto}
 .picker-details{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 12px;align-items:end}
 .picker-swatches{grid-row:span 2;margin-bottom:0}
 .picker-swatches span{height:40px}
 #colorPicker label{margin-bottom:0}
}


.result-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px}
.result-section-title h2{margin:0;font-size:18px}
.result-section-title span,.result-meta{color:#686868;font-size:12px}
.result-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,248px),1fr));gap:18px}
.result-card{display:flex;flex-direction:column;gap:14px;min-width:0;padding:12px;border:1px solid var(--line);border-radius:9px;background:#fff}
.result-card video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;border-radius:6px;background:#171717}
.result-card-info{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding-inline:2px}
.result-card-info h3{margin:0 0 4px;font-size:15px}
.result-tag{white-space:nowrap;border:1px solid var(--line);border-radius:5px;padding:3px 6px;font-size:11px;font-weight:700;color:#555}
.result-download{align-self:flex-start;text-decoration:none;padding:10px 13px}

.glass-tint-reset{margin-top:7px}
.mini.ledger{border:1px solid #173826;background:linear-gradient(90deg,transparent 82%,#173826 82%) bottom/100% 35% no-repeat,repeating-linear-gradient(90deg,transparent 0 14%,#64765e 14% 15%) bottom/100% 61% no-repeat,linear-gradient(#fcf6e7 0 38%,#64765e 38% 42%,#f7efdb 42%)}