@font-face{font-family:Instrument Sans;src:url(https://shakl.cc/fonts/InstrumentSans-latin.woff2) format("woff2");font-weight:400;font-display:swap}@font-face{font-family:Tajarib;src:url(https://shakl.cc/fonts/Tajarib-Regular.woff2) format("woff2");font-weight:400;font-display:swap}:root{--ink:#0a0a0a;--paper:#ffffff;--on-ink:#ffffff;--soft:#f7f7f5;--cloud:#efefed;--muted:#73746f;--sky:#a9e1f7;--aqua:#63d9db;--mint:#8fe46c;--violet:#b99af8;--shakl-violet-strong:#ab8cf6}.header{position:fixed;z-index:50;top:18px;left:28px;right:28px;height:66px;padding:0 18px 0 22px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border:1px solid rgba(10,10,10,.1);border-radius:999px;background:#ffffffbd;-webkit-backdrop-filter:blur(22px) saturate(140%);backdrop-filter:blur(22px) saturate(140%);box-shadow:0 12px 44px #14191e0f}.brand{width:114px;display:flex;color:var(--ink)}.brand svg,.footer-brand svg{display:block;width:100%;height:auto}.desktop-nav{display:flex;gap:34px;font-size:14px}.desktop-nav a{transition:opacity .25s}.desktop-nav a:hover{opacity:.45}.header-cta{justify-self:end;min-height:42px;padding:0 19px;display:inline-flex;align-items:center;gap:12px;border-radius:999px;background:var(--ink);color:var(--on-ink);font-size:14px}.menu-toggle{display:none;border:0;background:transparent}.mobile-nav{display:none}.site-footer{margin:72px 2vw 8px;padding:28px 32px;display:flex;flex-direction:column;gap:24px;border-radius:28px;background:var(--ink);color:var(--on-ink)}.footer-top,.footer-bottom{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:24px}.footer-bottom{border-top:1px solid #2c2c2c;padding-top:20px}.footer-brand{width:110px;flex-shrink:0;display:flex;color:var(--on-ink)}.footer-nav{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px 24px;color:#bbb;font-size:13px}.footer-nav a{display:inline-flex;align-items:center;min-height:38px;white-space:nowrap;transition:color .25s,opacity .25s}.site-footer a:focus-visible{outline:2px solid var(--violet);outline-offset:5px;border-radius:4px}.footer-nav a:hover{color:var(--on-ink)}.social-links--compact{display:flex;flex-shrink:0;align-items:center;gap:8px}.social-links--compact a{width:38px;height:38px;min-height:38px;padding:0;display:grid;place-items:center;border:1px solid #343434;border-radius:999px;color:#bbb;transition:.3s}.social-links--compact a:hover{border-color:var(--on-ink);background:var(--paper);color:var(--ink)}.social-links--compact svg{width:18px;height:18px}.footer-signature{margin:0;color:#f2f2f2;font-size:15px;font-weight:500;line-height:1.35;letter-spacing:-.025em;white-space:normal;text-wrap:balance}.shakl-heart{display:inline-block;margin:0 .16em;font-size:1.12em;line-height:1;background:linear-gradient(90deg,var(--sky),var(--aqua),var(--mint),var(--violet),var(--sky));background-size:300% 100%;background-position:0 50%;-webkit-background-clip:text;background-clip:text;color:transparent;filter:saturate(1.08);will-change:transform,background-position;animation:shakl-heart-flow 5s linear infinite,shakl-heart-float 2.8s ease-in-out infinite}.footer-signature:hover .shakl-heart{animation-duration:2.8s,2.1s}@keyframes shakl-heart-flow{to{background-position:300% 50%}}@keyframes shakl-heart-float{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}.header>.language-switch{grid-column:3;grid-row:1;justify-self:end;align-self:center}.header .language-switch{direction:ltr;display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid rgba(10,10,10,.12);border-radius:999px;background:#ffffff9e;white-space:nowrap}.header .language-switch button{width:44px;height:34px;padding:0;border:0;border-radius:999px;background:transparent;color:#727272;font:inherit;font-size:13px;font-weight:500;line-height:1;cursor:pointer;transition:background .18s ease,color .18s ease}.header .language-switch button[data-lang=ar]{font-family:Tajarib,Instrument Sans,sans-serif;font-size:14px}.header .language-switch button.is-active{background:var(--ink);color:var(--on-ink)}.header .language-switch button:not(.is-active):hover{color:var(--ink)}.header .language-switch button:focus-visible{outline:2px solid var(--violet);outline-offset:1px}@media(max-width:760px){.header{grid-template-columns:1fr auto auto;column-gap:10px}.header>.language-switch{grid-column:2}.header>.menu-toggle{grid-column:3}.header .language-switch button{width:38px;height:30px}}.header-tool-name{font-size:14px;font-weight:400;white-space:nowrap;margin-left:20px;opacity:.55;justify-self:start}.header .desktop-nav{justify-content:center;grid-column:2;grid-row:1}.header .brand{grid-column:1;grid-row:1}.header .header-tool-name{position:absolute;left:151px;top:26px;grid-row:1}html[dir=rtl] .header{direction:ltr}html[dir=rtl] .header .desktop-nav,html[dir=rtl] .header .mobile-nav{direction:rtl}@media(max-width:1100px){.desktop-nav{gap:15px;font-size:12px}.header-tool-name{display:none}}@media(max-width:760px){.header{top:10px;left:12px;right:12px;height:58px;padding:0 15px;grid-template-columns:1fr auto auto;column-gap:10px}.brand{width:96px}.desktop-nav{display:none}.menu-toggle{display:block;grid-column:3;grid-row:1;justify-self:end;padding:8px}.header>.language-switch{grid-column:2;grid-row:1}.header .language-switch button{width:38px;height:30px}.mobile-nav{position:absolute;top:66px;left:0;right:0;padding:18px;display:grid;gap:12px;border:1px solid rgba(10,10,10,.1);border-radius:24px;background:#fffffff5;box-shadow:0 18px 48px #14191e1a}}@media(max-width:680px){.site-footer{margin:32px 12px 8px;padding:20px;gap:18px}.footer-top,.footer-bottom{flex-direction:column;align-items:flex-start;gap:12px}.footer-nav{justify-content:flex-start;gap:2px 17px}.footer-signature{font-size:13px}}*{box-sizing:border-box}html,body,#root{margin:0;min-width:320px;min-height:100%;background:#fff;color:#0a0a0a}html{scroll-behavior:smooth}body,button,input,textarea,select{font-family:Instrument Sans,Tajarib,system-ui,sans-serif}html[dir=rtl] :is(main,button,input,select,textarea){font-family:Tajarib,Instrument Sans,system-ui,sans-serif;letter-spacing:0}button,input,textarea,select{font-size:inherit}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}a{text-decoration:none;color:inherit}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #ab8cf6;outline-offset:2px}.app-shell{overflow-x:hidden}.editor-page{padding:152px clamp(18px,3vw,56px) 30px;max-width:1920px;margin:auto;min-height:100vh}.editor-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin:0 0 36px}.editor-heading .eyebrow{font-size:12px;color:#737373;direction:ltr;text-align:left;letter-spacing:0}.editor-heading h1{font-family:Instrument Sans,system-ui,sans-serif;font-size:clamp(34px,4.1vw,64px);letter-spacing:-.055em;font-weight:400;line-height:1.1;margin:9px 0 8px;direction:ltr}.editor-heading h1 .dot{color:#ab8cf6}.editor-heading p{font-size:14px;color:#737373;margin:0}.version-tag{font-family:Instrument Sans,sans-serif;white-space:nowrap;border:1px solid #e6e6e6;color:#777;padding:9px 13px;border-radius:999px;font-size:11px;direction:ltr}.editor-layout{display:grid;grid-template-columns:minmax(245px,300px) minmax(420px,1fr) minmax(260px,300px);align-items:start;gap:14px;direction:rtl}.side-panel{border:1px solid #e9e9e9;border-radius:19px;padding:24px 20px;background:#fff;min-width:0;display:flex;flex-direction:column}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 17px}.panel-heading h2{font-size:18px;font-weight:500;margin:0}.panel-mini{color:#8a8a8a;font:11px Instrument Sans,sans-serif}.side-panel>label:not(.checkbox-label){font-size:12px;color:#737373;margin:18px 0 8px}.side-panel :is(textarea,input:not([type=checkbox]),select){width:100%;min-width:0;border:1px solid #e5e5e5;border-radius:11px;background:#fafafa;color:#0a0a0a;padding:12px 13px;font-size:14px;line-height:1.65}.side-panel textarea{resize:vertical;min-height:60px}.input-panel #content{min-height:360px;white-space:pre-wrap;line-height:1.9}.input-stats{display:flex;justify-content:space-between;gap:10px;color:#858585;font-size:11px;margin:12px 0 26px}.small-button{border:0;background:#f4f4f4;border-radius:999px;color:#555;padding:8px 12px;font-size:11px}.hidden-file{display:none}.canvas-panel{min-width:0;background:#f6f6f6;border:1px solid #ededed;border-radius:21px;overflow:hidden;padding:0;direction:ltr}.canvas-top,.canvas-bottom{padding:15px 19px;display:flex;align-items:center;gap:10px;justify-content:space-between;color:#717171;font-size:11px;font-family:Instrument Sans,sans-serif;direction:ltr}.canvas-top{border-bottom:1px solid #e5e5e5}.canvas-bottom{border-top:1px solid #e5e5e5}.fit-good{color:#47765b}.fit-bad{color:#a74e4e;max-width:65%;text-align:right;font-family:Tajarib,sans-serif}.preview-stage{min-height:650px;padding:30px 16px;display:flex;justify-content:center;align-items:start;position:relative;overflow:auto;background:linear-gradient(#f5f5f5,#f5f5f5)}.scaled-artboard{position:relative;flex:0 0 auto;box-shadow:0 12px 44px #00000012}.artboard{position:absolute;left:0;top:0;padding:calc(75px * var(--fit-factor,1));display:flex;flex-direction:column;gap:calc(54px * var(--fit-factor,1));background:var(--p-bg);color:var(--p-ink);font-family:Tajarib,system-ui,sans-serif;font-weight:400;line-height:1.55;overflow:visible}.palette-mono{--p-bg:#fff;--p-ink:#171717;--p-accent:#171717;--p-surface:#f2f2f2}.palette-violet{--p-bg:#f9f9fb;--p-ink:#191720;--p-accent:#7355c3;--p-surface:#eae5fa}.palette-forest{--p-bg:#f7faf8;--p-ink:#163329;--p-accent:#247459;--p-surface:#e3f0e9}.palette-marine{--p-bg:#f8fbfc;--p-ink:#172d41;--p-accent:#27749b;--p-surface:#e6f0f5}.page-heading{flex:0 0 auto;min-width:0}.page-overline{color:var(--p-accent);font-size:calc(19px * var(--fit-factor,1));font-weight:500;margin-bottom:calc(24px * var(--fit-factor,1))}.page-title-line{display:flex;align-items:flex-start;justify-content:space-between;gap:calc(22px * var(--fit-factor,1))}.page-title-line h1{font-size:calc(82px * var(--fit-factor,1));line-height:1.17;font-weight:500;letter-spacing:0;margin:0;min-width:0;overflow-wrap:break-word}.page-symbol{flex:0 0 auto;display:flex;justify-content:center;align-items:center;color:var(--p-accent);padding-top:14px}.page-head-rule{height:calc(5px * var(--fit-factor,1));background:var(--p-accent);width:calc(92px * var(--fit-factor,1));display:block;margin-top:calc(32px * var(--fit-factor,1))}.page-sections{display:grid;gap:var(--section-gap);align-content:start;min-width:0}.text-block{position:relative;min-width:0;padding:calc(24px * var(--fit-factor,1));background:var(--p-surface);border-radius:calc(10px * var(--fit-factor,1));display:flex;flex-direction:column;gap:calc(13px * var(--fit-factor,1))}.text-block h2{font-weight:500;font-size:calc(35px * var(--fit-factor,1));line-height:1.25;margin:0;overflow-wrap:break-word}.text-block p{white-space:pre-wrap;overflow-wrap:break-word;-webkit-hyphens:none;hyphens:none;font-size:calc(var(--type-size) * var(--fit-factor,1));line-height:1.7;margin:0;text-align:start}.text-block .block-index{font-family:Instrument Sans,sans-serif;color:var(--p-accent);opacity:.65;font-size:calc(15px * var(--fit-factor,1));margin-top:auto;direction:ltr;align-self:flex-start}.is-justified .text-block p{text-align:justify;text-align-last:start}.layout-editorial .page-sections{grid-template-columns:1.2fr 1fr}.layout-editorial .text-block:first-child{grid-column:1/-1;background:transparent;border-top:2px solid var(--p-accent);border-radius:0;padding-inline:0}.layout-editorial .text-block:nth-child(4n+2){background:var(--p-surface)}.layout-editorial .text-block:nth-child(4n+3){background:transparent;border:1px solid var(--p-accent)}.layout-columns .page-sections{grid-template-columns:1.33fr 1fr;grid-auto-flow:row}.layout-columns .text-block{background:transparent;border-top:2px solid var(--p-accent);padding-inline:0;border-radius:0}.layout-columns .text-block:nth-child(3n+1){background:var(--p-surface);border-top:0;padding-inline:calc(24px * var(--fit-factor,1));border-radius:calc(10px * var(--fit-factor,1))}.layout-matrix .page-sections{grid-template-columns:repeat(2,minmax(0,1fr))}.layout-matrix .text-block:first-child{grid-column:span 2;background:var(--p-accent);color:var(--p-bg)}.layout-matrix .text-block:first-child .block-index{color:inherit}.layout-statement .page-sections{grid-template-columns:1fr 1fr}.layout-statement .text-block{background:transparent;padding-inline:0;border-radius:0}.layout-statement .text-block:first-child{grid-column:1/-1;border-bottom:2px solid var(--p-accent);padding-bottom:calc(24px * var(--fit-factor,1))}.layout-statement .text-block:first-child p{font-size:calc((var(--type-size) + 8px) * var(--fit-factor,1))}.effect-outline .page-heading h1{-webkit-text-stroke:1.5px var(--p-ink);color:transparent}.effect-highlight .page-heading h1{text-decoration:underline;text-decoration-thickness:.1em;text-decoration-color:var(--p-accent);text-underline-offset:.13em}.texture-paper:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.09;background-image:repeating-linear-gradient(0deg,transparent 0px,transparent 7px,rgba(0,0,0,.04) 8px,transparent 9px);z-index:3}.layout-picker{display:grid;grid-template-columns:1fr 1fr;gap:7px}.layout-picker button{min-height:104px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;background:#fafafa;border:1px solid #e7e7e7;color:#777;border-radius:11px;font:11px Instrument Sans,sans-serif}.layout-picker button[aria-pressed=true]{color:#0a0a0a;border-color:#ab8cf6;background:#f7f4ff}.mini-layout{width:50px;height:36px;display:grid;gap:3px;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr)}.mini-layout i{display:block;background:#c6c6c6;border-radius:2px}.mini-editorial i:first-child,.mini-statement i:first-child,.mini-matrix i:first-child{grid-column:span 2}.mini-columns i:first-child{grid-row:span 2}.layout-picker button[aria-pressed=true] .mini-layout i{background:#ab8cf6}.segmented{display:flex;gap:3px;padding:4px;background:#f5f5f5;border-radius:999px}.segmented button{flex:1;min-width:0;background:transparent;color:#737373;border:0;border-radius:999px;padding:10px 4px;font:12px Instrument Sans,sans-serif}.segmented button[aria-pressed=true]{background:#0a0a0a;color:#fff}.palette-picker{display:flex;gap:12px}.palette-choice{width:36px;height:36px;border-radius:50%;border:3px solid white;box-shadow:0 0 0 1px #ddd}.palette-choice[aria-pressed=true]{box-shadow:0 0 0 2px #7f63cf}.palette-choice-mono{background:linear-gradient(90deg,#171717 50%,#f4f4f4 50%)}.palette-choice-violet{background:linear-gradient(90deg,#7355c3 50%,#ede7f7 50%)}.palette-choice-forest{background:linear-gradient(90deg,#1a6652 50%,#e3efe9 50%)}.palette-choice-marine{background:linear-gradient(90deg,#27749b 50%,#e6f0f5 50%)}.checkbox-label{display:flex;gap:11px;align-items:center;margin:22px 0;font-size:12px;color:#555}.checkbox-label input{accent-color:#ab8cf6;width:16px;height:16px}.export-area{border-top:1px solid #ececec;margin-top:17px;padding-top:22px;display:grid;gap:9px}.export-area h3{font-size:16px;font-weight:500;margin:0 0 6px}.primary-action,.outline-action{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:43px;padding:10px 14px;border-radius:999px;font-size:12px}.primary-action{color:#fff;background:#0a0a0a;border:1px solid #0a0a0a}.outline-action{color:#171717;background:#fff;border:1px solid #dedede}.export-note{font-size:11px;color:#777;line-height:1.85;margin:16px 0 4px}.error-msg{color:#a33;overflow-wrap:anywhere;font-size:12px}.bottom-note{font:12px Instrument Sans,sans-serif;color:#888;text-align:center;margin:42px 0 0}@media(max-width:1400px){.editor-layout{grid-template-columns:minmax(235px,280px) minmax(330px,1fr) minmax(240px,270px)}.side-panel{padding:20px 16px}.preview-stage{min-height:550px}}@media(max-width:1100px){.editor-layout{grid-template-columns:minmax(240px,310px) minmax(0,1fr)}.settings-panel{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:20px;align-items:center}.settings-panel .panel-heading,.settings-panel .export-area,.settings-panel .export-note{grid-column:1/-1}.layout-picker{grid-template-columns:repeat(4,1fr)}}@media(max-width:710px){.editor-page{padding:106px 12px 24px}.editor-heading{margin:0 7px 22px;align-items:start}.version-tag{display:none}.editor-layout{display:flex;flex-direction:column;gap:12px}.side-panel,.canvas-panel{width:100%}.canvas-panel{order:0}.input-panel{order:1}.settings-panel{order:2;display:flex}.layout-picker{grid-template-columns:1fr 1fr}.preview-stage{min-height:480px}.editor-heading h1{font-size:36px}.editor-heading p{font-size:12px}.canvas-top{flex-wrap:wrap}}