.layout-visual-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}.visual-editor-columns{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:20px;align-items:start}.visual-stage-panel{min-width:0}.layout-preview{container-type:inline-size;position:relative;aspect-ratio:16/9;width:100%;background:#f4f4e9;border:1px solid #d9e1d3;border-radius:16px;padding:1.2%;box-shadow:0 9px 30px #30482b0d;display:grid;grid-template-rows:8% 1fr 9%;gap:2.2%;overflow:hidden;user-select:none}.preview-top{display:flex;justify-content:space-between;align-items:center;font-size:clamp(7px,1.5cqw,17px);gap:8px;color:#345a45;white-space:nowrap;overflow:hidden}.preview-top>span:first-child{display:flex;gap:5px;align-items:center;max-width:43%;overflow:hidden}.preview-top img{width:3.4cqw;height:3.4cqw}.preview-top strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-top>strong{font-size:2.7cqw}.visual-layout-grid{position:relative;min-width:0;min-height:0;border:1px dashed #cbd7c1;isolation:isolate}.show-grid .visual-layout-grid{background-image:linear-gradient(to right,#97ac9140 1px,transparent 1px),linear-gradient(to bottom,#97ac9140 1px,transparent 1px);background-size:calc(100% / 12) calc(100% / 8)}.visual-widget{position:absolute;padding:.42%;cursor:grab;touch-action:none;outline:none;z-index:1}.preview-widget-card{width:100%;height:100%;overflow:hidden;border:1px solid #dce5d8;border-radius:1.3cqw;background:#fffef8;padding:1.4cqw;box-shadow:0 1px 3px #36542e0c}.visual-widget:hover .preview-widget-card{box-shadow:inset 0 0 0 2px #7da68d}.visual-widget.is-selected{z-index:3}.visual-widget.is-selected .preview-widget-card{box-shadow:inset 0 0 0 2px #2d7756;background-color:#f5fbf5}.visual-widget:focus-visible .preview-widget-card{box-shadow:inset 0 0 0 3px #397fdb}.visual-widget.is-dragging{cursor:grabbing;opacity:.6}.preview-widget-title{display:flex;align-items:center;justify-content:space-between;gap:4px;font-size:clamp(7px,1.6cqw,18px);line-height:1.35;margin-bottom:1cqw;white-space:nowrap;overflow:hidden;color:#274d36}.preview-widget-title strong{font-weight:600;overflow:hidden;text-overflow:ellipsis}.preview-widget-content{font-size:clamp(6px,1.35cqw,16px);color:#4b614c;line-height:1.55;overflow:hidden;max-height:calc(100% - 2.5cqw)}.preview-widget-content p{margin:0 0 .7cqw}.preview-line{display:flex;align-items:center;gap:1cqw;border-bottom:1px solid #e5ebdf;padding-bottom:.5cqw}.preview-line>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.preview-line>span:first-child{flex-shrink:0}.preview-line>strong{font-weight:500}.preview-main{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-sub{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;color:#697865}.preview-clockface{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#315c40;font-size:1.5cqw}.preview-clockface strong{font-size:7cqw;font-variant-numeric:tabular-nums;font-weight:500;line-height:1.15}.preview-clockface small{font-size:1.3cqw;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.preview-countdown .preview-widget-content{height:100%}.preview-countdown>.preview-widget-card{background:#edf5df url('/assets/morning-campus-v1.png') center/cover}.preview-duty>.preview-widget-card{background-color:#fff6e8}.preview-notices>.preview-widget-card{background-color:#fff9de}.preview-schedule>.preview-widget-card{background-color:#f6faef}.preview-clock .preview-main,.preview-timer .preview-main{font-size:4cqw}.widget-position-label{position:absolute;left:50%;bottom:0;transform:translate(-50%,20%);font-size:11px;background:#2e7756;color:#fff;border-radius:4px;padding:0 5px;line-height:18px;white-space:nowrap;pointer-events:none;display:none}.is-selected .widget-position-label{display:block}.visual-resize-handle{position:absolute;right:0;bottom:0;width:27px;height:27px;min-height:27px;border:2px solid #fff;border-radius:7px;background:#2e7756;color:#fff;padding:0;display:none;align-items:center;justify-content:center;font-size:21px;line-height:1;cursor:nwse-resize;touch-action:none;z-index:4}.is-selected .visual-resize-handle{display:flex}.visual-resize-handle:hover{background:#245e43}.preview-dock{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));align-items:center;gap:.3cqw;background:#fffef8;border:1px solid #dce5d8;border-radius:1.1cqw;padding:.5cqw;font-size:clamp(5px,1.25cqw,14px);color:#4e6854;text-align:center}.preview-dock span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layout-ghost{position:absolute;z-index:5;border:3px solid #2f9a68;border-radius:8px;background:#a9e5c466;display:flex;align-items:center;justify-content:center;color:#1b5e3d;font-size:clamp(12px,2cqw,22px);pointer-events:none;box-shadow:0 2px 10px #245d3a20}.layout-ghost.invalid{border-color:#c4434d;background:#f29da966;color:#8c2030}.layout-feedback{margin-top:12px;min-height:46px;padding:10px 14px;border:1px solid #d5e6d8;border-radius:10px;background:#eff7ef;color:#315c3e;font-size:14px}.layout-feedback.invalid{border-color:#e9b8bc;background:#fff0f0;color:#9a2530}.visual-inspector{margin-top:20px;min-height:160px}.visual-inspector>.row h2{margin:0;font-size:19px}.layout-inspector-empty{text-align:center;padding:12px;color:#45624e}.layout-inspector-empty>span{font-size:30px}.layout-control-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:18px 0}.layout-control-columns h3{font-size:15px;margin-bottom:8px}.layout-direction-pad{display:grid;grid-template-columns:repeat(3,48px);grid-template-rows:repeat(3,44px);gap:5px;justify-content:center}.layout-direction-pad button{min-height:44px;padding:4px;font-size:22px}.layout-direction-pad button:nth-child(1){grid-column:2;grid-row:1}.layout-direction-pad button:nth-child(2){grid-column:1;grid-row:2}.layout-direction-pad span{grid-column:2;grid-row:2;display:grid;place-items:center;font-size:12px;color:#84917d}.layout-direction-pad button:nth-child(4){grid-column:3;grid-row:2}.layout-direction-pad button:nth-child(5){grid-column:2;grid-row:3}.layout-size-buttons{display:grid;grid-template-columns:1fr 42px 1fr;gap:8px;align-items:center;text-align:center}.layout-size-buttons button{min-height:48px;padding:7px;white-space:nowrap}.layout-size-buttons output{color:#447052;font-size:14px}.layout-exact{margin:12px 0;border-top:1px solid #e1e8df;padding-top:12px}.layout-exact summary{cursor:pointer;color:#58705b;padding:4px 0}.layout-exact form{display:flex;flex-direction:column;gap:12px;margin-top:12px}.visual-library{padding:20px}.visual-library h2{margin-bottom:4px}.visual-library>.hint{margin-bottom:16px}.layout-library-item{display:flex;align-items:center;gap:4px;border-bottom:1px solid #e5ebdf;padding:7px 0}.layout-library-select{display:flex;align-items:center;gap:8px;min-width:0;flex:1;text-align:left;padding:6px 4px;border:0;background:transparent}.library-component-icon{display:grid;place-items:center;min-width:30px;height:30px;border-radius:8px;background:#f0f4e9;font-size:20px;color:#6c8261}.shown .library-component-icon{background:#e3f1e4;color:#2e7452}.layout-library-select strong{font-size:13px;display:block;font-weight:500;white-space:nowrap}.layout-library-select small{display:block;font-size:11px;color:#87917f}.layout-visibility{padding:6px 8px;font-size:12px;white-space:nowrap;border:0;color:#3c6c4a;min-height:40px}.shown .layout-visibility{color:#798675}.visual-layout-save{margin-top:20px}.visual-layout-save>button{font-size:14px}
@media(max-width:1100px){.visual-editor-columns{grid-template-columns:1fr}.visual-library #visual-component-library{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.layout-control-columns{grid-template-columns:1fr 1fr}.layout-direction-pad{justify-content:start}.visual-library{order:2}}
@media(max-width:720px){.layout-preview{border-radius:10px;padding:1.4%;aspect-ratio:16/9}.preview-top{font-size:7px}.preview-top>span:nth-child(2){font-size:6px}.visual-widget{padding:.5%}.preview-widget-card{padding:1.4cqw;border-radius:1.5cqw}.preview-widget-title{font-size:7px}.preview-widget-content{font-size:6px}.preview-widget-title>span{display:none}.visual-resize-handle{width:32px;height:32px;min-height:32px;border-radius:8px;font-size:22px;transform:translate(15%,15%)}.widget-position-label{font-size:10px;line-height:16px;transform:translate(-50%,0)}.preview-dock{font-size:5px}.layout-visual-toolbar .row{width:100%;justify-content:space-between}.visual-inspector{padding:16px}.layout-control-columns{gap:12px}.layout-direction-pad{grid-template-columns:repeat(3,40px);grid-template-rows:repeat(3,42px);gap:4px}.layout-direction-pad button{min-height:42px}.layout-size-buttons{grid-template-columns:1fr 32px 1fr;gap:4px}.layout-size-buttons button{padding:6px 3px;font-size:13px;min-height:46px}.layout-size-buttons output{font-size:12px}.layout-control-columns h3{font-size:14px}.visual-library #visual-component-library{grid-template-columns:1fr}.visual-library{padding:16px}.layout-library-select strong{font-size:15px}.layout-library-select small{font-size:12px}.layout-visibility{font-size:14px;padding:8px 12px}.layout-feedback{font-size:13px;padding:10px}.visual-layout-save>button{font-size:13px;flex:1}.visual-layout-save #save-visual-layout{flex-basis:100%}.visual-library #visual-component-library{max-height:440px;overflow:auto}.preview-clockface strong{font-size:7cqw}}

.preview-clockface strong.is-words{font-size:3cqw}.preview-countdown>.preview-widget-card>.preview-widget-title{display:none}.preview-countdown .preview-widget-content{height:100%;max-height:100%}