@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Manrope:wght@400;500;600&display=swap');
:root{--ink:#0d0e13;--paper:#ffffff;--olive:#a87458;--gold:#e0ccbb}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Manrope',sans-serif;font-size:14px}header{height:106px;margin:0 6%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e5ddd7}.brand{text-decoration:none;color:var(--ink);font-family:'Cormorant Garamond',Georgia,serif;font-size:34px;letter-spacing:7px}.brand span{display:block;font:8px 'Manrope',sans-serif;letter-spacing:3px;text-align:center;margin-top:5px}.tag,.eyebrow,.preview-label{font-size:10px;letter-spacing:2px}.tag{color:var(--olive)}.workspace{max-width:1400px;padding:64px 6%;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:9%}.eyebrow{color:var(--olive)}h1{font:500 clamp(42px,4.5vw,64px)/1.05 'Cormorant Garamond',Georgia,serif;letter-spacing:-1px;margin:20px 0}.intro{line-height:1.8;color:#75706b;max-width:370px;margin-bottom:30px}label{display:block;font-size:12px;font-weight:500;margin:18px 0 8px}input,textarea{display:block;width:100%;border:1px solid #e5ddd7;background:#faf7f4;padding:13px 14px;margin-top:8px;font:13px 'Manrope',sans-serif;border-radius:5px;color:var(--ink)}input:focus,textarea:focus{outline:2px solid #a87458;outline-offset:2px}.hint{font-size:11px;line-height:1.8;color:#827b75}details{margin:24px 0;border-top:1px solid #e5ddd7;border-bottom:1px solid #e5ddd7;padding:18px 0}summary{cursor:pointer;font-size:12px}summary span{float:right;color:var(--olive);font-size:10px}button,a{touch-action:manipulation}button{cursor:pointer;font-family:inherit}.primary{background:var(--ink);color:white;padding:17px 20px;border:0;border-radius:4px;width:100%;text-align:left;font-size:13px}.primary span{float:right}.preview{background:#f2e9e1;border:1px solid #e0ccbb;border-radius:120px 120px 10px 10px;padding:38px 26px 20px;align-self:start}.preview-label{display:flex;justify-content:space-between;align-items:center;margin:15px 14px 24px;font-size:8px;letter-spacing:1px}.preview-label button{border:0;background:transparent;font-size:10px;color:var(--olive);text-decoration:underline}iframe{width:100%;height:680px;border:0;border-radius:80px 80px 5px 5px;background:#fffdf8;box-shadow:0 14px 35px #29312915}.preview-note{text-align:center;color:var(--olive);font:italic 18px 'Cormorant Garamond',Georgia,serif;margin-top:20px}footer{margin:0 6%;border-top:1px solid #e5ddd7;padding:25px 0;font-size:10px;letter-spacing:3px}footer span{float:right;letter-spacing:0;color:#827b75}.actions{display:flex;gap:8px;flex-wrap:wrap}.actions button,.actions a{background:#f0e7df;border:0;border-radius:4px;padding:12px;font-size:11px;color:var(--ink);text-decoration:none}#status{font-size:12px;color:var(--olive)}#result{padding-top:12px}@media(max-width:800px){header{height:88px}.tag{font-size:8px;letter-spacing:1px}.workspace{grid-template-columns:1fr;padding-top:38px;gap:36px}.preview{padding:25px 15px 10px}iframe{height:650px}.brand{font-size:29px}footer span{letter-spacing:0}}

/* Noura brand: charcoal, white, champagne and warm brown. */
header{margin:0;padding:0 6%;background:#0d0e13;border:0;height:106px}.brand img{width:175px;height:55px;object-fit:contain;display:block}.tag{color:#e0ccbb}.eyebrow{color:#a87458}h1{font-family:Manrope,sans-serif;font-size:clamp(36px,4vw,56px);font-weight:500;line-height:1.15;letter-spacing:-2px}h1 em{font-style:normal;color:#a87458}.preview{border-radius:22px;padding-top:28px}iframe{border-radius:16px}.preview-note{font-family:Manrope,sans-serif;font-size:11px;font-style:normal;color:#827b75}.primary{border-radius:30px;background:#0d0e13}.actions button,.actions a{border-radius:22px}.primary:hover{background:#a87458}.preview-label button{color:#80513d}@media(max-width:800px){header{height:90px}.brand img{width:145px;height:44px}h1{letter-spacing:-1.3px}}

#clearcover{border:0;background:#f0e7df;color:#80513d;padding:8px 12px;border-radius:20px;font-size:11px}button:disabled{opacity:.6;cursor:wait}#signin{color:#a87458;display:block;margin-top:15px}#signin[hidden]{display:none}

.header-tools{display:flex;align-items:center;gap:20px}#installapp{border:1px solid #e0ccbb66;color:#e0ccbb;border-radius:24px;padding:10px 16px;background:transparent;font-size:11px}#installapp[hidden]{display:none}#installhelp{border:1px solid #e0ccbb;border-radius:20px;padding:30px;max-width:480px;width:90%;color:#0d0e13;font:13px/1.8 Manrope,sans-serif}#installhelp h2{font:400 28px Manrope,sans-serif}#installhelp::backdrop{background:#0d0e1390;backdrop-filter:blur(4px)}#connection{padding:12px 6%;margin:0;background:#f0e7df;color:#80513d;font-size:12px}html{-webkit-text-size-adjust:100%}input,textarea{font-size:16px}@media(max-width:600px){.header-tools{gap:8px}.header-tools .tag{display:none}#installapp{padding:10px 12px;min-height:44px}.actions a,.actions button{min-height:44px}header{padding-top:env(safe-area-inset-top);height:calc(90px + env(safe-area-inset-top))}.workspace{padding-bottom:calc(35px + env(safe-area-inset-bottom))}}

.thumb-controls{padding:10px 0 18px;display:flex;gap:14px;align-items:flex-start;border-bottom:1px solid #e5ddd7}.thumb-preview{width:110px;aspect-ratio:16/9;object-fit:cover;border-radius:8px}.thumb-controls button,[data-pick-frame="cover"]{padding:9px 12px;border:1px solid #e0ccbb;background:#faf7f4;border-radius:20px;color:#80513d;font-size:10px;margin:3px 4px 3px 0}.thumb-upload{font-size:10px;color:#81766e;margin:9px 0}.thumb-upload input{font-size:11px;padding:6px}.auto-cover{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:400}.auto-cover input{display:inline;width:18px;height:18px;margin:0}#framepicker{width:min(680px,94vw);max-height:92svh;overflow:auto;border:1px solid #e0ccbb;border-radius:20px;padding:25px;font:13px/1.6 Manrope,sans-serif;color:#0d0e13}#framepicker::backdrop{background:#0d0e13aa;backdrop-filter:blur(5px)}#framepicker h2{font-weight:400;font-size:25px}#framevideo{display:block;width:100%;max-height:45svh;background:#0d0e13;border-radius:12px;margin:15px 0}#frameinfo{font-size:12px;color:#81766e}#useframe{background:#0d0e13;color:white}#frameseek{padding:0;accent-color:#a87458}#useframe:disabled{opacity:.4}@media(max-width:500px){.thumb-controls{display:block}.thumb-preview{width:150px}#framepicker{padding:18px}}
