:root{color:#172c35;background:#f2f4f5;font-family:system-ui,sans-serif;font-size:16px}body{margin:0}main{max-width:1440px;margin:auto;padding:20px}h1{margin:12px 0;font-size:1.6rem}a{color:#125175}p{line-height:1.5}header p{color:#415663}.workspace{grid-template-columns:minmax(0,1fr) 300px;gap:20px;display:grid}section,aside{min-width:0}canvas{aspect-ratio:5/3;touch-action:none;background:#174934;width:100%;display:block}fieldset{border:1px solid #bac7cd;border-radius:4px;margin:0 0 12px;padding:12px}label{margin:8px 0;display:block}input,select,button{font:inherit;box-sizing:border-box;max-width:100%;min-height:44px}input,select{border:1px solid #8b9ba5;border-radius:3px;width:100%;padding:6px}button{cursor:pointer;color:#143445;background:#fff;border:1px solid #718592;border-radius:4px;padding:8px 14px}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline-offset:2px;outline:3px solid #087f9c}.buttons{flex-wrap:wrap;gap:6px;display:flex}#error{color:#9d1e24;overflow-wrap:anywhere;min-height:1.5em}#status{font-weight:600}#results{overflow-wrap:anywhere;margin:16px 0}input[type=checkbox]{vertical-align:middle;width:24px}@media (width<=900px){.workspace{grid-template-columns:1fr}main{padding:12px}}.layers{flex-wrap:wrap;gap:16px;display:flex}.note{color:#465963;font-size:.85rem}.event-log{overflow-wrap:anywhere;max-height:220px;padding-left:24px;font-size:.85rem;overflow:auto}.result-card{background:#fff;border:1px solid #bac7cd;border-radius:4px;margin:8px 0;padding:12px}summary{cursor:pointer;min-height:44px;padding-top:8px}#rate{width:auto}#player-editor{padding:8px}#player-info{overflow-wrap:anywhere}.history{padding:0;list-style:none}.history>li{overflow-wrap:anywhere;background:#fff;border:1px solid #bac7cd;margin:10px 0;padding:12px}.history h3{margin:0;font-size:1rem}.history p{font-size:.9rem}.history pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:200px;font-size:.8rem;overflow:auto}#s3-shot-controls button,#s3-ambiguity button{min-width:44px;min-height:44px}#s3-ambiguity{margin:8px 0}#s3-shot-status{overflow-wrap:anywhere}#power{touch-action:none;min-height:44px}@media (width>=901px) and (width<=999px){.workspace{grid-template-columns:1fr}main{padding:12px}}.fit-toolbar{align-items:center;gap:12px;margin-bottom:8px;display:flex}.fit-hint{font-size:.85rem}.field-space{min-width:0;min-height:0}body.field-fitted{overflow:hidden}main.fit-mode{z-index:1;left:var(--fit-left,0px);top:var(--fit-top,0px);width:var(--fit-width,100%);height:var(--fit-height,100dvh);box-sizing:border-box;max-width:none;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:#f2f4f5;grid-template-rows:auto minmax(0,1fr);margin:0;display:grid;position:fixed;overflow:auto}.fit-mode>header,.fit-mode .fit-secondary{display:none}.fit-mode .workspace{grid-template-columns:minmax(0,1fr) 248px;gap:12px;min-height:0}.fit-mode .workspace>section{flex-direction:column;min-height:0;display:flex}.fit-mode .field-space{flex:1;justify-content:center;align-items:center;display:flex;overflow:hidden}.fit-mode canvas{flex:none;max-width:100%;max-height:100%}.fit-mode .renderer-control{align-items:center;gap:8px;margin:0 0 6px;font-size:.9rem;display:flex}.fit-mode #renderer-choice{flex:1;width:auto;min-width:0}.fit-mode #status,.fit-mode #error,.fit-mode #renderer-error{margin:4px 0;font-size:.85rem}.fit-mode #error:empty,.fit-mode #renderer-error:empty,.fit-mode #transport button:disabled{display:none}.fit-mode #transport button{padding:8px}.fit-mode aside{min-height:0;overflow:auto}.fit-mode #editor{flex-direction:column;min-width:0;margin:0;padding:6px;display:flex}.fit-mode #editor>legend{font-size:.85rem}.fit-mode #s3-shot-controls{order:-3;min-width:0;margin:0;padding:6px}.fit-mode #s3-shot-controls .buttons{grid-template-columns:1fr;display:grid}.fit-mode #s3-shot-controls button:disabled{display:none}.fit-mode #s3-shot-status{margin:6px 0}.fit-mode #s3-ambiguity{order:-4}.fit-mode .shot-power{order:-2}.fit-mode .shot-speed{order:-1}.fit-mode .shot-angle{margin-bottom:0}.fit-mode #editor>label{margin:6px 0;font-size:.85rem}@media (width>=901px) and (orientation:landscape){main:not(.fit-mode){padding:12px}main:not(.fit-mode)>header p{display:none}main:not(.fit-mode) h1{margin:4px 0;font-size:1.2rem}main:not(.fit-mode) .fit-hint{display:none}main:not(.fit-mode) #editor{flex-direction:column;display:flex}main:not(.fit-mode) #s3-shot-controls{order:-3}main:not(.fit-mode) .shot-power{order:-2}main:not(.fit-mode) .shot-speed{order:-1}main:not(.fit-mode) #s3-shot-help{display:none}}.fit-mode.fit-compact .workspace{flex-direction:column;display:flex;overflow:auto}.fit-mode.fit-compact .workspace>section{flex:none}.fit-mode.fit-compact .field-space{height:min(calc(var(--fit-height)*.5),calc(var(--fit-width)*.58));flex:none}.fit-mode.fit-compact aside{flex:none;overflow:visible}.fit-mode.fit-compact .fit-hint{font-size:.75rem}.fit-mode.fit-compact #editor{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.fit-mode.fit-compact #s3-shot-controls{grid-column:1/-1}.fit-mode.fit-compact #s3-shot-controls .buttons{display:flex}.fit-mode.fit-compact #s3-shot-controls button{flex:1}@media (width>=901px) and (orientation:landscape){main:not(.fit-mode)>header{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:4px;display:flex}main:not(.fit-mode)>header a{font-size:.8rem}main:not(.fit-mode) .renderer-control{align-items:center;gap:8px;margin:4px 0;display:flex}main:not(.fit-mode) #renderer-choice{flex:1;width:auto;min-width:0}main:not(.fit-mode) .renderer-control~p.fit-secondary,main:not(.fit-mode) #renderer-error:empty,main:not(.fit-mode) #error:empty{display:none}main:not(.fit-mode) .field-space{justify-content:center;display:flex}main:not(.fit-mode) canvas{width:min(100%,166.667dvh - 406.667px);height:auto}main:not(.fit-mode) #status{margin:6px 0;font-size:.85rem}main:not(.fit-mode) #transport button:disabled:not(#run):not(#compare),main:not(.fit-mode) #s3-shot-controls button:disabled{display:none}main:not(.fit-mode) aside{flex-direction:column;display:flex}main:not(.fit-mode) #editor{order:-1;padding:8px}main:not(.fit-mode) #s3-shot-controls{margin:0;padding:6px}main:not(.fit-mode) #s3-shot-status{margin:6px 0}main:not(.fit-mode) .shot-angle:has(input:disabled){display:none}}.fit-mode .shot-angle:has(input:disabled){display:none}@media (width>=1200px){main:not(.fit-mode){padding:20px}}
