@import url('https://fonts.googleapis.com/css2?family=Alex+Brush&family=Allura&family=Cormorant+Garamond:wght@400;500;600&family=Great+Vibes&family=Lato:wght@400;700&family=Libre+Baskerville:wght@400;700&family=Montserrat:wght@400;500;600;700&family=Open+Sans:wght@400;600&family=Playfair+Display:wght@400;500;600&display=swap');
:root{--rose:#c87c87;--cream:#fffdfa;--ink:#4c3b3f}
*{box-sizing:border-box}
body{margin:0;font-family:Montserrat,Arial,sans-serif;background:#fbf7f5;color:var(--ink)}
aside{position:fixed;inset:0 auto 0 0;width:250px;padding:24px;background:#fff;border-right:1px solid #eadde0}
.brand{font-size:24px;font-weight:700;color:#9f5963}.brand span{display:block;font-size:11px;color:#8b7b7e;margin-top:5px}
nav{display:grid;gap:7px;margin-top:28px}
nav a{padding:11px 13px;border-radius:10px;text-decoration:none;color:#5f4c50}
nav a:hover{background:#f8ecef;color:#9f5963}
main{margin-left:250px;padding:26px;min-height:100vh}
main>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.card,.login-card{background:#fff;border:1px solid #eadde0;border-radius:20px;padding:20px;box-shadow:0 8px 24px rgba(70,40,45,.04)}
.login-body{display:grid;place-items:center;min-height:100vh}
.login-card{width:min(440px,92vw)}
.stack{display:grid;gap:14px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.wide{grid-column:1/-1}
label{display:grid;gap:6px;font-size:13px;font-weight:600}
input,select,textarea,button{font:inherit}
input,select,textarea{width:100%;padding:11px;border:1px solid #dbcdd0;border-radius:10px;background:#fff}
textarea{min-height:90px}
button,.button{border:0;border-radius:10px;background:#c87c87;color:#fff;padding:11px 15px;font-weight:700;text-decoration:none;cursor:pointer;display:inline-block}
.button.ghost{background:#f6ecee;color:#8d4d58}
.notice{padding:12px 14px;background:#fff2d8;border-radius:10px;margin-bottom:14px}
.hero{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:28px;border-radius:24px;background:linear-gradient(135deg,#fff,#f7e8eb);border:1px solid #ead6da}
.hero h2{font-size:34px;max-width:700px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}
.kpis article{background:#fff;border:1px solid #eadde0;border-radius:18px;padding:18px}
.kpis span{display:block;color:#8b777b}
.kpis strong{font-size:30px}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:11px;border-bottom:1px solid #eee2e4}
.actions{display:flex;justify-content:flex-end;margin-bottom:12px}
.designer{display:grid;grid-template-columns:330px 1fr;gap:20px}
.controls{background:#fff;border:1px solid #eadde0;border-radius:18px;padding:18px;max-height:calc(100vh - 100px);overflow:auto}
.preview{display:grid;place-items:center;min-height:650px;background:#eee8e8;border-radius:18px}
.record-list{display:grid;gap:6px;max-height:280px;overflow:auto;margin-top:10px}
.record-list label{display:flex;gap:8px;font-weight:400}
.record-list input{width:auto}

.card-art{background:#fff;position:relative;border:1.4px solid var(--primary);color:var(--dark);overflow:hidden}
.card-art.landscape{width:90mm;height:60mm}
.card-art.portrait{width:60mm;height:90mm}
.preview-card{transform:scale(1.25);box-shadow:0 18px 45px rgba(50,30,35,.18)}
.inner{position:absolute;inset:4mm;border:1px solid color-mix(in srgb,var(--primary) 65%,white);padding:4mm 4.2mm;display:grid;gap:1.6mm;align-items:center}
.card-title,.card-message,.card-names,.card-date,.card-helper{min-width:0;word-break:break-word}
.card-title{font-family:var(--title-font);line-height:1;color:var(--dark)}
.card-message{font-family:var(--message-font);align-self:center}
.card-names{font-family:var(--names-font);line-height:1.08}
.card-date{font-family:var(--date-font);line-height:1.15}
.card-helper{font-family:var(--helper-font);line-height:1.15;text-align:center;justify-self:center}
.qr-code{justify-self:center;align-self:end;background:#fff;padding:1.1mm}
.qr-code img,.qr-code canvas{display:block;width:14mm!important;height:14mm!important}

.landscape .inner{grid-template-areas:'title title' 'message qr' 'names qr' 'date helper';grid-template-columns:minmax(0,1fr) 16.6mm;grid-template-rows:auto 1fr auto auto;text-align:center}
.landscape .card-title{grid-area:title;font-size:23pt}
.landscape .card-message{grid-area:message;font-size:8.5pt;line-height:1.35}
.landscape .card-names{grid-area:names;font-size:14pt}
.landscape .card-date{grid-area:date;font-size:7.6pt;align-self:end}
.landscape .card-helper{grid-area:helper;font-size:5.7pt;max-width:16mm;align-self:start}
.landscape .qr-code{grid-area:qr}

.landscape.qr-left .inner{grid-template-areas:'title title' 'qr message' 'qr names' 'helper date';grid-template-columns:16.6mm minmax(0,1fr)}

.landscape.qr-center .inner,
.landscape.tpl-center-qr .inner{grid-template-areas:'title title title' 'message message message' 'names qr date' '. helper .';grid-template-columns:minmax(0,1fr) 16.6mm minmax(0,1fr);grid-template-rows:auto 1fr auto auto;text-align:center}
.landscape.qr-center .card-message,
.landscape.tpl-center-qr .card-message{max-width:100%;justify-self:center}
.landscape.qr-center .card-date,
.landscape.tpl-center-qr .card-date{justify-self:end;text-align:right}
.landscape.qr-center .card-names,
.landscape.tpl-center-qr .card-names{justify-self:start;text-align:left}

.landscape.qr-bottom-right .inner{grid-template-areas:'title title' 'message message' 'names qr' 'date helper';grid-template-columns:minmax(0,1fr) 16.6mm;grid-template-rows:auto 1fr auto auto;text-align:left}
.landscape.qr-bottom-left .inner{grid-template-areas:'title title' 'message message' 'qr names' 'helper date';grid-template-columns:16.6mm minmax(0,1fr);grid-template-rows:auto 1fr auto auto;text-align:left}
.landscape.qr-bottom-right .card-title,.landscape.qr-bottom-left .card-title,
.landscape.qr-bottom-right .card-message,.landscape.qr-bottom-left .card-message,
.landscape.qr-bottom-right .card-names,.landscape.qr-bottom-left .card-names{justify-self:start;text-align:left}

.landscape.qr-bottom-center .inner{grid-template-areas:'title title title' 'message message message' 'names names date' '. qr .' '. helper .';grid-template-columns:minmax(0,1fr) 16.6mm minmax(0,1fr);grid-template-rows:auto 1fr auto auto auto;text-align:center}
.landscape.qr-bottom-center .card-date{justify-self:end;text-align:right}
.landscape.qr-bottom-center .card-names{justify-self:start;text-align:left}

.landscape.qr-top-center .inner{grid-template-areas:'. qr .' '. helper .' 'title title title' 'message message message' 'names names date';grid-template-columns:minmax(0,1fr) 16.6mm minmax(0,1fr);grid-template-rows:auto auto auto 1fr auto;text-align:center}
.landscape.qr-top-center .card-date{justify-self:end;text-align:right}
.landscape.qr-top-center .card-names{justify-self:start;text-align:left}
.landscape.qr-top-center .qr-code{align-self:start}

.portrait .inner{grid-template-areas:'title' 'message' 'qr' 'helper' 'names' 'date';grid-template-columns:1fr;grid-template-rows:auto 1fr auto auto auto auto;text-align:center}
.portrait .card-title{grid-area:title;font-size:27pt}
.portrait .card-message{grid-area:message;font-size:9.5pt;line-height:1.4}
.portrait .card-names{grid-area:names;font-size:16pt}
.portrait .card-date{grid-area:date;font-size:8pt}
.portrait .card-helper{grid-area:helper;font-size:6pt;max-width:22mm}
.portrait .qr-code{grid-area:qr}

.tpl-message-focus .card-message{font-size:10.3pt;max-width:84%;justify-self:center}
.landscape.tpl-message-focus .card-message{font-size:9.3pt;max-width:94%}
.tpl-names-focus .card-names{font-size:18pt}
.landscape.tpl-names-focus .card-names{font-size:16pt}
.tpl-minimal-frame .inner{border:none}
.landscape.tpl-editorial-right .inner{grid-template-areas:'title title' 'message qr' 'names qr' 'date helper';grid-template-columns:minmax(0,1fr) 16.6mm;text-align:left}
.landscape.tpl-editorial-left .inner{grid-template-areas:'title title' 'qr message' 'qr names' 'helper date';grid-template-columns:16.6mm minmax(0,1fr);text-align:left}
.landscape.tpl-editorial-right .card-title,.landscape.tpl-editorial-left .card-title,
.landscape.tpl-editorial-right .card-message,.landscape.tpl-editorial-left .card-message,
.landscape.tpl-editorial-right .card-names,.landscape.tpl-editorial-left .card-names{justify-self:start;text-align:left}

.print-page{background:#ddd;margin:0}
.print-button{position:fixed;right:20px;top:20px;z-index:20}
.a4-sheet{width:210mm;height:297mm;background:#fff;margin:10mm auto;display:grid;align-content:center;justify-content:center;gap:3mm;page-break-after:always;overflow:hidden}
.a4-sheets.landscape .a4-sheet{grid-template-columns:repeat(2,90mm);grid-template-rows:repeat(4,60mm)}
.a4-sheets.portrait .a4-sheet{grid-template-columns:repeat(3,60mm);grid-template-rows:repeat(3,90mm)}
@media print{.print-button{display:none}.print-page{background:#fff}.a4-sheet{margin:0;box-shadow:none}@page{size:A4;margin:0}}
@media(max-width:900px){aside{position:static;width:auto}main{margin:0}.designer{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(2,1fr)}.preview-card{transform:scale(.8)}}