*{box-sizing:border-box}
:root{--pk:#DE1C59;--ink:#221F1C;--cream:#F7F4ED}
.icon{width:16px;height:16px;flex:none;vertical-align:-3px;display:inline-block}
.icon.lg{width:20px;height:20px}
.icon.sm{width:13px;height:13px;vertical-align:-2px}
body{margin:0;font-family:Poppins,system-ui,sans-serif;background:var(--cream);color:var(--ink);font-size:14px}
a{color:var(--pk)}
h1,h2,h3{margin:.2em 0 .5em}
.grow{flex:1;min-width:0}.mt{margin-top:12px}.mt-s{margin-top:6px}.w100{width:100%}
.row{display:flex;align-items:center}.col{display:flex;flex-direction:column}
.gap{gap:10px}.gap-s{gap:6px}.center{align-items:center}.center-c{text-align:center}
.wrap-s{flex-wrap:wrap}
.muted{color:#8a837b}.small{font-size:12px}
input,select,textarea{font:inherit;padding:9px 12px;border:1px solid #ddd6cc;border-radius:10px;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid #de1c5940;border-color:var(--pk)}
textarea{width:100%;resize:vertical}
label{display:block;font-weight:500;margin-bottom:8px}
label input,label select{margin-top:4px;display:block}
label.row input,label.row select{display:inline-block;margin:0}
.btn{font:inherit;font-weight:600;padding:9px 15px;border:0;border-radius:12px;background:#eee7dc;color:var(--ink);cursor:pointer;text-decoration:none;display:inline-block;text-align:center}
.btn[hidden]{display:none}
.btn:hover{filter:brightness(.96)}
.btn.primary{background:var(--pk);color:#fff}
.btn.ghost{background:transparent;border:1px solid #ddd6cc}
.btn.danger{background:#c0392b;color:#fff}
.btn.danger.ghost{background:transparent;color:#c0392b;border:1px solid #e7b7b1}
.btn.sm{padding:4px 9px;border-radius:9px;font-size:12px}
.btn.icon-btn{padding:9px 11px;display:inline-flex;align-items:center;justify-content:center}
.btn.icon-btn.sm{padding:5px 8px}
.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:12px;background:#fffdf9;padding:10px 18px;box-shadow:0 2px 10px #0000000d}
.topbar .brand{height:24px}
.app-name{font-weight:700;color:var(--pk)}
.wrap{max-width:1060px;margin:0 auto;padding:20px 16px 60px}
.card{background:#fff;border-radius:16px;padding:16px 18px;box-shadow:0 4px 16px #00000008;margin-bottom:14px}
.sec-title{margin:26px 4px 12px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.proj h3{margin:8px 0 2px;overflow-wrap:anywhere}
.proj .muted.small{overflow-wrap:anywhere}
.bx-h b{font-size:15px;overflow-wrap:anywhere}
.chip{font-size:12px;font-weight:600;padding:4px 11px;border-radius:999px;background:#fbdde8;color:var(--pk);display:inline-flex;align-items:center;gap:4px}
.chip.links{background:#e2efe8;color:#1d7a53}
.dot{width:10px;height:10px;border-radius:50%;background:#cfc8bd;display:inline-block}
.dot.on{background:#2ecc71}
.tbl{width:100%;border-collapse:collapse;margin-top:14px}
.tbl th,.tbl td{text-align:left;padding:8px 6px;border-bottom:1px solid #eee7dc;overflow-wrap:anywhere}
.tbl th{white-space:nowrap}
.alert{background:#fdeaea;color:#b23a2f;padding:10px 12px;border-radius:10px;margin-bottom:12px}
.alert.info{background:#e6f3ec;color:#1d7a53}
.alert.warn{background:#fdf3e0;color:#a06a0a;font-weight:500}
.as-foot{text-align:center;padding:26px;color:#8a837b}
/* login */
.login-bg{min-height:100vh;display:flex;align-items:center;justify-content:center}
.login-card{background:#fff;border-radius:22px;padding:30px 30px 22px;width:min(380px,92vw);box-shadow:0 14px 44px #0000001a;text-align:center}
.login-logo{height:130px;margin-bottom:6px}
.login-card h1{font-size:22px}.login-card h1 span{color:var(--pk);font-weight:400}
.login-card form{text-align:left;margin-top:14px}
.login-card input{width:100%}
.login-foot{margin-top:16px;font-size:12px;color:#8a837b}
/* password con occhio mostra/nascondi */
.pw-wrap{position:relative;display:flex}
.pw-wrap input{width:100%;padding-right:40px}
.pw-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:0;padding:5px;cursor:pointer;color:#8a837b;display:flex;border-radius:7px}
.pw-eye:hover{background:#f0e9dd;color:var(--ink)}
.login-remember{margin:2px 0 14px;font-weight:500;font-size:13.5px}
.login-remember input{width:16px;height:16px;accent-color:var(--pk)}
/* codice OTP */
.login-otp-hint{font-size:13px;color:#665f56;margin:0 0 14px;line-height:1.5}
.otp-input{letter-spacing:.5em;font-size:20px;font-weight:700;text-align:center}
.login-otp-resend{margin-top:8px}
.login-otp-resend .btn{padding:8px 12px;font-size:13px}
/* tabs + editor */
.tabs{display:flex;gap:4px;background:#fffdf9;padding:0 18px;box-shadow:0 2px 10px #0000000a;position:sticky;top:49px;z-index:35;overflow-x:auto}
.tabs button{font:inherit;font-weight:600;background:none;border:0;border-bottom:3px solid transparent;padding:11px 15px;cursor:pointer;color:#8a837b;white-space:nowrap}
.tabs button.on{color:var(--pk);border-color:var(--pk)}
.ed{display:flex;gap:10px;max-width:1330px;margin:0 auto}
.ed-main{flex:1;min-width:0;padding:18px 16px 80px;max-width:880px}
.ed-side{width:410px;padding:18px 12px;position:sticky;top:100px;align-self:flex-start}
.phone{width:365px;height:min(690px,calc(100vh - 160px));margin:0 auto;border:9px solid var(--ink);border-radius:34px;overflow:hidden;background:#fff;box-shadow:0 18px 50px #00000024}
.phone iframe{width:100%;height:100%;border:0}
@media(max-width:1120px){.ed-side{display:none}}
.tabpane{display:none}.tabpane.on{display:block}
.pubtoggle{display:flex;align-items:center;gap:6px;font-weight:600;margin:0}
.pubtoggle input{width:18px;height:18px;accent-color:#2ecc71}
.limit-field{font-size:12px;font-weight:600;color:#665f56;margin:0}
.limit-field input{margin-top:3px;width:110px}
.sep{border:0;border-top:1px solid #eee7dc;margin:16px 0}
.storage-bar{width:100%;height:12px;border-radius:999px;background:#f0e9dd;overflow:hidden}
.storage-bar-fill{height:100%;background:#2ecc71;border-radius:999px;transition:width .3s;width:0}
.storage-bar-fill.warn{background:#e0a021}
/* builder */
.bx{background:#fff;border-radius:14px;box-shadow:0 3px 12px #00000008;margin-bottom:12px}
.bx-h{display:flex;align-items:center;gap:8px;padding:11px 13px;border-bottom:1px solid #f2ece1}
.bx-b{padding:10px 13px}
.bx.sub{margin-left:26px;border-left:4px solid #f3cfe0}
.handle{cursor:grab;color:#c9c2b6;user-select:none;padding:0 3px}
.ir{display:flex;align-items:center;gap:8px;background:#faf7f1;border-radius:10px;padding:7px 10px;margin-bottom:6px}
.ir .nm{flex:1;min-width:0;font-weight:500;overflow-wrap:anywhere}
.link-ic{flex:none;width:20px;display:flex;align-items:center;justify-content:center;color:var(--pk)}
.ir .pr{color:#8a837b;white-space:nowrap}
.ir.off .nm,.bx.off .bx-h b{opacity:.4;text-decoration:line-through}
.ib{background:none;border:0;cursor:pointer;font-size:15px;padding:2px 4px;border-radius:7px}
.ib:hover{background:#f0e9dd}
.addb{width:100%;border:2px dashed #ddd3c4;background:none;border-radius:11px;padding:9px;font:inherit;font-weight:600;color:#8a837b;cursor:pointer;margin-top:4px}
.addb:hover{border-color:var(--pk);color:var(--pk)}
/* look */
.logo-prev{height:70px;max-width:160px;object-fit:contain;background:#faf7f1;border-radius:12px;padding:6px;min-width:70px}
.dropzone{border:2px dashed transparent;border-radius:14px;padding:8px;transition:border-color .15s,background-color .15s}
.dropzone.dragover{border-color:var(--pk);background:#fdeaf1}
.dropzone-tx{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dropzone-hint{width:100%;font-size:11.5px;color:#a39c8f}
.clr{display:flex;flex-direction:column;font-size:12px;font-weight:600;gap:4px;margin:0}
.clr input{width:52px;height:34px;padding:2px;border-radius:9px;cursor:pointer}
#lk-tagline input{width:100%;margin-bottom:8px}
.danger-b{border:1px solid #f2c7c1}
/* modal */
.modal-ov{position:fixed;inset:0;background:#1a090fb3;display:flex;align-items:center;justify-content:center;z-index:90;padding:14px}
.modal-ov[hidden]{display:none}
.modal{background:#fff;border-radius:18px;padding:20px 22px;width:min(560px,96vw);max-height:92vh;overflow:auto}
.modal h3{margin-top:0}
.modal input,.modal select,.modal textarea{width:100%;margin-bottom:9px}
.ltabs{display:flex;gap:6px;margin-bottom:10px}
.ltabs button{font:inherit;font-weight:700;font-size:12px;border:1.5px solid #ddd6cc;background:#fff;border-radius:999px;padding:4px 12px;cursor:pointer}
.ltabs button.on{background:var(--pk);border-color:var(--pk);color:#fff}
.lpane{display:none}.lpane.on{display:block}
.tagrow{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 10px}
.tagrow label{display:flex;align-items:center;gap:5px;margin:0;font-weight:500}
.tagrow.icon-pick{gap:8px}
.icpick{position:relative;width:42px;height:42px;border:1.5px solid #e6dfd2;border-radius:11px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#8a837b;gap:0!important}
.icpick input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.icpick .icon{width:19px;height:19px}
.icpick.on{border-color:var(--pk);background:#fdeaf1;color:var(--pk)}
.mrow{display:flex;gap:10px}.mrow>*{flex:1}
#qr-preview{display:inline-block;background:#fff;border-radius:16px;padding:10px;box-shadow:0 4px 16px #00000012}
#qr-preview svg,#qr-preview canvas{display:block;max-width:270px;height:auto}
/* contrasto colori (WCAG) */
.ccheck-box{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.ccheck{display:flex;align-items:center;gap:6px;font-size:12px;padding:6px 10px;border-radius:9px;background:#faf7f1}
.ccheck.ok{color:#1d7a53}
.ccheck.warn{color:#a4184f;background:#fdeaf1}
.ccheck b{font-variant-numeric:tabular-nums}
