:root{font-family:Arial,Helvetica,sans-serif;color:#111;background:#fff}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}.legacy-page{padding:14px 20px 28px}.legacy-page h1{font-size:24px;margin:0 0 4px}.intro{font-style:italic;margin:4px 0 18px}.legacy-actions{display:flex;gap:8px;margin-bottom:4px}.legacy-actions button,.bottom-actions button,.legacy-page>button{padding:5px 10px;font-weight:600;border:1px solid #aaa;border-radius:6px;background:linear-gradient(#f9f9f9,#d8d8d8)}.legacy-actions button:disabled{opacity:.65}.legacy-table{border-collapse:collapse;min-width:540px}.legacy-table th{text-align:left;border-bottom:2px solid #888}.legacy-table th,.legacy-table td{padding:5px 8px 5px 4px}.legacy-table tbody tr{border-bottom:1px solid #bbb}.link-button{border:0;background:none;color:#153a9b;text-decoration:underline;padding:0;cursor:pointer}.delete-x{color:#b40000;border:0;background:none;cursor:pointer;font-size:16px}.layout-fields{margin:16px 0;display:grid;gap:8px;width:340px}.layout-fields label{display:grid;grid-template-columns:64px 165px 20px;gap:8px;align-items:center}.layout-fields input,.layout-fields select{height:26px}.display-box{border:1px solid #bbb;background:#efefef;padding-bottom:16px}.display-tab{display:inline-block;color:#fff;background:#087cf0;border:1px solid #005db8;padding:8px 14px;margin:6px 0 12px 6px}.canvas-holder{display:flex;justify-content:center;padding:0 22px;overflow:auto}.legacy-canvas{position:relative;min-width:600px;background:repeating-linear-gradient(45deg,#000 0,#000 6px,#303030 6px,#303030 12px);box-shadow:0 2px 10px #00000073;overflow:hidden}.zone-box{width:100%;height:100%;border-style:solid;display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden;-webkit-user-select:none;user-select:none}.zone-box span{font-size:clamp(18px,4vw,72px);text-shadow:0 2px 3px rgba(0,0,0,.5)}.zone-box.selected{outline:3px solid #0b80ff;outline-offset:-3px}.zone-summary-list{margin:6px 0;display:grid;gap:3px;max-width:720px}.zone-summary{display:flex;justify-content:space-between;gap:20px;border:1px dotted #777;background:#eee;padding:4px 8px;text-align:left}.zone-summary.active{border-color:#087cf0;background:#e9f3ff}.bottom-actions{margin-top:16px;display:flex;gap:10px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;display:flex;align-items:center;justify-content:center;z-index:1000}.zone-dialog{width:440px;max-height:92vh;background:#f5f5f5;border:1px solid #aaa;box-shadow:0 10px 35px #00000059;display:flex;flex-direction:column}.dialog-title{display:flex;justify-content:space-between;align-items:center;padding:7px 10px;background:#e5e5e5;border-bottom:1px solid #bbb}.dialog-title button{border:0;background:#ddd;font-size:22px;line-height:1}.dialog-scroll{padding:12px;overflow:auto}.dialog-row,.dual-field{display:grid;grid-template-columns:120px 1fr 28px;gap:6px;align-items:center;margin-bottom:8px}.dual-field{grid-template-columns:45px 74px 20px 74px 28px}.dialog-row input,.dialog-row select,.dual-field input{min-width:0;height:26px}.dialog-row input[type=color]{padding:0;width:100%}.checkbox-row input{width:auto;justify-self:start}.dialog-scroll hr{border:0;border-top:1px solid #c8c8c8;margin:16px 0}.dialog-actions{border-top:1px solid #bbb;padding:10px;display:flex;justify-content:flex-end;gap:8px}.dialog-actions button{min-width:64px;padding:7px 12px}@media(max-width:800px){.legacy-page{padding:10px}.legacy-actions{flex-wrap:wrap}.legacy-table{min-width:100%;font-size:14px}.zone-dialog{width:calc(100vw - 20px)}}.advanced-color-picker{position:relative;min-width:165px}.advanced-color-input-row{display:grid;grid-template-columns:1fr 34px;align-items:stretch;gap:4px}.advanced-color-hex-input{height:27px!important;padding:3px 6px;font-family:Consolas,Courier New,monospace;text-transform:uppercase}.advanced-color-preview-button{width:34px;height:27px;padding:2px;border:1px solid #8d8d8d;background:#fff;cursor:pointer}.checkerboard{position:relative;display:block;overflow:hidden;background-color:#fff;background-image:linear-gradient(45deg,#cfcfcf 25%,transparent 25%),linear-gradient(-45deg,#cfcfcf 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#cfcfcf 75%),linear-gradient(-45deg,transparent 75%,#cfcfcf 75%);background-size:10px 10px;background-position:0 0,0 5px,5px -5px,-5px 0}.checkerboard>span{position:absolute;top:0;right:0;bottom:0;left:0}.advanced-color-preview-button .checkerboard{width:100%;height:100%}.advanced-color-popover{position:absolute;z-index:5000;top:calc(100% + 3px);left:0;width:235px;padding:7px;background:#f7f7f7;border:1px solid #8d8d8d;box-shadow:0 5px 18px #00000059}.advanced-color-main{display:grid;grid-template-columns:1fr 20px;gap:5px;height:138px}.advanced-color-saturation{position:relative;cursor:crosshair;overflow:hidden}.advanced-color-saturation-white,.advanced-color-saturation-black{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.advanced-color-saturation-white{background:linear-gradient(to right,#fff,#fff0)}.advanced-color-saturation-black{background:linear-gradient(to top,#000,#0000)}.advanced-color-saturation-handle{position:absolute;width:10px;height:10px;transform:translate(-50%,-50%);border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #000,0 1px 3px #000000b3;pointer-events:none}.advanced-color-hue{position:relative;cursor:ns-resize;background:linear-gradient(to bottom,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border:1px solid #444}.advanced-color-hue-handle{position:absolute;left:-3px;right:-3px;height:4px;transform:translateY(-50%);border:1px solid #000;background:#fff;box-shadow:0 0 0 1px #fff;pointer-events:none}.advanced-color-alpha-row{display:grid;grid-template-columns:1fr 38px;align-items:center;gap:6px;margin-top:7px}.advanced-color-alpha-checker{height:15px;border:1px solid #777;overflow:visible}.advanced-color-alpha{position:absolute;top:0;right:0;bottom:0;left:0;cursor:ew-resize}.advanced-color-alpha-handle{position:absolute;top:-3px;bottom:-3px;width:5px;transform:translate(-50%);border:1px solid #000;background:#fff;pointer-events:none}.advanced-color-alpha-value{font-size:12px;text-align:right}.advanced-color-footer{display:grid;grid-template-columns:30px 1fr;gap:6px;align-items:center;margin-top:7px}.advanced-color-large-preview{width:30px;height:27px;border:1px solid #777}.advanced-color-footer input{height:27px!important;font-family:Consolas,Courier New,monospace;text-transform:uppercase}.zone-dialog{width:470px}.dialog-row,.dual-field{align-items:start}.dialog-row>span{line-height:1.2;padding-top:4px}.dialog-row{grid-template-columns:135px 1fr 28px}.zone-dialog .advanced-color-picker{min-width:220px}.zone-dialog .advanced-color-popover{left:0;top:calc(100% + 5px)}.advanced-color-popover{border-radius:2px}.advanced-color-main{grid-template-columns:1fr 24px;gap:6px;height:168px}.advanced-color-saturation-handle{width:12px;height:12px}.advanced-color-hue-handle{left:-4px;right:-4px;height:6px}.advanced-color-alpha-row{grid-template-columns:1fr 42px}.advanced-color-footer{grid-template-columns:34px 1fr}.advanced-color-large-preview{width:34px;height:27px}.dialog-secondary-actions{padding:0 10px 12px}.dialog-secondary-actions button{padding:7px 12px;min-width:170px}@media(max-width:800px){.zone-dialog{width:calc(100vw - 16px)}.dialog-row{grid-template-columns:120px 1fr 24px}}
