/* Shared pixel-grid inspection control. */
.spacing-toggle{position:fixed;top:auto;left:auto;right:20px;bottom:20px;z-index:10002;padding:8px 12px;border:1px solid #b8a6d0;border-radius:10px;background:#28262d;color:#ece5fa;font:12px Arial;cursor:pointer;box-shadow:0 4px 20px #0005}
.page-px-grid{position:fixed;inset:0;pointer-events:none;z-index:9998;background-image:linear-gradient(#b8a6d01a 1px,transparent 1px),linear-gradient(90deg,#b8a6d01a 1px,transparent 1px);background-size:4px 4px}
.page-px-overlay{position:absolute;inset:0;pointer-events:none;z-index:9999}
.page-px-grid[hidden],.page-px-overlay[hidden]{display:none}
.page-px-active .px-measured{outline:1px dashed #b8a6d0;outline-offset:0}
.page-px-overlay .spacing-px-label{position:absolute;padding:2px 5px;border-radius:4px;background:#ebf2d5;color:#28262d;font:10px/12px Arial;white-space:nowrap;opacity:.95}
@media print{.spacing-toggle,.page-px-grid,.page-px-overlay{display:none}.page-px-active .px-measured{outline:none}}

.font-size-toggle{position:fixed;right:20px;bottom:62px;z-index:10002;padding:8px 12px;border:1px solid #b8a6d0;border-radius:10px;background:#28262d;color:#ece5fa;font:12px Arial;cursor:pointer;box-shadow:0 4px 20px #0005}
.font-size-toggle:focus-visible{outline:2px solid #ece5fa;outline-offset:3px}
.font-size-overlay{position:fixed;inset:0;pointer-events:none;z-index:10001;overflow:hidden}
.font-size-overlay[hidden]{display:none}
.font-size-label{position:absolute;padding:1px 4px;border-radius:4px;background:#eee5fc;color:#252422;font:10px/12px Arial;white-space:nowrap;box-shadow:0 1px 4px #0004}
@media print{.font-size-toggle,.font-size-overlay{display:none}}

.live-type-toggle{position:fixed;right:20px;bottom:104px;z-index:10002;padding:8px 12px;border:1px solid #b8a6d0;border-radius:10px;background:#28262d;color:#ece5fa;font:12px Arial;cursor:pointer;box-shadow:0 4px 20px #0005}
.live-type-panel{position:fixed;bottom:150px;right:20px;z-index:10003;display:flex;flex-wrap:wrap;align-items:center;gap:10px;width:min(420px,calc(100vw - 40px));box-sizing:border-box;padding:16px;border:1px solid #ffffff30;border-radius:18px;background:#28262df5;color:#ece5fa;font:12px/1.4 Arial;box-shadow:0 10px 40px #0005}
.live-type-panel[hidden]{display:none}.live-type-panel label{display:flex;align-items:center;gap:6px}.live-type-panel input{width:62px;padding:6px;border:1px solid #ffffff40;border-radius:8px;background:#ffffff10;color:inherit;font:inherit}.live-type-panel button{padding:7px 10px;border:1px solid #ffffff30;border-radius:9px;background:#ffffff10;color:inherit;font:inherit;cursor:pointer}.live-type-panel [data-save]{background:#eee5fc;color:#252422}.live-type-panel [role=status]{flex-basis:100%;opacity:.75}.live-type-panel :focus-visible,.live-type-toggle:focus-visible{outline:2px solid #b8a6d0;outline-offset:3px}
@media print{.live-type-toggle,.live-type-panel{display:none}}

.live-type-editing main,.live-type-editing main *{user-select:text!important;-webkit-user-select:text!important;cursor:text!important}
.live-type-editing .au-story-card-art img{opacity:0!important}
.live-type-editing .au-story-card-text{opacity:1!important;visibility:visible!important}
.page-px-dimension{position:absolute;box-sizing:border-box;color:#fa7f95;border-color:currentColor;pointer-events:none}
.page-px-dimension.is-x{height:1px;border-top:1px solid}
.page-px-dimension.is-y{width:1px;border-left:1px solid}
.page-px-dimension::before,.page-px-dimension::after{content:'';position:absolute;background:currentColor}
.page-px-dimension.is-x::before,.page-px-dimension.is-x::after{height:7px;width:1px;top:-4px}
.page-px-dimension.is-x::before{left:0}.page-px-dimension.is-x::after{right:0}
.page-px-dimension.is-y::before,.page-px-dimension.is-y::after{width:7px;height:1px;left:-4px}
.page-px-dimension.is-y::before{top:0}.page-px-dimension.is-y::after{bottom:0}
.page-px-dimension span{position:absolute;background:#28262df2;color:#ffd4de;border-radius:3px;padding:1px 3px;font:10px/12px Arial;white-space:nowrap;left:50%;top:50%;transform:translate(-50%,-50%)}

.live-type-editing main [contenteditable="true"]{outline:1px dashed #b8a6d060;outline-offset:4px;min-width:1px}
.live-type-editing main [contenteditable="true"]:focus{outline:2px solid #b8a6d0}

/* Pink målvisning inspireret af layoutspecifikationer. */
.page-px-grid{background-image:linear-gradient(#ed23880a 1px,transparent 1px),linear-gradient(90deg,#ed23880a 1px,transparent 1px)}
.page-px-active .px-measured{outline-color:#ed238870}
.page-px-dimension{color:#ed2388}
.page-px-dimension span{background:var(--paper,#25252d);color:#ed2388;font:10px/12px monospace;padding:2px 4px}
.page-px-dimension.is-x span{top:-9px}
.page-px-dimension.is-y span{left:-16px}
.page-px-dimension::before,.page-px-dimension::after{background:transparent;border:solid currentColor;border-width:0 1px 1px 0;width:6px!important;height:6px!important}
.page-px-dimension.is-x::before{top:-4px;left:0;transform:rotate(135deg)}
.page-px-dimension.is-x::after{top:-4px;right:0;transform:rotate(-45deg)}
.page-px-dimension.is-y::before{left:-4px;top:0;transform:rotate(225deg)}
.page-px-dimension.is-y::after{left:-4px;bottom:0;transform:rotate(45deg)}
.px-spec-area{position:absolute;box-sizing:border-box;pointer-events:none;display:flex;align-items:center;justify-content:center;color:#fff}
.px-space{background:#df3b9299}
.px-spec-area>span{position:relative;z-index:1;white-space:nowrap;background:#d52c88;color:white;padding:1px 3px;font:10px/12px monospace}
.px-object{border:1px dashed #ed238890;background:#ed238808}
.px-image{background:linear-gradient(to top right,transparent calc(50% - .5px),#ed238880 50%,transparent calc(50% + .5px)),linear-gradient(to bottom right,transparent calc(50% - .5px),#ed238880 50%,transparent calc(50% + .5px)),#ed238812}

.page-px-overlay .px-image{border:1px solid #ed2388b3;background:linear-gradient(to top right,transparent calc(50% - .5px),#ed238899 50%,transparent calc(50% + .5px)),linear-gradient(to bottom right,transparent calc(50% - .5px),#ed238899 50%,transparent calc(50% + .5px)),#ed23882e}
.page-px-overlay .px-image>span{background:#d52c88;color:#fff;font:600 11px/14px monospace;padding:2px 5px}
