@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#14213d;--muted:#68758b;--line:#e5eaf2;--bg:#f7f9fc;--purple:#6957e8;--purple-dark:#5141c8;--white:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}.site-header{height:78px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(6%,calc((100% - 1160px)/2));position:sticky;top:0;z-index:5}.brand{display:inline-flex;align-items:center;gap:10px;font-family:Manrope,sans-serif;font-weight:800;font-size:19px;letter-spacing:-.6px}.brand-mark{height:35px;width:35px;border-radius:11px;background:var(--purple);color:#fff;display:grid;place-items:center;font-weight:800}.site-header nav{display:flex;gap:27px;color:#536079;font-size:14px;font-weight:600}.site-header nav a:hover,.footer-links a:hover{color:var(--purple)}main{max-width:1160px;margin:auto;padding:0 22px}.hero{padding:92px 0 70px;max-width:750px}.eyebrow{color:var(--purple);font-size:11px;letter-spacing:2px;font-weight:800}.hero h1{font:800 clamp(42px,6vw,68px)/1.08 Manrope,sans-serif;letter-spacing:-3px;margin:16px 0}.hero h1 span{color:var(--purple)}.hero>p{color:var(--muted);font-size:18px;max-width:570px;margin:18px 0 27px}.primary-btn,.secondary-btn{border:0;border-radius:10px;padding:12px 18px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font:700 14px 'DM Sans',sans-serif;cursor:pointer;transition:.15s}.primary-btn{background:var(--purple);color:#fff}.primary-btn:hover{background:var(--purple-dark);transform:translateY(-1px)}.secondary-btn{background:#f0efff;color:var(--purple-dark)}.secondary-btn:hover{background:#e4e0ff}.hero-note{font-size:12px;color:#748097;margin-top:20px;display:flex;align-items:center;gap:8px}.status-dot{width:7px;height:7px;background:#27b47e;border-radius:50%}.tools-section{padding:35px 0 55px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.section-heading h2,.info-section h2{font:800 30px/1.25 Manrope,sans-serif;letter-spacing:-1px;margin:7px 0}.section-heading>p,.muted{color:var(--muted);font-size:14px}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tool-card,.work-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:24px;box-shadow:0 5px 20px rgba(29,44,75,.025)}.tool-card{min-height:222px}.tool-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;font-weight:800;font-size:18px}.purple{background:#eeeaff;color:#6c58e8}.blue{background:#e5f2ff;color:#2875c7}.orange{background:#fff0df;color:#d77b16}.green{background:#e0f8ee;color:#14875c}.pink{background:#ffe8f1;color:#d34d8c}.tool-card h3{font:700 16px Manrope,sans-serif;margin:17px 0 6px}.tool-card p{font-size:13px;color:var(--muted);margin:0 0 15px}.tool-card>a{color:var(--purple);font-size:13px;font-weight:700}.tool-card>a span{margin-left:4px}.workspace{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:10px 0 65px}.work-card{scroll-margin-top:95px}.work-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.work-title h2{font:800 22px/1.3 Manrope,sans-serif;letter-spacing:-.7px;margin:4px 0}.round-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#f0efff;color:var(--purple);font-weight:800;font-size:20px}label{display:block;font-size:13px;font-weight:700;margin:13px 0 7px}textarea,input[type="number"],input[type="date"],input[type="file"]{width:100%;border:1px solid #dce2ed;border-radius:10px;background:#fff;padding:12px 13px;font:14px 'DM Sans',sans-serif;color:var(--ink);outline:none}textarea{resize:vertical;min-height:100px}textarea:focus,input:focus{border-color:#9286f0;box-shadow:0 0 0 3px #f0efff}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.stats div{background:#f7f8fc;border-radius:10px;padding:12px}.stats strong{display:block;font:800 22px Manrope,sans-serif}.stats span{font-size:11px;color:var(--muted)}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}.work-card hr{border:0;border-top:1px solid var(--line);margin:25px 0}.work-card h3{font:700 15px Manrope,sans-serif}.result{background:#f7f8fc;border:1px solid var(--line);border-radius:10px;padding:13px;margin:13px 0 0;color:#536079;font-size:14px}.result-box{background:#f7f8fc;border-radius:10px;padding:14px;margin-top:14px}.result-box p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;margin:0 0 12px}.button-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.button-row .secondary-btn{font-size:11px;padding:9px 10px}.small{font-size:12px;padding:8px 11px}.small-note{font-size:11px;color:#8590a2;margin:9px 0}.quality-row{display:flex;align-items:center;justify-content:space-between}.quality-row label{margin-bottom:0}input[type=range]{width:100%;accent-color:var(--purple);margin:15px 0}.image-preview{display:block;max-width:100%;max-height:300px;object-fit:contain;margin:15px auto;border-radius:10px}.hidden{display:none!important}.download-btn{margin-top:12px}.info-section{display:grid;grid-template-columns:1fr 1fr;gap:55px;padding:55px 0 80px;border-top:1px solid var(--line)}.info-section>div:first-child>p{color:var(--muted);max-width:460px}.info-points>div{display:flex;gap:16px;padding:10px 0}.info-points>div>span{font:800 13px Manrope;color:var(--purple);padding-top:2px}.info-points h3{font:700 15px Manrope;margin:0}.info-points p{font-size:13px;color:var(--muted);margin:3px 0}.site-footer{background:#101a32;color:#fff;padding:35px max(6%,calc((100% - 1160px)/2));}.site-footer .brand{color:#fff}.site-footer>p,.site-footer small{color:#a8b2c7;font-size:12px}.footer-links{display:flex;flex-wrap:wrap;gap:20px;margin:22px 0}.footer-links a{font-size:12px;color:#d1d8e5}.page-main{max-width:850px;min-height:65vh;padding:60px 22px 80px;margin:auto}.page-main h1{font:800 clamp(34px,5vw,48px)/1.2 Manrope,sans-serif;letter-spacing:-1.5px}.page-main h2{font:800 23px Manrope;margin-top:32px}.page-main p,.page-main li{color:#536079}.page-main .updated{font-size:13px;color:#8791a2}.page-main a{color:var(--purple);text-decoration:underline}
@media(max-width:760px){.site-header{height:auto;min-height:70px;padding:15px 20px;gap:12px;align-items:flex-start;flex-direction:column}.site-header nav{gap:17px;flex-wrap:wrap;font-size:12px}.hero{padding:62px 0 48px}.hero h1{letter-spacing:-2px}.section-heading{align-items:flex-start;flex-direction:column;gap:0}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace{grid-template-columns:1fr}.info-section{grid-template-columns:1fr;gap:25px;padding:40px 0 55px}.tool-card{padding:18px}.site-footer{padding:30px 22px}}
@media(max-width:420px){.tool-grid{grid-template-columns:1fr}.tool-card{min-height:0}.stats{grid-template-columns:repeat(2,1fr)}.field-grid{grid-template-columns:1fr}.work-card{padding:18px}}


/* Colorful visual refresh */
:root{
 --ink:#172554;--muted:#64748b;--line:#e3e8f5;--bg:#f5f7ff;
 --purple:#6d4aff;--purple-dark:#5033d6;--white:#fff;
 --cyan:#06b6d4;--pink:#ec4899;--orange:#f97316;--green:#10b981;
}
body{
 background:
   radial-gradient(ellipse at 8% 2%,rgba(167,139,250,.19),transparent 28rem),
   radial-gradient(ellipse at 92% 18%,rgba(34,211,238,.15),transparent 25rem),
   #f6f7ff;
}
.site-header{
 background:rgba(255,255,255,.92);backdrop-filter:blur(14px);
 box-shadow:0 5px 24px rgba(39,48,100,.05);border-bottom:1px solid rgba(221,226,246,.9)
}
.brand-mark{background:linear-gradient(135deg,#7c3aed,#4f46e5 55%,#06b6d4);box-shadow:0 6px 14px rgba(109,74,255,.24)}
.site-header nav a{padding:8px 11px;border-radius:9px;transition:.18s}
.site-header nav a:hover{background:#f0edff;color:#5b3ce6}
.hero{
 max-width:none;margin:24px 0 36px;padding:70px clamp(24px,6vw,76px);
 border-radius:30px;position:relative;overflow:hidden;color:white;
 background:linear-gradient(120deg,#4f46e5 0%,#7c3aed 45%,#db2777 100%);
 box-shadow:0 22px 55px rgba(91,61,207,.22)
}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.hero:before{width:320px;height:320px;right:-70px;top:-130px;background:rgba(255,255,255,.12)}
.hero:after{width:210px;height:210px;right:18%;bottom:-155px;border:35px solid rgba(255,255,255,.10)}
.hero .eyebrow,.hero h1 span{color:#d9faff}
.hero h1,.hero>p,.hero .eyebrow,.hero .primary-btn,.hero .hero-note{position:relative;z-index:1}
.hero>p{color:rgba(255,255,255,.88)}
.hero .primary-btn{background:white;color:#5b3ce6;box-shadow:0 8px 20px rgba(30,20,90,.16)}
.hero .primary-btn:hover{background:#f5f3ff}
.hero .hero-note{color:rgba(255,255,255,.85)}
.hero .status-dot{background:#a7f3d0}
.tools-section{padding-top:25px}
.section-heading h2,.info-section h2{color:#202454}
.tool-card,.work-card{
 border:1px solid rgba(222,226,246,.95);border-radius:20px;
 box-shadow:0 8px 25px rgba(44,48,105,.055);transition:transform .2s,box-shadow .2s,border-color .2s
}
.tool-card{position:relative;overflow:hidden;background:linear-gradient(155deg,#fff 0%,#fff 72%,#f5f3ff 100%)}
.tool-card:after{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:linear-gradient(90deg,#7c3aed,#06b6d4,#ec4899);opacity:.9}
.tool-card:hover,.work-card:hover{transform:translateY(-4px);box-shadow:0 16px 35px rgba(65,54,145,.12);border-color:#c7c0ff}
.tool-icon{box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)}
.tool-icon.purple{background:linear-gradient(135deg,#ede9fe,#ddd6fe);color:#6d28d9}
.tool-icon.blue{background:linear-gradient(135deg,#cffafe,#dbeafe);color:#0369a1}
.tool-icon.orange{background:linear-gradient(135deg,#ffedd5,#fef3c7);color:#c2410c}
.tool-icon.green{background:linear-gradient(135deg,#d1fae5,#ccfbf1);color:#047857}
.tool-icon.pink{background:linear-gradient(135deg,#fce7f3,#fae8ff);color:#be185d}
.primary-btn{background:linear-gradient(115deg,#6d4aff,#8b5cf6);box-shadow:0 6px 15px rgba(109,74,255,.17)}
.primary-btn:hover{background:linear-gradient(115deg,#5033d6,#7c3aed)}
.secondary-btn{background:linear-gradient(135deg,#f0edff,#e7f8ff);color:#5b3ce6}
.secondary-btn:hover{background:#e6e0ff}
.work-card{background:rgba(255,255,255,.94)}
.work-title h2{color:#26245b}
.round-icon{background:linear-gradient(135deg,#ede9fe,#cffafe);color:#6d4aff}
textarea,input[type="number"],input[type="date"],input[type="file"]{border-color:#d9def1;background:#fcfcff}
textarea:focus,input:focus{border-color:#8b5cf6;box-shadow:0 0 0 4px rgba(139,92,246,.12)}
.stats div{background:linear-gradient(145deg,#f8f7ff,#effaff);border:1px solid #ecebff}
.stats div:nth-child(3n+2){background:linear-gradient(145deg,#fff7ed,#fff1f2)}
.stats strong{color:#5b3ce6}
.result,.result-box{background:linear-gradient(145deg,#f8f7ff,#f0f9ff);border-color:#e3e7fa}
.info-section{border-top:1px solid #e2e5f5}
.info-points>div{background:rgba(255,255,255,.72);border:1px solid #ecebfa;border-radius:14px;padding:15px;margin-bottom:9px}
.info-points>div>span{background:#eeeaff;border-radius:9px;padding:5px 8px;height:max-content}
.site-footer{background:linear-gradient(115deg,#171943,#31236e 62%,#164e63);position:relative;overflow:hidden}
.site-footer:before{content:"";display:block;position:absolute;width:300px;height:300px;border-radius:50%;right:-110px;top:-180px;background:rgba(139,92,246,.18)}
.page-main{background:rgba(255,255,255,.8);border:1px solid rgba(225,228,247,.8);border-radius:24px;margin-top:38px;margin-bottom:40px;padding:48px clamp(22px,5vw,54px);box-shadow:0 12px 35px rgba(44,48,105,.055)}
.page-main h1{background:linear-gradient(100deg,#4f46e5,#9333ea 60%,#db2777);-webkit-background-clip:text;background-clip:text;color:transparent}
.page-main h2{color:#312e81;position:relative;padding-bottom:8px}
.page-main h2:after{content:"";display:block;width:52px;height:3px;border-radius:4px;background:linear-gradient(90deg,#7c3aed,#06b6d4);margin-top:7px}
.page-main a{color:#6d4aff}
.page-main a:hover{color:#db2777}
@media(max-width:760px){
 .hero{margin-top:12px;padding:48px 25px;border-radius:23px}
 .page-main{margin-top:20px;padding:32px 22px;border-radius:18px}
}


/* Responsive layout safeguards */
@media(max-width:760px){.site-header{height:auto;min-height:70px;padding:14px 5%;gap:12px;flex-wrap:wrap}.site-header nav{gap:14px;flex-wrap:wrap;font-size:13px}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace{grid-template-columns:1fr}.info-section{grid-template-columns:1fr;gap:24px}.hero{padding:58px 0 48px}.page-main{margin-top:20px;padding:30px 20px}}
@media(max-width:480px){.tool-grid{grid-template-columns:1fr}.section-heading{align-items:flex-start;flex-direction:column}.hero h1{letter-spacing:-1.5px}.field-grid{grid-template-columns:1fr}.site-header nav{width:100%;justify-content:space-between}}

.page-main{padding-top:42px;padding-bottom:60px}.page-main h1{font:800 clamp(32px,5vw,48px)/1.15 Manrope,sans-serif;letter-spacing:-1.5px;margin:12px 0}.page-main h2{font:800 25px/1.25 Manrope,sans-serif;margin:34px 0 10px}.page-main h3{font:700 16px Manrope,sans-serif}.page-main>p{color:var(--muted)}.tool-controls{margin:12px 0}.tool-canvas{display:block;max-width:100%;max-height:520px;margin:18px auto;border-radius:10px;background:#f4f5fa}.emoji-grid,.symbol-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:8px;margin:15px 0}.emoji-grid button,.symbol-grid button{background:#f7f8fc;border:1px solid var(--line);border-radius:9px;padding:10px;font-size:23px;cursor:pointer}.palette-grid{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0}.palette-swatch{width:100px;height:75px;border-radius:10px;border:1px solid var(--line);display:flex;align-items:end;justify-content:center;padding:5px;font-size:11px;background:var(--swatch);color:#fff;text-shadow:0 1px 3px #333}.color-swatch{height:120px;border-radius:14px;margin:15px 0;background:#6957e8}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:16px 0}.calendar-grid div{padding:8px 2px;text-align:center;background:#f7f8fc;border-radius:5px}.calendar-grid .weekday{background:var(--purple);color:white;font-weight:700}.hidden{display:none!important}@media(max-width:700px){.tool-grid{grid-template-columns:1fr}.site-header nav{gap:10px;font-size:12px}.page-main{padding-top:28px}.field-grid{grid-template-columns:1fr}}@media print{.site-header,.site-footer,.work-card>button,.page-main>p,.eyebrow{display:none!important}.calendar-grid div{border:1px solid #ddd}.page-main{max-width:none}}
