.enhanced-grid{display:grid;grid-template-columns:minmax(250px,.8fr) minmax(0,1.4fr);gap:28px}.enhanced-actions,.editor-toolbar,.editor-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.enhanced-actions .button,.editor-toolbar .button,.editor-tabs .button{font-size:13px;padding:10px 15px}.enhanced-controls input,.enhanced-controls select,.enhanced-controls textarea,.image-options input:not([type=checkbox]),.image-options select,.video-settings input:not([type=checkbox]),.video-settings select{width:100%;box-sizing:border-box}.enhanced-controls textarea{min-height:220px;line-height:1.7}.check-field{display:flex!important;align-items:center;gap:10px;margin:14px 0;color:var(--muted);font-size:13px}.check-field input{width:16px!important;height:16px;accent-color:#92c5b4;flex:none}.chart-stage{overflow:hidden;border-radius:16px;border:1px solid var(--line);min-height:200px;display:grid;place-items:center;background:#13313b88}.chart-stage>svg{display:block;max-width:100%;width:100%;height:auto}.editor-tabs .button[aria-pressed=true]{background:#9ac5b526;border-color:#a7d1c16b;color:var(--ink)}.enhanced-editor{grid-template-columns:minmax(0,1fr) minmax(240px,300px);align-items:start;gap:24px}.image-viewport{min-height:240px;overflow:auto;padding:12px;display:flex;align-items:center;justify-content:center;background:repeating-conic-gradient(#9cbbb11c 0% 25%,#17323c44 0% 50%) 50%/18px 18px;border:1px solid var(--line);border-radius:14px}.image-surface{position:relative;max-width:100%;line-height:0;display:inline-block}.image-surface canvas{display:block;max-width:100%;max-height:62vh;width:auto;height:auto}.image-surface.cropping{touch-action:none;cursor:crosshair}.image-crop-box{position:absolute;border:1px solid #eff4dc;box-shadow:0 0 0 999px #061e2966;box-sizing:border-box;cursor:move;touch-action:none}.image-viewport{isolation:isolate}.image-surface{overflow:hidden}.image-crop-box .crop-thirds{position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right,transparent 33.2%,#ffffff66 33.3%,transparent 33.6%,transparent 66.5%,#ffffff66 66.6%,transparent 66.9%),linear-gradient(to bottom,transparent 33.2%,#ffffff66 33.3%,transparent 33.6%,transparent 66.5%,#ffffff66 66.6%,transparent 66.9%)}.image-crop-box button{position:absolute;width:15px;height:15px;border:2px solid #17333d;background:#e3eedb;padding:0;border-radius:3px;z-index:2;touch-action:none}.image-crop-box [data-crop-corner=nw]{left:-1px;top:-1px;cursor:nw-resize}.image-crop-box [data-crop-corner=ne]{right:-1px;top:-1px;cursor:ne-resize}.image-crop-box [data-crop-corner=sw]{left:-1px;bottom:-1px;cursor:sw-resize}.image-crop-box [data-crop-corner=se]{right:-1px;bottom:-1px;cursor:se-resize}.range-field{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;color:var(--muted);font-size:13px;margin:18px 0}.range-field input{flex:0 0 100%;accent-color:#9fc5b4}.image-export{border-top:1px solid var(--line);margin-top:20px;padding-top:10px}.image-options .button{font-size:12px;padding:10px 14px}.video-preview{display:block;width:100%;max-height:65vh;object-fit:contain;background:#0b232e;border:1px solid var(--line);border-radius:14px}.video-play-controls{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin:16px 0}.video-play-controls label{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}.video-settings{margin-top:26px;border-top:1px solid var(--line);padding-top:22px}#video-progress{width:100%;accent-color:#a0cbb4}.video-result{margin-top:25px;border-top:1px solid var(--line);padding-top:18px}.video-result .button{display:inline-flex}.assessment-evaluation{padding:22px;margin:26px 0;border-radius:16px;border:1px solid #99bcae42;background:#91bba70b}.assessment-evaluation>strong{font-size:20px;font-weight:500;color:var(--accent);line-height:1.6}.assessment-evaluation h4{font-size:14px;font-weight:500;margin:20px 0 8px}.assessment-evaluation p,.assessment-evaluation li{font-size:14px;line-height:1.9;color:var(--muted)}.assessment-evaluation li{margin:8px 0}.evaluation-row{border-top:1px solid var(--line);margin-top:18px}.support-note>p{margin-top:0}.support-note .button{font-size:12px;padding:8px 14px}
/* Use padding-based squares on older Android WebView cores used by Via. */
.garden-board{aspect-ratio:auto;z-index:0;isolation:isolate}.garden-board::before{content:"";display:block;padding-top:100%;pointer-events:none}#game-garden .garden-tile{box-sizing:border-box;-webkit-appearance:none;appearance:none;overflow:hidden;filter:none!important;backface-visibility:visible;transition:background-color .12s}#game-garden .garden-tile>svg{position:absolute;left:12%;top:12%;width:76%;height:76%}.garden-slot{aspect-ratio:auto}.garden-slot::before{content:"";display:block;padding-top:100%}.garden-tile>span{font-size:18px;line-height:1}.garden-pile-count,.garden-map-caption{pointer-events:none}
#tool-chart [hidden],#tool-image [hidden],#tool-video [hidden],#assessment-quiz[hidden],#assessment-result[hidden]{display:none!important}
/* Range tracks span the entire control, without text-field padding. */
#tool-video input[type=range]{appearance:none;-webkit-appearance:none;display:block;height:26px;padding:0;border:0;border-radius:0;background:transparent;margin:0;box-shadow:none;touch-action:none;cursor:pointer;min-width:0}
#tool-video input[type=range]::-webkit-slider-runnable-track{height:5px;border:0;border-radius:8px;background:#a6c6b550}
#tool-video input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:1px solid #f1f3dd;border-radius:50%;background:#c2d9c8;margin-top:-6.5px;box-shadow:0 1px 5px #152e3555}
#tool-video input[type=range]::-moz-range-track{height:5px;border:0;border-radius:8px;background:#a6c6b550}
#tool-video input[type=range]::-moz-range-thumb{width:16px;height:16px;border:1px solid #f1f3dd;border-radius:50%;background:#c2d9c8}
#tool-video input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
#video-volume{width:160px;max-width:65vw;flex:0 1 160px}
/* Animate card artwork and colors while leaving layered hitboxes stationary. */
#game-garden .garden-tile{background:#e9e7cd linear-gradient(135deg,#f6f2dd,#dbdfc3);border-color:#cbd2b5;transition:border-color .16s,box-shadow .16s}
#game-garden .garden-tile.reserve{background:#dce4c8 linear-gradient(135deg,#eef0da,#cdd8b9)}
#game-garden .garden-tile::after{content:"";position:absolute;inset:0;border-radius:inherit;background:#000;opacity:0;z-index:2;pointer-events:none;transition:opacity .16s}
#game-garden .garden-tile.covered::after{opacity:.34}
#game-garden .garden-tile.covered{border-color:#888d79;box-shadow:0 4px 0 #506050,0 6px 10px #102c3844}
#game-garden .garden-tile.blind-back{color:#63715e;box-shadow:0 4px 0 #506050,0 8px 0 #415041,0 11px 0 #344234,0 13px 13px #102c3844}
#game-garden .garden-tile.is-revealing>svg,#game-garden .garden-tile.is-revealing>span{animation:garden-reveal .18s ease-out}
.garden-slot.is-shifting:not(.is-clearing){animation:garden-tray-slide .14s cubic-bezier(.22,1,.36,1)}
@keyframes garden-reveal{from{opacity:.55;transform:translateY(2px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes garden-tray-slide{from{transform:translate(var(--tray-from-x),var(--tray-from-y))}to{transform:translate(0,0)}}
@keyframes garden-fly{0%{transform:translate(0,2px) scale(.94,.94)}15%{transform:translate(0,0) scale(1,1)}55%{transform:translate(var(--flight-mid-x),var(--flight-mid-y)) scale(var(--flight-mid-sx),var(--flight-mid-sy))}100%{transform:translate(var(--flight-x),var(--flight-y)) scale(var(--flight-sx),var(--flight-sy))}}
@media(prefers-reduced-motion:reduce){#game-garden .garden-tile,#game-garden .garden-tile::after{transition:none}#game-garden .garden-tile.is-revealing>svg,#game-garden .garden-tile.is-revealing>span,.garden-slot.is-shifting:not(.is-clearing){animation:none}}
@media(max-width:1000px){.enhanced-grid,.enhanced-editor{grid-template-columns:minmax(0,1fr)}.image-options{display:block}.image-viewport{min-height:180px}.image-surface canvas{max-height:52vh}}
@media(max-width:600px){.enhanced-grid{gap:20px}.editor-toolbar{gap:7px}.editor-toolbar .button{flex:1 0 40%;font-size:12px;padding:9px}.enhanced-actions .button{font-size:12px}.assessment-evaluation{padding:18px}.video-play-controls label{width:100%;justify-content:space-between}}