Repository navigation
Expand file tree
/
Copy pathstyles.css
More file actions
114 lines (114 loc) · 22.2 KB
/
Copy pathstyles.css
File metadata and controls
114 lines (114 loc) · 22.2 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
:root {
--ink: #11110f;
--paper: #f2efe5;
--white: #fcfaf3;
--lime: #d8ff3e;
--coral: #ff725c;
--blue: #7095ff;
--line: rgba(17,17,15,.16);
--muted: #726f66;
--surface: #fcfaf3;
--surface-soft: #f7f4eb;
--surface-muted: #e9e5da;
--header-bg: rgba(242,239,229,.9);
--shadow: rgba(17,17,15,.12);
color-scheme: light;
}
[data-theme="dark"] {
--ink: #f4f1e8;
--paper: #10100f;
--line: rgba(244,241,232,.16);
--muted: #aaa89f;
--surface: #181816;
--surface-soft: #22221f;
--surface-muted: #272722;
--header-bg: rgba(16,16,15,.9);
--shadow: rgba(0,0,0,.35);
color-scheme: dark;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "Manrope", "Arial", sans-serif; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
.site-header { height: 78px; padding: 0 4vw; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: sticky; top: 0; background: var(--header-bg); backdrop-filter: blur(16px); z-index: 20; }
.header-controls{display:flex;align-items:center;gap:9px}.theme-toggle{height:39px;border:1px solid var(--line);border-radius:100px;background:var(--surface);color:var(--ink);display:flex;align-items:center;gap:7px;padding:0 13px;font-size:10px;font-weight:800;cursor:pointer}.theme-icon{font-size:15px;line-height:1}
.brand { display: inline-flex; gap: 10px; align-items: center; font-weight: 800; letter-spacing: -.06em; font-size: 22px; }
.brand-mark { width: 29px; height: 29px; border-radius: 50%; background: var(--ink); display: grid; place-content: center; gap: 2px; transform: rotate(-8deg); }
.brand-mark i { display: block; height: 3px; border-radius: 2px; background: var(--lime); }
.brand-mark i:nth-child(1) { width: 9px; margin-left: 6px; }.brand-mark i:nth-child(2) { width: 15px; }.brand-mark i:nth-child(3) { width: 9px; }
nav { display: flex; gap: 34px; font-size: 13px; font-weight: 700; }
nav a:hover { opacity: .55; }
.button { border: 0; border-radius: 100px; display: inline-flex; justify-content: center; align-items: center; gap: 18px; padding: 16px 22px; font-weight: 800; font-size: 13px; cursor: pointer; transition: transform .2s, box-shadow .2s; }
.button:hover { transform: translateY(-2px); box-shadow: 0 8px 0 rgba(17,17,15,.12); }
.button span { font-size: 17px; }
.button-dark { background: var(--ink); color: var(--white); }.button-lime { background: var(--lime); color: var(--ink); }
.button-small { padding: 11px 18px; }
.hero { min-height: 720px; padding: 90px 7vw 80px; display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: center; overflow: hidden; }
.hero-copy { max-width: 650px; }
.eyebrow { display: flex; align-items: center; gap: 9px; text-transform: uppercase; font: 500 11px/1 "DM Mono", "Courier New", monospace; letter-spacing: .12em; }
.eyebrow span { width: 24px; height: 2px; background: var(--ink); }
.eyebrow.light { color: var(--white); }.eyebrow.light span { background: var(--lime); }
h1,h2 { margin: 22px 0; font-size: clamp(56px, 7vw, 106px); line-height: .94; letter-spacing: -.085em; }
h1 em,h2 em { font-family: Georgia, serif; font-weight: 400; letter-spacing: -.06em; }
.hero-intro { max-width: 510px; color: var(--muted); line-height: 1.75; font-size: 16px; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin: 34px 0 55px; }
.text-link { font-size: 13px; font-weight: 800; border-bottom: 1px solid var(--ink); padding-bottom: 4px; }
.trust-row { display: flex; align-items: center; gap: 15px; font-size: 11px; color: var(--muted); line-height: 1.5; }
.trust-row strong { color: var(--ink); }
.avatars { display: flex; }.avatars span { width: 31px; height: 31px; border-radius: 50%; background: var(--ink); color: var(--lime); display: grid; place-content: center; font: 500 9px "DM Mono"; border: 2px solid var(--paper); margin-left: -7px; }.avatars span:first-child{margin:0}.avatars span:nth-child(2){background:var(--coral);color:var(--ink)}.avatars span:nth-child(3){background:var(--blue);color:var(--ink)}
.hero-visual { position: relative; height: 540px; display: grid; place-content: center; }
.orbit { position: absolute; border: 1px solid var(--line); border-radius: 50%; inset: 2% 4%; }.orbit-two { inset: 15% 17%; border-style: dashed; }
.phone-card { width: 245px; aspect-ratio: 9/16; background: #11110f; border: 7px solid #11110f; border-radius: 26px; padding: 5px; box-shadow: 0 30px 50px rgba(17,17,15,.22); position: absolute; overflow: hidden; }
.phone-main { left: 38%; top: 7%; transform: rotate(5deg); z-index: 2; }.phone-back { left: 8%; top: 20%; transform: rotate(-10deg); }
.mini-video { height:100%; border-radius: 16px; padding: 24px 18px; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; position:relative }
.mini-dark { background: radial-gradient(circle at 50% 34%, #4f5048, #11110f 58%); color:white; }.mini-coral { background:var(--coral); color:#11110f }
.mini-pill { align-self:flex-start; border:1px solid currentColor; border-radius:100px; padding:5px 8px; font:500 8px "DM Mono"; }
.mini-copy{position:relative;z-index:3;background:rgba(17,17,15,.9);border:1px solid rgba(255,255,255,.22);border-radius:12px;padding:13px 12px;display:grid;gap:8px;backdrop-filter:blur(8px)}.mini-copy small{font:500 7px "DM Mono";color:var(--lime);letter-spacing:.08em}.mini-copy strong{font-size:21px;line-height:.98;letter-spacing:-.065em;text-transform:uppercase;color:#fff;text-shadow:0 2px 8px #000}.mini-copy-coral{background:#11110f;color:#fff;width:76%;align-self:flex-start;margin-bottom:58px}.mini-copy-coral strong{font-size:18px;line-height:1.02}.mini-video>small { font:500 8px "DM Mono"; color:var(--lime); position:relative;z-index:3 }
.face-art { width:130px;height:130px;border-radius:50%;background:var(--lime);position:absolute;left:55px;top:103px;z-index:1 }.face-art span{width:16px;height:16px;border-radius:50%;background:#11110f;position:absolute;top:48px;left:35px}.face-art span+span{left:80px}
.float-note { position:absolute; z-index:3; background:var(--surface); color:var(--ink); border:1px solid var(--line); box-shadow:0 12px 30px var(--shadow); padding:12px 16px; border-radius:12px; font:500 10px "DM Mono"; text-transform:uppercase; display:flex;gap:8px;align-items:center; }.float-note span{font-size:18px;font-weight:800;color:var(--coral)}.note-top{right:2%;top:14%}.note-bottom{left:-2%;bottom:0}.note-bottom span{color:var(--blue)}
.ticker { background:var(--ink);color:var(--white);overflow:hidden;padding:17px 0;white-space:nowrap;font:500 10px "DM Mono";letter-spacing:.12em; }.ticker div{display:inline-flex;gap:28px;align-items:center;animation:ticker 25s linear infinite}.ticker b{color:var(--lime);font-size:15px}@keyframes ticker{to{transform:translateX(-50%)}}
.section { padding: 120px 7vw; }
.section-heading { display:grid;grid-template-columns:1fr 1.5fr 1fr;align-items:end;gap:40px;margin-bottom:70px}.section-heading h2,.formats-title h2,.studio-intro h2{font-size:clamp(48px,6vw,86px);margin:20px 0 0}.section-heading>p:last-child{color:var(--muted);line-height:1.7;font-size:13px}
.steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.steps article{padding:28px;border-right:1px solid var(--line);min-height:280px}.steps article:first-child{border-left:1px solid var(--line)}.step-number{font:500 10px "DM Mono";color:var(--muted)}.step-icon{width:60px;height:60px;border-radius:50%;background:var(--ink);color:var(--lime);display:grid;place-content:center;font-size:22px;margin:40px 0}.steps h3{font-size:18px;letter-spacing:-.04em}.steps p,.format-card p{font-size:12px;line-height:1.7;color:var(--muted)}
.formats{background:var(--ink);color:var(--white)}.formats-title{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:60px}.formats-title h2{max-width:700px}.format-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.format-card{background:#20201d;padding:20px;border-radius:20px}.format-card>span{font:500 9px "DM Mono";color:#aaa89f}.format-art{height:340px;margin:20px 0;padding:22px;border-radius:12px;display:flex;flex-direction:column;justify-content:space-between;text-transform:uppercase;overflow:hidden;position:relative}.format-art:after{content:"";position:absolute;width:190px;height:190px;border:35px solid rgba(255,255,255,.15);border-radius:50%;right:-80px;bottom:-80px}.format-art b{font:500 10px "DM Mono";letter-spacing:.1em}.format-art strong{font-size:clamp(20px,2.5vw,38px);line-height:.95;letter-spacing:-.07em;position:relative;z-index:2}.story-card .format-art{background:var(--coral);color:var(--ink)}.learn-card .format-art{background:var(--blue);color:var(--ink)}.promo-card .format-art{background:var(--lime);color:var(--ink)}
.studio-section{background:var(--paper)}.studio-intro{max-width:650px;margin-bottom:65px}.studio-intro>p:last-child{max-width:500px;color:var(--muted);line-height:1.7}
.studio-app{min-height:720px;background:var(--white);border:1px solid var(--line);border-radius:24px;display:grid;grid-template-columns:210px 1fr;overflow:hidden;box-shadow:0 35px 70px rgba(17,17,15,.12)}.studio-sidebar{background:var(--ink);color:var(--white);padding:20px;display:flex;flex-direction:column;gap:8px}.sidebar-brand{display:flex;align-items:center;gap:8px;margin-bottom:28px}.sidebar-brand strong{font-size:15px}.sidebar-brand small{font:500 7px "DM Mono";color:var(--lime);border:1px solid #555;padding:3px;border-radius:3px}.sidebar-brand .brand-mark{background:#292925;width:24px;height:24px}.side-nav{color:#aaa89f;background:transparent;border:0;border-radius:8px;text-align:left;padding:12px;font-size:11px;font-weight:700;cursor:pointer}.side-nav span{display:inline-block;width:25px}.side-nav b{float:right;background:#33332e;border-radius:10px;padding:2px 6px;font:500 8px "DM Mono"}.side-nav.active,.side-nav:hover{background:#2b2b27;color:var(--white)}.sidebar-tip{margin-top:auto;border:1px solid #393935;border-radius:10px;padding:14px}.sidebar-tip span{font:500 7px "DM Mono";color:var(--lime)}.sidebar-tip p{font-size:10px;line-height:1.6;color:#aaa89f}
.studio-main{padding:42px 48px;min-width:0}.studio-view{display:none}.studio-view.active{display:block;animation:fade .3s ease}@keyframes fade{from{opacity:0;transform:translateY(5px)}}.view-header{display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid var(--line);padding-bottom:25px;margin-bottom:30px}.view-header span{font:500 8px "DM Mono";color:var(--muted);letter-spacing:.1em}.view-header h3{font-size:30px;letter-spacing:-.07em;margin:7px 0}.view-header small{font:500 8px "DM Mono";color:var(--muted)}
#briefForm{display:grid;grid-template-columns:1fr 1fr;gap:22px}.field{display:flex;flex-direction:column;gap:8px}.field.full,fieldset,.form-submit{grid-column:1/-1}.field span,legend{font-size:10px;font-weight:800}.field input,.field textarea,.field select{border:1px solid var(--line);background:#f7f4eb;border-radius:9px;padding:12px;color:var(--ink);outline:none;font-size:11px}.field textarea{height:76px;resize:vertical;line-height:1.5}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(216,255,62,.45)}fieldset{border:0;padding:0;margin:5px 0}.choice-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:11px}.choice{border:1px solid var(--line);border-radius:10px;padding:14px;display:grid;grid-template-columns:30px 1fr;cursor:pointer}.choice input{display:none}.choice span{grid-row:1/3;width:24px;height:24px;border-radius:50%;background:#e7e3d8;display:grid;place-content:center}.choice b{font-size:10px}.choice small{font-size:8px;color:var(--muted)}.choice.selected{border-color:var(--ink);box-shadow:inset 0 -3px var(--lime)}.form-submit{margin-top:8px}
.ghost-button,.filter{border:1px solid var(--line);background:transparent;border-radius:100px;padding:8px 12px;font-size:9px;font-weight:800;cursor:pointer}.filter-row{display:flex;gap:7px;margin-bottom:18px}.filter.active{background:var(--ink);color:var(--white)}.filter span{color:var(--lime)}.calendar-list{display:grid;gap:8px;max-height:525px;overflow:auto;padding-right:6px}.calendar-card{border:1px solid var(--line);border-radius:10px;padding:13px;display:grid;grid-template-columns:38px 75px 1fr auto auto;align-items:center;gap:12px;cursor:pointer;transition:.2s}.calendar-card:hover{transform:translateX(3px);border-color:var(--ink)}.calendar-day{font:500 8px "DM Mono";color:var(--muted)}.type-pill{font:500 7px "DM Mono";padding:5px 7px;border-radius:100px;text-align:center;background:#eee}.type-pill.Story{background:#ffe0da}.type-pill.Educate{background:#dce5ff}.type-pill.Promote{background:#edffc0}.calendar-card strong{font-size:10px;line-height:1.4}.calendar-card button{border:0;background:transparent;font-size:15px;cursor:pointer}
.score-chip{font:500 8px "DM Mono";padding:4px 7px;border-radius:100px;border:1px solid transparent}.score-chip.ready{background:#edffc0;border-color:#9cc34c;color:#3c5212}.score-chip.attention{background:#fff0ec;border-color:var(--coral);color:#a52f1f}
.source-chip{font:500 7px "DM Mono";background:#dce5ff;border:1px solid #7095ff;color:#27408b;padding:2px 5px;border-radius:100px;margin-left:6px;vertical-align:middle;cursor:help}
[data-theme="dark"] .source-chip{background:#1d2742;color:#9eb4f0}
.plan-readiness{font:500 9px/1.6 "DM Mono";color:var(--muted);background:#f2ffd4;border:1px solid #9cc34c;border-radius:10px;padding:10px 13px;margin:0 0 16px}.plan-readiness:empty{display:none}
[data-theme="dark"] .score-chip.ready{background:#26351b;color:#c8e98a}[data-theme="dark"] .score-chip.attention{background:#3b201c;color:#ff927f}
[data-theme="dark"] .plan-readiness{background:#26351b;border-color:#7ea03d;color:#d9d6c9}
.header-actions{display:flex;gap:7px}.copy-field>span{display:flex;justify-content:space-between}.copy-field small{font:500 8px "DM Mono";color:var(--muted)}.quality-panel{border:1px solid #9cc34c;background:#f2ffd4;border-radius:10px;padding:12px}.quality-panel b{font-size:10px}.quality-panel p{font-size:8px;line-height:1.5;margin:5px 0 0;color:var(--muted)}.quality-panel.warning{border-color:var(--coral);background:#fff0ec}.quality-panel.warning b{color:#a52f1f}.button:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.caption-field textarea{height:150px!important}.caption-tools,.voice-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:end}.caption-tools .ghost-button{border-radius:9px;min-height:40px}.voice-controls input[type=range]{padding:8px 0;accent-color:var(--lime)}.voice-note{font:500 8px/1.5 "DM Mono";color:var(--muted);margin:-7px 0 0}
.editor-layout{display:grid;grid-template-columns:minmax(260px,.85fr) 1fr;gap:40px}.preview-wrap{background:#e9e5da;border-radius:14px;display:flex;align-items:center;flex-direction:column;padding:18px;position:relative}.preview-wrap canvas{width:min(100%,280px);aspect-ratio:9/16;border-radius:14px;background:var(--ink);box-shadow:0 18px 30px rgba(17,17,15,.25)}.preview-wrap small{font:500 7px "DM Mono";color:var(--muted);margin-top:13px}.preview-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-70%);width:48px;height:48px;border:1px solid rgba(255,255,255,.5);background:rgba(17,17,15,.55);backdrop-filter:blur(8px);color:white;border-radius:50%;cursor:pointer}.editor-controls{display:flex;flex-direction:column;gap:14px}.editor-controls .field textarea{height:64px}.editor-controls input[type=color]{height:38px;padding:4px}.render-info{display:flex;gap:9px;align-items:center;background:#f0ede4;border-radius:9px;padding:9px}.render-info span{color:#71a12b;font-size:9px}.render-info p{font-size:8px;line-height:1.5;margin:0;color:var(--muted)}.render-info b{color:var(--ink)}.render-status{font:500 8px "DM Mono";margin:0;text-align:center;min-height:12px;color:var(--muted)}
.final-cta{background:var(--coral);min-height:550px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative;overflow:hidden}.final-cta h2{font-size:clamp(65px,9vw,130px);position:relative;z-index:2}.final-cta .button,.final-cta .eyebrow{position:relative;z-index:2}.cta-rings{position:absolute;width:650px;height:650px;border:1px solid rgba(17,17,15,.2);border-radius:50%}.cta-rings:before,.cta-rings:after{content:"";position:absolute;border:1px solid rgba(17,17,15,.2);border-radius:50%;inset:80px}.cta-rings:after{inset:170px}
footer{padding:30px 5vw;background:var(--ink);color:var(--white);display:flex;justify-content:space-between;align-items:center}footer p,footer>span{font:500 8px "DM Mono";color:#8f8e87;letter-spacing:.1em}
.tool-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tool-row .ghost-button{border-radius:8px;padding:10px}.upload-button{display:inline-flex;cursor:pointer}.upload-button input{display:none}.view-note{font-size:10px;color:var(--muted);margin:-15px 0 24px}.empty-state{border:1px dashed var(--line);border-radius:14px;padding:45px 20px;text-align:center;color:var(--muted)}.empty-state b{color:var(--ink);font-size:13px}.empty-state p{font-size:10px}.project-grid,.asset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.project-card,.asset-card{border:1px solid var(--line);border-radius:12px;padding:14px;background:#f7f4eb}.project-card span,.asset-card span{font:500 7px "DM Mono";color:var(--muted)}.project-card h4{font-size:12px;margin:10px 0 16px}.project-card div{display:flex;gap:6px}.project-card button{font-size:8px}.asset-card{cursor:pointer;overflow:hidden}.asset-card img,.asset-card video{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:8px;margin-bottom:10px;background:var(--ink)}.asset-card.active{outline:3px solid var(--lime);border-color:var(--ink)}
.asset-card audio{width:100%;height:48px;margin:18px 0 22px}
dialog{border:0;border-radius:20px;padding:32px;width:min(420px,calc(100% - 30px));background:var(--white);color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.3)}dialog::backdrop{background:rgba(17,17,15,.65);backdrop-filter:blur(4px)}dialog h3{font-size:28px;letter-spacing:-.06em;margin:24px 0}dialog form{display:flex;flex-direction:column;gap:14px}.dialog-close{position:absolute;right:16px;top:14px;border:0;background:transparent;font-size:23px;cursor:pointer}.auth-switch{display:block;margin:18px auto 0;border:0;background:transparent;font-size:9px;font-weight:800;text-decoration:underline;cursor:pointer}.auth-message{font-size:9px;color:var(--coral);text-align:center;min-height:12px}.toast{position:fixed;right:20px;bottom:20px;background:var(--ink);color:var(--white);padding:13px 17px;border-radius:9px;font-size:10px;font-weight:700;z-index:50;transform:translateY(100px);opacity:0;transition:.25s}.toast.show{transform:translateY(0);opacity:1}
[data-theme="dark"] .studio-app,[data-theme="dark"] dialog{background:var(--surface)}
[data-theme="dark"] .studio-section{background:var(--paper)}
[data-theme="dark"] .field input,[data-theme="dark"] .field textarea,[data-theme="dark"] .field select,[data-theme="dark"] .project-card,[data-theme="dark"] .asset-card{background:var(--surface-soft);color:var(--ink)}
[data-theme="dark"] .field input,[data-theme="dark"] .field textarea,[data-theme="dark"] .field select{border-color:rgba(244,241,232,.28)}
[data-theme="dark"] .field input::placeholder,[data-theme="dark"] .field textarea::placeholder{color:#c7c4ba;opacity:1}
[data-theme="dark"] .field span,[data-theme="dark"] legend,[data-theme="dark"] .calendar-card strong,[data-theme="dark"] .view-header h3{color:#f4f1e8}
[data-theme="dark"] .choice{border-color:rgba(244,241,232,.25)}[data-theme="dark"] .choice.selected{border-color:var(--lime)}
[data-theme="dark"] .button-lime,[data-theme="dark"] .button-lime span{color:#11110f;text-shadow:none}
[data-theme="dark"] .choice span,[data-theme="dark"] .render-info,[data-theme="dark"] .preview-wrap{background:var(--surface-muted)}
[data-theme="dark"] .quality-panel{background:#26351b;border-color:#7ea03d}[data-theme="dark"] .quality-panel.warning{background:#3b201c}
[data-theme="dark"] .type-pill{color:#11110f}[data-theme="dark"] .ghost-button{color:var(--ink)}[data-theme="dark"] .filter.active{background:var(--lime);color:#11110f}
[data-theme="dark"] .button-dark,[data-theme="dark"] .button-lime{background:var(--lime);color:#11110f}[data-theme="dark"] .text-link{border-color:var(--ink)}
[data-theme="dark"] .brand-mark{background:var(--lime)}[data-theme="dark"] .brand-mark i{background:#11110f}
[data-theme="dark"] .orbit{border-color:rgba(244,241,232,.22)}
[data-theme="dark"] .hero-visual{filter:saturate(1.08)}
[data-theme="dark"] .avatars span{border-color:var(--paper)}
[data-theme="dark"] .formats,[data-theme="dark"] .ticker,[data-theme="dark"] footer,[data-theme="dark"] .studio-sidebar{background:#080807;color:#fcfaf3}
[data-theme="dark"] .step-icon{background:#252521;color:var(--lime)}
@media(max-width:900px){nav{display:none}.hero{grid-template-columns:1fr;padding-top:60px}.hero-visual{height:500px}.section-heading{grid-template-columns:1fr}.steps,.format-grid{grid-template-columns:1fr 1fr}.steps article:first-child{border-left:0}.studio-app{grid-template-columns:1fr}.studio-sidebar{flex-direction:row;overflow:auto}.sidebar-brand,.sidebar-tip{display:none}.editor-layout{grid-template-columns:1fr}.preview-wrap canvas{max-width:240px}.formats-title{display:block}}
@media(max-width:600px){.site-header{height:66px}.site-header .button{font-size:0;display:flex;padding:10px}.site-header .button span{font-size:17px}.theme-label{display:none}.theme-toggle{width:39px;justify-content:center;padding:0}.hero{padding:55px 6vw}.hero h1{font-size:60px}.phone-card{width:190px}.phone-main{left:38%}.face-art{left:35px;top:90px}.mini-copy strong{font-size:17px}.mini-copy-coral{margin-bottom:48px}.note-bottom{bottom:1%;left:0}.section{padding:80px 5vw}.steps,.format-grid{grid-template-columns:1fr}.format-art{height:280px}.studio-main{padding:28px 18px}.studio-sidebar{padding:10px}.side-nav{white-space:nowrap}.side-nav b{display:none}#briefForm{grid-template-columns:1fr}.choice-row{grid-template-columns:1fr}.field{grid-column:1/-1}.calendar-card{grid-template-columns:32px 65px 1fr}.calendar-card button{display:none}.editor-layout{gap:22px}.caption-tools,.voice-controls{grid-template-columns:1fr}.project-grid,.asset-grid{grid-template-columns:1fr 1fr}.final-cta{min-height:450px}footer{gap:15px;flex-wrap:wrap}}