/* Studio-only visual experience. Responsive websites retain their own design. */
:root,body,body[data-theme=light],body[data-theme=dark]{--bg:#fff;--panel:#fff;--surface:#fff;--input:#fff;--subtle:#f4f3f8;--canvas:#f2f3f8;--line:#e0dfe7;--text:#25262b;--muted:#6d6d78;--lime:#8050de;--green:#8050de;--primary:#8b3df2;--primary-text:#fff;--studio-accent:#7d39d6;--shadow:0 6px 18px #2222350a}body{background:#fff;color:var(--text);font-family:Arial,Helvetica,sans-serif}button{border-radius:9px;background:#fff;color:#27262d;border-color:var(--line)}button:hover{background:#f3edff;border-color:#b596eb}button.primary,.primary{background:#8b3df2;border-color:#8b3df2;color:#fff}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #ac7af8;outline-offset:3px}.visual-icon{width:24px;height:24px;flex-shrink:0;vertical-align:middle;pointer-events:none}.studio-footer{display:none!important}.header{background:white;border-bottom:1px solid #ecebf2;min-height:66px;padding:10px 26px;position:sticky;top:0;z-index:30;gap:16px}.header .brand{font-size:13px;letter-spacing:.6px}.header .brand .mark{width:34px;height:34px}.header .brand small{font-size:8px;color:#74707e}.header .hire{display:none}.header .studio-nav{margin-left:auto}.header .studio-nav a{font-size:13px;color:#63576b;text-decoration:none}.header #studio-help-open{background:#f3edff;border:0;color:#7541b8;font-size:12px}.header .project,.header .actions,#editor-home,#editor-more,#editor-options{display:none}.journey,.studio-intro,.legacy-starters,#continue-editing,.choose-step>.fine,.templates-heading{display:none!important}.onboarding{max-width:1500px;margin:0 auto;padding:28px 38px 60px 126px}.studio-home-nav{position:fixed;left:0;top:66px;bottom:0;width:88px;background:#f8f5fe;border-right:1px solid #eee7f7;z-index:25;display:flex;flex-direction:column;align-items:center;gap:7px;padding:20px 6px;overflow:auto}.studio-home-nav button{background:transparent;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:76px;min-height:66px;font-size:11px;color:#645a70;padding:7px 4px}.studio-home-nav button>.visual-icon{width:25px;height:25px}.studio-home-nav [aria-current=page]{color:#7d31cc;background:#eadcfb;font-weight:bold}.studio-home-nav [data-home-destination=Create]{color:#fff;background:#8b3df2;border-radius:12px;margin-bottom:8px}.visual-welcome{padding:36px 28px 28px;border-radius:18px;background:linear-gradient(110deg,#c7f4f2 0%,#f0faff 38%,#f5e8ff 73%,#d5b3fa 100%);text-align:center;min-height:250px}.visual-welcome>p{font-size:10px;letter-spacing:1.6px;color:#65518a;margin:0 0 18px}.visual-welcome h1{font-size:34px!important;letter-spacing:-1px!important;color:#6732b6;max-width:none;margin:0 0 16px;line-height:1.2}.welcome-switch{display:flex;justify-content:center;gap:8px;margin-bottom:18px}.welcome-switch button{border-radius:30px;background:#fff9;min-height:30px;padding:5px 11px;font-size:11px;border-color:#c9b2e1}.welcome-switch .visual-icon{width:14px;height:14px;margin-right:4px}.workspace-search{max-width:830px;margin:auto;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #e7e0ef;box-shadow:0 5px 15px #6e3b9f0c;padding:4px 18px;border-radius:14px;height:56px}.workspace-search .visual-icon{color:#5e5568;width:21px;height:21px}.workspace-search input{border:0!important;border-radius:0;background:#fff!important;box-shadow:none;width:100%;font-size:15px;color:#333;padding:12px 0;min-width:0;outline-offset:0}.visual-categories{display:flex;justify-content:center;gap:24px;margin:25px 0 36px;overflow-x:auto;padding:8px 0 12px}.visual-categories button{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:94px;border:0;padding:0;background:none;font-size:12px;color:#5a5362;white-space:nowrap}.visual-categories .visual-icon{width:60px;height:60px;background:#ece5f7;color:#884cda;padding:15px;border-radius:50%;box-shadow:0 2px 5px #00000007}.visual-categories [data-color=pink] .visual-icon{background:#d92c84;color:white}.visual-categories [data-color=orange] .visual-icon{background:#f79017;color:white}.visual-categories [data-color=blue] .visual-icon{background:#258ee7;color:white}.visual-categories [data-color=green] .visual-icon{background:#0aab65;color:white}.visual-categories [data-color=teal] .visual-icon{background:#19a5b6;color:white}.visual-categories [data-color=gray] .visual-icon{background:#edeaf2;color:#775894}.visual-section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}.visual-section-heading h2{font-size:23px;letter-spacing:-.5px;margin:0}.visual-section-heading button{border:0;background:transparent;font-size:13px;display:flex;align-items:center;gap:7px;white-space:nowrap}.visual-section-heading .visual-icon{width:18px;height:18px}.visual-recent{margin:0 0 36px}.project-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.visual-project-card{min-width:0;position:relative;display:flex;flex-direction:column;gap:7px;padding:0;border:0;background:transparent}.visual-thumbnail{aspect-ratio:1.65;background:#f1f1f5;border:8px solid #f1f1f5;border-radius:12px;overflow:hidden;position:relative;min-width:0;isolation:isolate}.visual-thumbnail iframe{width:1200px;height:850px;transform-origin:top left;border:0;pointer-events:none;background:#fff}.visual-project-card h3{font-size:16px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:4px 0 0}.visual-project-card>small{font-size:11px;color:#817b87}.project-badge{position:absolute;top:12px;left:12px;z-index:2;border-radius:20px;padding:4px 8px;background:#3e3c49b0;color:#fff;font-size:10px;pointer-events:none}.visual-project-card>button:not(.project-delete){align-self:flex-start;display:flex;gap:6px;align-items:center;padding:6px 10px;font-size:11px;min-height:34px;margin-top:3px}.visual-project-card>button .visual-icon{width:16px;height:16px}.project-delete{position:absolute;right:12px;top:12px;z-index:2;padding:5px;background:#fff;border:0;min-height:30px;display:flex;align-items:center;font-size:0}.project-delete span{display:none}.project-delete .visual-icon{width:18px;height:18px}.empty-projects{grid-column:1/-1;border:1px dashed #ded5ec;border-radius:14px;display:flex;align-items:center;gap:18px;padding:20px;background:#faf8fd}.empty-projects>.visual-icon{color:#9670c2;width:42px;height:42px}.empty-projects p{color:var(--muted);font-size:13px;margin:0;flex:1}.empty-projects strong{font-size:15px}.empty-projects button{display:flex;gap:6px;background:#8b3df2;color:#fff;border:0;white-space:nowrap}.empty-projects button .visual-icon{width:17px;height:17px}.library-heading{margin-top:28px}.library-heading h2{font-size:24px!important;font-weight:650;letter-spacing:-.5px}.library-filters{gap:7px}.library-filters button{border:1px solid #e3dfe8;background:white;border-radius:25px;min-height:34px;padding:7px 12px;font-size:11px}.library-filters [aria-pressed=true]{background:#f0e4ff!important;color:#7536bb!important;border-color:#d4b5f4!important}.library-toolbar{padding:0;background:transparent;border:0;grid-template-columns:2fr 1fr auto;gap:16px;margin:18px 0}.library-toolbar input,.library-toolbar select{padding:10px 12px;border-radius:10px;font-size:13px}.library-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.library-card{border:0;padding:0;box-shadow:none;background:none;border-radius:12px;overflow:visible}.library-card:hover{box-shadow:none;border-color:transparent}.library-card .library-preview{border:8px solid #f2f1f5;border-radius:12px;margin:0 0 12px;height:auto;aspect-ratio:1.55}.library-preview iframe{height:900px}.library-card h3{font-size:18px;margin:6px 0}.library-card .eyebrow{font-size:9px;letter-spacing:.4px}.library-card>.fine{font-size:11px;min-height:0;margin:5px 0}.library-card>small{font-size:10px}.library-card .two{gap:7px;margin-top:5px}.library-card .two button{font-size:11px;padding:7px;min-height:36px}.library-card .two button .tool-icon{width:14px;height:14px}.library-more{background:#f2e8ff;color:#753bb4;border:0;min-height:42px}.library-card>.fine,.library-card>small{display:none}.library-heading .tool-icon,.library-filters .tool-icon{display:none}#visual-projects,#visual-more{display:none;padding:12px 0}.project-source-tabs{display:flex;gap:8px;border-bottom:1px solid #e5e0ed;margin:20px 0;padding-bottom:10px}.project-source-tabs button{border:0;background:transparent;color:#7a7083;min-height:42px;padding:8px 20px}.project-source-tabs [aria-pressed=true]{border-radius:0;border-bottom:3px solid #8b3df2;color:#7131b6;font-weight:600}#visual-project-usage{font-size:13px;color:#82728f;margin:18px 0}#visual-projects h1,#visual-more h1{font-size:30px;letter-spacing:-1px;margin-bottom:10px}#visual-projects .visual-section-heading p{font-size:13px;color:var(--muted);margin:0}.account-cover{display:grid;place-items:center;background:linear-gradient(135deg,#e3f5f1,#dfccf9)}.account-cover .visual-icon{width:60px;height:60px;color:#87629f}.account-signin{grid-column:1/-1;padding:30px;background:#f5f0fb;border-radius:14px}.account-signin a{display:inline-block;background:#8b3df2;color:white;border-radius:9px;padding:10px 20px;margin:10px 10px 0 0;text-decoration:none}.more-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0}.more-card-grid button{display:flex;align-items:center;gap:10px;padding:20px;text-align:left;min-height:80px;background:#faf7fe}.more-card-grid .visual-icon{color:#8c4cce;width:30px;height:30px}body[data-studio-home=projects] .choose-step>:not(#visual-projects),body[data-studio-home=more] .choose-step>:not(#visual-more){display:none!important}body[data-studio-home=projects] #visual-projects,body[data-studio-home=more] #visual-more{display:block}body[data-studio-home=templates] .visual-recent{display:none}body[data-view=edit] .studio-home-nav,body[data-view=details] .studio-home-nav{display:none}
/* Editor: gradient header, neutral canvas, permanent tool rail. */
body[data-view=edit] .header{background:linear-gradient(100deg,#07b7bd 0%,#328acf 42%,#7430d9 100%);color:white;position:relative;min-height:58px;padding:8px 16px;gap:12px;border:0;flex-wrap:nowrap}body[data-view=edit] #editor-home{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border:0;background:transparent;color:#fff;padding:6px;flex-shrink:0}body[data-view=edit] .header .brand{display:none}body[data-view=edit] .header .project{display:flex;align-items:center;gap:10px;max-width:280px;flex:1;min-width:80px}body[data-view=edit] .project input{width:100%;background:transparent!important;border:1px solid transparent;color:#fff;font-size:13px;padding:7px 9px;min-width:0}body[data-view=edit] .project input:hover,body[data-view=edit] .project input:focus{border-color:#ffffff80;background:#ffffff12!important}body[data-view=edit] #save-status{display:none}body[data-view=edit] .header .actions{display:flex;align-items:center;gap:6px;margin-left:auto;flex-wrap:nowrap}body[data-view=edit] .actions button{color:white;background:transparent;border:1px solid #ffffff26;border-radius:7px;min-height:36px;font-size:11px;padding:7px 10px;white-space:nowrap}body[data-view=edit] .actions #publish-open{background:white;color:#702cb4;border-color:white;font-weight:bold}body[data-view=edit] .header #studio-help-open{display:none}body[data-view=edit] .toolbar{display:none!important}body[data-view=edit] .workspace{grid-template-columns:84px 330px minmax(0,1fr)!important}body[data-view=edit][data-tools=closed] .workspace{grid-template-columns:84px minmax(0,1fr)!important}body[data-view=edit] .tool-rail{background:#fff;border-color:#e5e2ec;padding:12px 5px;gap:5px}body[data-view=edit] .tool-rail button{min-height:62px;border-radius:10px;color:#66606c;gap:7px;font-size:10px;position:relative}body[data-view=edit] .tool-rail .visual-icon{width:25px;height:25px;margin:0}body[data-view=edit] .tool-rail [aria-pressed=true]{box-shadow:none;background:#f0e7fb;color:#8438d8;font-weight:600}body[data-view=edit] .tool-rail [aria-pressed=true] .visual-icon{filter:drop-shadow(0 3px 4px #8b43d626)}body[data-view=edit] .sidebar{background:#fff;border-right:1px solid #dedbe6}body[data-view=edit] .panel-heading{padding:12px 15px;min-height:51px;border-color:#eeebf2}body[data-view=edit] .panel-heading button{background:transparent;border:0;font-size:11px;min-height:30px;color:#7c7482}body[data-view=edit] .panel-heading strong{font-size:13px}body[data-view=edit] .panel{padding:18px 16px!important;background:#fff}body[data-view=edit] .panel h2{font-size:19px;letter-spacing:-.4px}body[data-view=edit] .panel .fine{font-size:12px;line-height:1.6;color:#81778a}.panel input[type=search]{height:48px;border:1px solid #e3dcec;border-radius:12px;font-size:14px;padding:11px 14px;margin-bottom:12px}.panel .section-label{font-size:11px}.panel .design-card{border:0;padding:0;gap:8px;background:transparent;font-size:11px;align-content:start}.design-preview{height:95px;border-radius:12px;background:#f5f3f8}.design-preview svg{width:42px;height:42px;color:#55446a}.design-preview svg[viewBox="0 0 160 80"]{width:100%;height:auto}.design-results{gap:14px}.design-filters{margin:10px 0;gap:5px}.design-filters button{padding:6px 9px;font-size:10px;min-height:30px;border-radius:20px}.design-filters button>.tool-icon{display:none}.design-library[data-browsing=false] .design-results,.design-library[data-browsing=false] .design-filters,.design-library[data-browsing=false] .library-back{display:none}.design-library[data-browsing=true] .element-category-grid{display:none}.library-back{border:0;background:transparent;color:#7841ae;padding-left:0;font-size:12px;display:flex;gap:6px;align-items:center;margin:0 0 15px}.library-back .visual-icon{width:16px;height:16px;transform:rotate(180deg)}.element-category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 10px;margin:10px 0 25px}.element-category-grid button{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:11px;background:transparent;border:0;padding:0;min-width:0;text-align:center;min-height:95px}.element-category-grid .visual-icon{width:66px;height:66px;padding:14px;border:3px solid #ffffff80;border-radius:18px;color:#fff;box-shadow:0 6px 10px #52326a19;background:linear-gradient(135deg,#ad60f2,#6545dc);transform:rotate(-3deg)}.element-category-grid [data-color=teal] .visual-icon{background:linear-gradient(135deg,#64d7d7,#0394a9)}.element-category-grid [data-color=blue] .visual-icon{background:linear-gradient(135deg,#72c0f7,#3068de)}.element-category-grid [data-color=orange] .visual-icon{background:linear-gradient(135deg,#ffc775,#f27b38)}.element-category-grid [data-color=pink] .visual-icon{background:linear-gradient(135deg,#f692cf,#bf41a3)}.element-category-grid [data-color=green] .visual-icon{background:linear-gradient(135deg,#75dfb8,#138d69)}.shell-templates{gap:18px}.shell-template{border:0;padding:0;border-radius:12px;grid-template-columns:1fr 1fr;background:white}.shell-template>.visual-thumbnail{grid-column:1/-1;border-width:5px;aspect-ratio:1.5}.shell-template>strong{font-size:13px;margin-top:3px}.shell-template>small{font-size:10px}.shell-template>button{font-size:11px;min-height:35px;padding:7px;display:flex;align-items:center;justify-content:center;gap:5px}.shell-template>button>.visual-icon{width:16px;height:16px}.shell-template>button:last-child{background:#f0e5ff;color:#7b36be;border-color:#f0e5ff}.shell-template>button .tool-icon{display:none}.font-combination-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:25px}.font-combination-grid h3{grid-column:1/-1;font-size:15px;margin:0 0 5px}.font-combination{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:130px;border:0;background:#f5f3f8;padding:12px}.font-combination strong{font-size:23px;line-height:1.1;color:#4d305d}.font-combination small{font-size:10px;color:#85798c}.font-combination[data-font=editorial] strong{font-family:Georgia,serif;font-style:italic;font-size:24px}.font-combination[data-font=friendly] strong{font-family:'Trebuchet MS',sans-serif;color:#8b52b4}.font-combination .tool-icon{display:none}#panel-text>button{font-size:14px;border-radius:12px;text-align:left;padding:13px;margin:10px 0;display:flex;align-items:center;gap:9px;min-height:48px}#panel-text>button[aria-label="Abeeha Write"]{background:#8b3df2;color:white;border:0;justify-content:center}#panel-text .text-heading-card{font-size:26px;font-weight:bold}#panel-text .text-subheading-card{font-size:20px;font-weight:600}#panel-text .tool-icon{display:none}.gallery-images{display:grid;grid-template-columns:1fr 1fr;gap:12px}.gallery-image{padding:0;aspect-ratio:1;border:0;background:#f1f1f6;overflow:hidden;border-radius:12px}.gallery-image img{width:100%;height:100%;object-fit:cover}.gallery-image .tool-icon{display:none}.quick-tool-panel>button{display:flex;align-items:center;gap:10px;width:100%;margin:10px 0;min-height:48px;text-align:left;padding:12px;border-color:#e5deef}.quick-tool-panel>button .visual-icon{color:#8452ba}.quick-tool-panel .tool-icon{display:none}#panel-uploads .upload{background:#8b3df2;color:white;border:0;border-radius:10px;min-height:48px;padding:12px;font-size:13px;text-align:center}#panel-uploads>button{background:white;border-radius:10px;border-color:#ded4e8}#panel-style .design-scope button{font-size:12px;min-height:40px}#panel-style .design-scope [aria-pressed=true]{background:#f0e5ff;border-color:#d9c3ef;color:#7b35b5}.palette-button{border-radius:10px;border:0;background:#f5f3f8;padding:8px}.palette-swatches{height:30px}.palette-button .tool-icon{display:none}.palette-button[aria-pressed=true]{box-shadow:0 0 0 2px #9f6cd9}.context-guide{background:#f6f1fd;color:#776384;padding:10px;font-size:11px}.quick-edit{background:#faf8fc;border-color:#eee7f5;border-radius:12px}body[data-view=edit] .canvas-area{background:#f2f3f8!important;padding:34px 34px 0!important;position:relative;gap:0}body[data-view=edit] #editor{border:0!important;box-shadow:0 5px 24px #37334512;border-radius:0;background:#fff}body[data-view=edit] .canvas-bar{order:3;min-height:45px;display:flex;align-items:center;width:calc(100% + 68px);margin:0 -34px;padding:7px 18px;background:#fff;border-top:1px solid #e5e2ed;gap:12px;font-size:10px}body[data-view=edit] .canvas-bar #template-label{font-size:11px;white-space:nowrap;max-width:150px;overflow:hidden;text-overflow:ellipsis}body[data-view=edit] .canvas-pages{display:flex;align-items:center;gap:6px;border:0;background:transparent;font-size:10px;min-height:30px;padding:4px}body[data-view=edit] .canvas-pages .visual-icon{width:17px;height:17px}body[data-view=edit] .canvas-view{margin-left:auto}body[data-view=edit] .devices button{font-size:10px;border:0;background:transparent;min-height:28px;padding:4px 7px;color:#746779}body[data-view=edit] .devices button[aria-pressed=true]{background:#efe5fc;color:#8142bc}body[data-view=edit] .devices .tool-icon{display:none}body[data-view=edit] .selection-bar{order:2;background:transparent;padding:7px 0;min-height:42px}body[data-view=edit] .selection-bar>button,body[data-view=edit] .selection-bar button{border:0;background:#fff;box-shadow:0 2px 8px #25252c0a;font-size:11px;border-radius:8px;min-height:32px}body[data-view=edit] #editor-more{display:flex;justify-content:center;align-items:center;padding:7px;width:36px;min-height:36px;background:transparent;color:white;border-color:#ffffff26}body[data-view=edit] #editor-more span{display:none}#editor-options{position:absolute;right:16px;top:58px;width:245px;background:#fff;padding:9px;border-radius:12px;box-shadow:0 8px 35px #30223933;border:1px solid #eee6f4;z-index:50}body[data-view=edit][data-editor-menu=open] #editor-options{display:grid;gap:5px}#editor-options button{display:flex;align-items:center;gap:8px;text-align:left;border:0;color:#594269;min-height:44px;padding:10px;font-size:12px}#editor-options .visual-icon{width:19px;height:19px}.publish-dialog,.draft-manager,#studio-help-dialog{border-color:#e3daed!important;border-radius:18px!important;background:#fff!important;color:#25262b!important;box-shadow:0 15px 60px #21182a30}dialog::backdrop{background:#28203455;backdrop-filter:blur(2px)}summary{background:#f5f1fa;border-color:#e8e0f0;color:#6c537f}.gjs-one-bg{background:#fff}.gjs-two-color{color:#38313e}.gjs-four-color,.gjs-four-color-h:hover{color:#9c62dd}body[data-view=details] .onboarding{padding-left:32px}.details-step{margin:auto}
@media(max-width:1100px) and (min-width:761px){.visual-categories{justify-content:flex-start;gap:16px}.project-card-grid,.library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-view=edit] .actions #edit-tools,body[data-view=edit] .actions #edit-selected{display:none}body[data-view=edit] .workspace{grid-template-columns:76px 300px minmax(0,1fr)!important}body[data-view=edit][data-tools=closed] .workspace{grid-template-columns:76px minmax(0,1fr)!important}body[data-view=edit] .canvas-area{padding:22px 18px 0!important}body[data-view=edit] .canvas-bar{width:calc(100% + 36px);margin:0 -18px}.header .studio-nav{gap:12px}}
@media(max-width:760px){.header{min-height:58px;padding:9px 16px;gap:8px;position:sticky}.header .studio-nav{display:none}.header .brand{font-size:12px}.header .brand small{font-size:7px}.header #studio-help-open{margin-left:auto;font-size:11px;padding:7px 9px;min-height:34px}.onboarding{padding:20px 18px 100px;max-width:none}.studio-home-nav{position:fixed;top:auto;bottom:0;width:100%;height:74px;flex-direction:row;justify-content:space-around;align-items:center;padding:4px 6px max(4px,env(safe-area-inset-bottom));border-top:1px solid #e8e1ee;border-right:0;background:#fff;overflow:hidden}.studio-home-nav button{min-width:0;flex:1;width:auto;min-height:60px;font-size:10px;gap:6px;padding:5px 2px;color:#746581}.studio-home-nav button>.visual-icon{width:25px;height:25px}.studio-home-nav [data-home-destination=Create],.studio-home-nav [data-home-destination=Brand],.studio-home-nav [data-home-destination="Abeeha AI"]{display:none}.studio-home-nav [aria-current=page]{background:transparent;color:#7e2dd1}.studio-home-nav [aria-current=page]>.visual-icon{fill:#f1e6ff}.visual-welcome{min-height:218px;padding:25px 14px 20px;border-radius:15px}.visual-welcome>p{font-size:8px;letter-spacing:1.3px;margin-bottom:15px}.visual-welcome h1{font-size:26px!important;letter-spacing:-.8px!important;line-height:1.15;margin-bottom:14px}.workspace-search{padding:3px 12px;height:48px;border-radius:12px}.workspace-search input{font-size:13px}.workspace-search .visual-icon{width:18px;height:18px}.welcome-switch{margin-bottom:16px}.visual-categories{justify-content:flex-start;gap:17px;margin:19px -2px 24px;padding-bottom:9px;scrollbar-width:none}.visual-categories button{min-width:77px;font-size:11px;gap:8px}.visual-categories .visual-icon{width:52px;height:52px;padding:13px}.visual-section-heading{margin-bottom:14px;gap:12px}.visual-section-heading h2{font-size:19px}.visual-section-heading button{font-size:11px;padding:5px}.project-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}.visual-project-card h3{font-size:13px}.visual-project-card>small{font-size:9px}.visual-thumbnail{border-width:5px;border-radius:10px;aspect-ratio:1.45}.project-badge{font-size:8px;padding:3px 5px;top:9px;left:9px}.project-delete{top:9px;right:9px;padding:3px;min-height:24px}.project-delete .visual-icon{width:14px;height:14px}.visual-project-card>button:not(.project-delete){font-size:10px;min-height:31px;padding:5px 7px}.visual-project-card>button .visual-icon{width:13px;height:13px}.empty-projects{padding:18px;gap:10px;display:grid;grid-template-columns:35px 1fr}.empty-projects p{grid-column:1/-1;font-size:12px}.empty-projects strong{font-size:14px}.empty-projects button{grid-column:1/-1;justify-content:center;font-size:12px}.empty-projects>.visual-icon{width:30px;height:30px}.library-heading{margin:24px 0 12px;gap:12px}.library-heading h2{font-size:20px!important}.library-filters{gap:6px;flex-wrap:nowrap;max-width:100%;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}.library-filters button{white-space:nowrap;flex-shrink:0;min-height:30px;font-size:10px;padding:6px 9px}.library-toolbar{grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 16px}.library-toolbar label{font-size:9px;gap:4px}.library-toolbar input,.library-toolbar select{font-size:11px;min-height:40px;padding:8px;max-width:100%;min-width:0}.library-toolbar p{grid-column:1/-1;font-size:10px;margin:0}.library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}.library-card .library-preview{height:auto;aspect-ratio:1.3;border-width:5px;margin-bottom:8px}.library-card .eyebrow{font-size:8px;line-height:1.3;gap:4px}.design-badge{font-size:7px;padding:3px 5px}.library-card h3{font-size:15px;margin:5px 0}.library-card .two{grid-template-columns:1fr;gap:5px}.library-card .two button{min-height:31px;font-size:10px;padding:6px;white-space:nowrap}.library-card .two button .tool-icon{width:12px;height:12px}.library-more{font-size:12px;width:100%}#visual-projects h1,#visual-more h1{font-size:27px}#visual-projects .visual-section-heading{align-items:flex-start}#visual-projects .visual-section-heading>button{background:#8b3df2;color:white;max-width:125px;white-space:normal;font-size:11px;padding:9px}.project-source-tabs button{font-size:12px;padding:8px 12px;flex:1}.more-card-grid{grid-template-columns:1fr 1fr;gap:12px}.more-card-grid button{display:flex;flex-direction:column;justify-content:center;padding:15px;font-size:12px;text-align:center;min-height:105px}body[data-view=details] .onboarding{padding:20px 18px 45px}body[data-view=edit] .header{height:57px;min-height:57px;padding:6px 10px;gap:3px;position:relative}body[data-view=edit] .header .project{display:none}body[data-view=edit] #editor-home{width:33px;height:34px;padding:5px}body[data-view=edit] .header .actions{width:auto;flex:1;justify-content:flex-end;overflow:visible;gap:4px;margin-left:0}body[data-view=edit] .actions button{font-size:0;min-height:34px;width:34px;padding:6px;border:0;background:transparent;border-radius:7px;display:flex;align-items:center;justify-content:center}body[data-view=edit] .actions button span{display:none}body[data-view=edit] .actions .tool-icon{width:22px;height:22px;margin:0}body[data-view=edit] .actions #edit-tools,body[data-view=edit] .actions #edit-selected{display:none}body[data-view=edit] .actions #publish-open{background:transparent;color:white;border:1px solid #ffffff75;border-radius:50%}body[data-view=edit] #editor-more{width:33px;min-height:34px;border:0;padding:5px;margin-left:3px}body[data-view=edit] #editor-more .visual-icon{width:24px;height:24px}#editor-options{top:57px;right:10px;width:245px}body[data-view=edit] .workspace,body[data-view=edit][data-tools=closed] .workspace{grid-template-columns:none!important;padding-bottom:78px;position:relative;display:flex!important}body[data-view=edit] .canvas-area{padding:32px 14px 0!important;background:#f2f3f8!important;gap:0}body[data-view=edit] #editor{min-height:0!important;box-shadow:0 5px 18px #3632470d}body[data-view=edit] .canvas-bar{min-height:39px;width:calc(100% + 28px);margin:0 -14px;padding:4px 8px;gap:5px;flex-wrap:nowrap;font-size:9px}body[data-view=edit] .canvas-bar #template-label{display:none}body[data-view=edit] .canvas-pages span{display:none}body[data-view=edit] .canvas-pages{width:27px;min-height:28px;padding:3px}.canvas-pages .visual-icon{width:19px;height:19px}body[data-view=edit] .devices button{font-size:9px;min-height:27px;padding:4px 5px}body[data-view=edit] #canvas-zoom{font-size:10px;min-height:27px;width:56px;border:0;background:#f6f2fb}body[data-view=edit] .canvas-view{gap:2px}body[data-view=edit] .tool-rail{height:78px;bottom:0;padding:5px 7px max(5px,env(safe-area-inset-bottom));gap:7px;border-top:1px solid #e6e1ed;z-index:20;background:#fff;scrollbar-width:none}body[data-view=edit] .tool-rail button{min-width:68px;min-height:62px;font-size:10px;gap:8px;flex-shrink:0;background:transparent;padding:5px 4px;border-radius:12px}body[data-view=edit] .tool-rail .visual-icon{width:26px;height:26px}body[data-view=edit] .tool-rail [aria-pressed=true]{background:transparent;box-shadow:none;color:#873ce1}body[data-view=edit] .tool-rail [aria-pressed=true] .visual-icon{background:#f4edfc;border-radius:12px;width:37px;height:37px;padding:6px;box-shadow:0 2px 9px #67458d17;filter:none;margin:-5px 0}body[data-view=edit][data-tools=open] .sidebar{position:absolute;top:8px;bottom:78px;left:0;right:0;height:auto!important;max-height:none!important;border-radius:20px 20px 0 0;border:0;box-shadow:0 -4px 20px #30223c17;z-index:18;background:white;padding-top:11px}body[data-view=edit][data-tools=open] .sidebar:before{content:'';width:38px;height:4px;border-radius:4px;background:#d7d5de;position:absolute;top:5px;left:calc(50% - 19px)}body[data-view=edit] .panel-heading{min-height:40px;padding:5px 16px;border:0}body[data-view=edit] .panel-heading strong{font-size:13px}body[data-view=edit] .panel-heading button{font-size:10px}body[data-view=edit] .panel{padding:10px 16px 24px!important}body[data-view=edit] .panel h2{font-size:20px;margin:0 0 12px}body[data-view=edit] .panel input[type=search]{height:52px;min-height:52px;padding:12px 16px;border-radius:14px;font-size:16px;width:100%;margin-bottom:15px}body[data-view=edit] .panel .fine{font-size:12px;line-height:1.5}.element-category-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 12px;margin:12px 0 25px}.element-category-grid button{font-size:12px;min-height:103px;gap:10px}.element-category-grid .visual-icon{width:73px;height:73px;padding:16px;border-radius:18px}.design-results{grid-template-columns:repeat(3,minmax(0,1fr));gap:17px 11px}.design-preview{height:91px}.design-card{font-size:11px}.design-filters{flex-wrap:nowrap;overflow:auto;gap:6px;scrollbar-width:none}.design-filters button{white-space:nowrap;flex-shrink:0;font-size:11px;min-height:32px}.shell-templates{grid-template-columns:1fr 1fr;gap:20px 13px}.shell-template{min-width:0;gap:6px}.shell-template>.visual-thumbnail{aspect-ratio:1.25}.shell-template>strong{font-size:13px}.shell-template>small{font-size:9px}.shell-template>button{grid-column:1/-1;min-height:32px;font-size:10px;padding:5px}.shell-template>button>.visual-icon{width:14px;height:14px}.font-combination-grid{gap:13px;margin-top:22px}.font-combination{min-height:145px}.font-combination strong{font-size:29px}.font-combination[data-font=editorial] strong{font-size:30px}#panel-text>button{min-height:53px;padding:13px;border-radius:12px;font-size:15px}#panel-text .text-heading-card{font-size:27px}#panel-text .text-subheading-card{font-size:21px}#panel-text>button[aria-label="Abeeha Write"]{margin-top:0}.gallery-images{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}body[data-view=edit] .selection-bar{padding:5px 0;min-height:39px;flex-shrink:0}body[data-view=edit] .selection-bar button{font-size:10px;min-height:30px;padding:5px 7px}body[data-view=edit] .selection-bar .tool-icon{width:15px;height:15px;margin-right:3px}.quick-tool-panel{display:grid!important;grid-template-columns:1fr 1fr;gap:12px;align-content:start}.quick-tool-panel h2{grid-column:1/-1}.quick-tool-panel>button{margin:0;min-height:74px;display:flex;flex-direction:column;align-items:center;text-align:center;font-size:12px;gap:8px;background:#faf7fd}.quick-tool-panel[hidden]{display:none!important}.publish-dialog{width:94vw}.publish-toolbar button{font-size:12px}body[data-view=edit] .header #studio-help-open{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

body[data-theme=light],body[data-theme=dark]{background:#fff!important}.onboarding{background:none!important}body[data-view=edit] #editor-home span{display:none}.studio-account-links{display:flex;gap:12px;margin-left:0;font-size:12px}.studio-account-links a{color:#70418e;text-decoration:none;white-space:nowrap}.studio-account-links a:last-child{background:#8b3df2;color:white;padding:7px 12px;border-radius:8px}body[data-view=edit] .studio-account-links{display:none}.header .studio-nav{margin-left:auto!important}
@media(max-width:760px){.header #studio-help-open{display:none}.studio-account-links{margin-left:auto;font-size:11px;gap:10px;align-items:center}.header .brand small{display:none}}

@media(min-width:761px){body[data-view=edit] .header .project{flex-direction:column;align-items:stretch;gap:1px}body[data-view=edit] #save-status{display:block;color:#ffffffbb;font-size:8px;padding-left:9px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}body[data-view=edit] .project input{padding-top:3px;padding-bottom:3px}}

/* Original Pulse Hatch category surfaces: no borrowed UI imagery or exported styles. */
body[data-view=choose] .visual-categories button>.visual-icon{
 width:64px;height:64px;padding:15px;border:1px solid #ffffff8a;border-radius:17px;
 background:linear-gradient(155deg,#ffffff44,transparent 58%),var(--category-colour,#7956d6);
 color:#fff;box-shadow:inset 0 1px #ffffff88,0 6px 13px #2a1f4b1a,2px 2px 0 #ffffff70;
 transition:transform .19s ease,box-shadow .19s ease,filter .19s ease;
}
body[data-view=choose] .visual-categories button:focus-visible,
body[data-view=edit] .element-category-grid button:focus-visible{outline:3px solid #6d4aff;outline-offset:3px}
body[data-view=choose] .visual-categories button:active>.visual-icon,
body[data-view=edit] .element-category-grid button:active>.visual-icon{transform:scale(.96);filter:brightness(.97)}
body[data-view=edit] .element-category-grid button>.visual-icon{
 transform:none;border-radius:17px;box-shadow:inset 0 1px #ffffff7a,0 7px 18px #25204420;
 transition:transform .19s ease,box-shadow .19s ease,filter .19s ease;
}
body[data-view=edit] .library-back{min-height:44px;gap:8px;font-size:13px;font-weight:650}
body[data-view=edit] .library-back .visual-icon{width:19px;height:19px;transform:none}
body[data-view=edit] .design-library .design-card{transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
body[data-view=edit] .design-filters button[aria-pressed=true]{background:#ece7ff;color:#39269c;border-color:#9988e9;font-weight:700}
body[data-view=edit] .selection-bar [aria-pressed=true]{box-shadow:inset 0 -3px #6d4aff}
body[data-view=edit] .header .brand .mark{box-shadow:0 2px 7px #5637ac24,inset 0 1px #fff5;transition:box-shadow .19s ease}
body :is(#studio-help-dialog,#publish-dialog){height:auto;max-height:min(85dvh,700px);overflow:auto}
@media(hover:hover) and (pointer:fine){
 body[data-view=choose] .visual-categories button:hover>.visual-icon,
 body[data-view=edit] .element-category-grid button:hover>.visual-icon{transform:translateY(-3px);box-shadow:inset 0 1px #ffffff9c,0 12px 22px #27214b29}
 body[data-view=edit] .design-library .design-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px #2b1f4b15}
}
@media(max-width:760px){
 body[data-view=choose] .visual-categories button>.visual-icon{width:56px;height:56px;padding:13px;border-radius:16px}
 body[data-view=edit] .element-category-grid button>.visual-icon{width:63px;height:63px}
}
@media(prefers-reduced-motion:reduce){
 body[data-view=choose] .visual-categories button>.visual-icon,
 body[data-view=edit] .element-category-grid button>.visual-icon,
 body[data-view=edit] .design-library .design-card,
 body[data-view=edit] .header .brand .mark{transition:none!important;transform:none!important}
}

/* Studio-only interface tokens; exported user documents remain outside these selectors. */
body[data-view=choose],body[data-view=edit]{
 --ph-ui-violet:#6d4aff;--ph-ui-teal:#087f83;--ph-ui-ink:#202638;
 --ph-ui-muted:#606a7d;--ph-ui-surface:#fff;--ph-ui-well:#f5f6fa;
 --ph-ui-border:#e3e6ef;--ph-ui-selected:#eee9ff;--ph-ui-radius:12px;
 --ph-ui-focus:0 0 0 3px #6d4aff52;
}
body[data-view=choose] :is(.studio-home-nav,.visual-recent,.visual-projects,.visual-more),
body[data-view=edit] :is(.sidebar,.panel-heading,.tool-rail){border-color:var(--ph-ui-border)}
body[data-view=edit] .sidebar{background:var(--ph-ui-surface);color:var(--ph-ui-ink)}
body[data-view=edit] .tool-rail{background:var(--ph-ui-surface)}
body[data-view=edit] .panel-heading{background:var(--ph-ui-well)}
body[data-view=edit] :is(.panel-heading,.panel) h2{letter-spacing:-.015em}
body[data-view=edit] :is(.shell-template,.design-card){border-color:var(--ph-ui-border);border-radius:var(--ph-ui-radius)}
body[data-view=edit] :is(.tool-rail,.selection-bar,.panel-heading) button:not(:disabled):active{filter:brightness(.97)}
body[data-view=edit] :is(.tool-rail,.selection-bar) button[aria-pressed=true]{color:#39269c;background:var(--ph-ui-selected)}
body[data-view=edit] .selection-bar button:disabled{opacity:.46;cursor:not-allowed}
body[data-view=edit] .selection-bar[data-object-kind=none] button{pointer-events:none}
body[data-view=edit] .selection-bar button[aria-label=Delete],
body[data-view=edit] .selection-bar #remove{color:#a32d41}
body[data-view=edit] :is(.panel input,.panel select,.panel textarea,.panel button):focus-visible{outline:3px solid var(--ph-ui-violet);outline-offset:2px}
body[data-view=edit] .element-category-grid button{min-height:105px}
body[data-view=edit] .element-category-grid button>.visual-icon{position:relative}
#studio-signin-dialog{
 width:min(440px,calc(100vw - 28px))!important;max-width:calc(100vw - 28px)!important;
 height:auto!important;min-height:0!important;max-height:min(85dvh,600px)!important;
 padding:0!important;overflow:auto!important;border-radius:16px;
 border:1px solid #e3e6ef!important;background:#fff!important;color:#202638!important;
}
#studio-signin-dialog .ph-dialog-body{max-height:calc(85dvh - 70px);overflow:auto}
#studio-signin-dialog :is(a,button){min-height:44px}
#studio-signin-dialog .ph-dialog-header{display:flex;align-items:center;gap:8px}
#studio-signin-dialog .ph-dialog-header strong{flex:1}
@media(max-width:760px){
 body[data-view=edit] .panel-heading{padding-left:14px;padding-right:14px}
 body[data-view=edit] .selection-bar{padding:6px 2px}
 body[data-view=edit] .selection-bar button{min-width:44px;min-height:44px}
 body[data-view=edit] .panel :is(input,textarea,select){font-size:16px}
 #studio-signin-dialog{margin:auto}
}
@media(prefers-reduced-motion:reduce){
 body[data-view=edit] :is(.shell-template,.design-card,.element-category-grid button) {animation:none!important;transition:none!important}
}

/* UI/UX controls share the same Studio chrome without recolouring screen frames. */
body[data-view=edit] :is(.uiux-controls,.site-pages){
 border:1px solid var(--ph-ui-border,#e3e6ef);border-radius:12px;
 background:var(--ph-ui-surface,#fff);color:var(--ph-ui-ink,#202638);
}
body[data-view=edit] :is(.uiux-controls,.site-pages)>summary{background:var(--ph-ui-well,#f5f6fa);border:0;color:var(--ph-ui-ink,#202638);border-radius:11px}
body[data-view=edit] :is(.uiux-controls,.site-pages) :is(input,select,button){max-width:100%;border-radius:9px}
body[data-view=edit] :is(.uiux-controls,.site-pages) button:focus-visible{outline:3px solid #6d4aff;outline-offset:2px}
body[data-view=edit] :is(.uiux-controls,.site-pages) button[disabled]{opacity:.48;cursor:not-allowed}
@keyframes ph-studio-category-appear{from{opacity:.7;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){
 body[data-view=choose] .ph-create-category>.visual-icon{animation:ph-studio-category-appear .2s ease-out both}
}
@media(hover:hover) and (pointer:fine){
 body[data-view=edit] .header .brand:hover .mark{box-shadow:0 3px 12px #6d4aff30,inset 0 1px #fff7}
}
@media(max-width:760px){body[data-view=edit] :is(.uiux-controls,.site-pages) :is(button,select){min-height:44px}}


/* Studio home 2026-10-13: original lightweight layered 3D cards. The public PH header,
   footer, existing welcome hero, editor and native actions remain untouched. */
body[data-view=choose] .onboarding{width:100%;max-width:1680px}
body[data-view=choose] :is(.ph-home-featured,.ph-home-categories,.ph-home-gallery,.ph-home-popular,.visual-recent){
 margin-block:0 36px;min-width:0;position:relative
}
body[data-view=choose] .ph-home-featured .visual-section-heading,
body[data-view=choose] .ph-home-categories .visual-section-heading,
body[data-view=choose] .ph-home-popular .visual-section-heading{margin:0 0 18px}
body[data-view=choose] .ph-home-featured .visual-section-heading h2,
body[data-view=choose] .ph-home-categories .visual-section-heading h2,
body[data-view=choose] .ph-home-popular .visual-section-heading h2{
 color:#183c30;font-size:clamp(20px,2vw,27px);letter-spacing:-.025em;line-height:1.2
}
body[data-view=choose] .ph-home-featured .visual-section-heading button{
 border:1px solid #d3e6d9;background:#fff;color:#167650;border-radius:30px;
 padding:8px 12px;min-height:38px;font-weight:650;font-size:12px
}
body[data-view=choose] .visual-recent{margin-top:6px}
body[data-view=choose] :is(.ph-feature-track,.ph-popular-track){
 display:grid;grid-auto-flow:column;grid-auto-columns:minmax(210px,1fr);
 gap:16px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;
 padding:6px 5px 20px;scrollbar-width:thin
}
body[data-view=choose] .ph-feature-card{
 min-width:0;position:relative;display:flex;flex-direction:column;gap:7px;
 background:#fff;border:1px solid #dbece3;border-radius:20px;padding:13px;
 box-shadow:0 3px 0 #dce9e1,0 12px 28px #2246320d;
 scroll-snap-align:start;isolation:isolate;
 transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease
}
body[data-view=choose] .ph-feature-card .visual-thumbnail{
 border:6px solid #e9f2ec;aspect-ratio:1.5;border-radius:13px;
 box-shadow:2px 3px 0 #cadacf,0 10px 18px #24442d17;
 margin:0 0 9px;transform:perspective(600px) rotateX(1.5deg);
 transition:transform .22s ease,box-shadow .22s ease
}
body[data-view=choose] .ph-feature-card h3{margin:0;font-size:14px;color:#193b2d;line-height:1.35}
body[data-view=choose] .ph-feature-card small{
 font-size:11px;line-height:1.4;color:#5e7165;flex:1
}
body[data-view=choose] .ph-feature-open{
 background:#e3f5e9;color:#086b43;border:1px solid #c4e5d0;
 padding:8px 10px;border-radius:10px;font-size:12px;min-height:38px;
 font-weight:700;text-align:center;cursor:pointer
}
/* Category cards use the native icon as a foreground shape over two original CSS sheets. */
body[data-view=choose] .ph-home-categories .visual-categories{
 display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;
 margin:0;overflow:visible;padding:4px 3px 14px
}
body[data-view=choose] .ph-home-categories .visual-categories button{
 --ph-card-bg:#e8e2fc;--ph-art-color:#7956d6;
 display:flex;align-items:center;justify-content:space-between;
 position:relative;isolation:isolate;overflow:hidden;min-width:0;min-height:116px;
 width:100%;margin:0;padding:18px 15px;
 background:var(--ph-card-bg);border:1px solid #ffffffba;border-radius:19px;
 box-shadow:0 3px 0 #22392e12,0 12px 24px #23433212;
 text-align:left;color:#213b32;cursor:pointer;
 transition:transform .23s ease,box-shadow .23s ease
}
body[data-view=choose] .ph-home-categories .visual-categories [data-color=pink]{--ph-card-bg:#fce0eb;--ph-art-color:#c94583}
body[data-view=choose] .ph-home-categories .visual-categories [data-color=orange]{--ph-card-bg:#ffe6d5;--ph-art-color:#cc7541}
body[data-view=choose] .ph-home-categories .visual-categories [data-color=blue]{--ph-card-bg:#dceafa;--ph-art-color:#3a7fc7}
body[data-view=choose] .ph-home-categories .visual-categories [data-color=green]{--ph-card-bg:#d6f4e7;--ph-art-color:#15946a}
body[data-view=choose] .ph-home-categories .visual-categories [data-color=teal]{--ph-card-bg:#d2f1f4;--ph-art-color:#188e9e}
body[data-view=choose] .ph-home-categories .visual-categories [data-color=gray]{--ph-card-bg:#e5f0e7;--ph-art-color:#397e5c}
body[data-view=choose] .ph-home-categories .visual-categories button::before,
body[data-view=choose] .ph-home-categories .visual-categories button::after{
 content:"";position:absolute;width:63px;height:68px;border-radius:12px;pointer-events:none;
 border:2px solid #ffffffd9;right:22px;top:25px;
 background:linear-gradient(155deg,#fffffff7 0%,#ffffff91 38%,#ffffff44 100%);
 box-shadow:0 7px 12px #14382a27;transform:rotate(13deg);z-index:0;
 transition:transform .22s ease
}
body[data-view=choose] .ph-home-categories .visual-categories button::after{
 right:33px;top:19px;width:66px;height:72px;
 background:linear-gradient(135deg,#ffffffd5 0%,var(--ph-card-bg) 85%);
 transform:rotate(-12deg);z-index:1;box-shadow:0 5px 12px #14382a20
}
body[data-view=choose] .ph-home-categories .visual-categories button>.visual-icon{
 flex:none;width:51px;height:51px;position:relative;z-index:2;margin:0 10px 0 auto;
 padding:11px;border:1px solid #ffffffaa;border-radius:14px;
 background:linear-gradient(155deg,#ffffffd7,#ffffff9f)!important;
 color:var(--ph-art-color)!important;
 box-shadow:inset 0 1px #fff,0 8px 13px #13382823;
 transform:rotate(-7deg) translateY(-3px);filter:none;
 transition:transform .22s ease
}
body[data-view=choose] .ph-home-categories .visual-categories button>span:last-child{
 order:-1;position:relative;z-index:3;min-width:0;max-width:55%;
 white-space:normal;overflow-wrap:anywhere;text-align:left;font-size:13px;
 line-height:1.35;font-weight:750;color:#19372d
}
/* Native project cards and gallery cards share the same depth treatment. */
body[data-view=choose] .visual-project-card,
body[data-view=choose] .ph-home-gallery .library-card{
 background:#fff;border:1px solid #dcece3;border-radius:18px;padding:12px;
 box-shadow:0 3px 0 #e2ece6,0 11px 23px #1e432c12;
 isolation:isolate;transition:transform .22s ease,box-shadow .22s ease
}
body[data-view=choose] .visual-project-card .visual-thumbnail,
body[data-view=choose] .ph-home-gallery .library-card .library-preview{
 border:6px solid #ecf3ed;border-radius:13px;
 box-shadow:2px 3px 0 #cbded1,0 7px 15px #204b311a;
 transform:perspective(700px) rotateX(1.2deg);
 transition:transform .22s ease,box-shadow .22s ease
}
body[data-view=choose] .ph-home-gallery .library-grid{
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px
}
body[data-view=choose] .ph-home-gallery .library-heading{margin-top:4px}
body[data-view=choose] .ph-home-gallery .library-card h3{font-size:15px}
body[data-view=choose] .ph-popular-track{grid-auto-columns:minmax(170px,1fr)}
body[data-view=choose] .ph-popular-card{
 --ph-art:#219365;position:relative;isolation:isolate;display:flex;flex-direction:column;
 justify-content:flex-end;align-items:flex-start;gap:8px;overflow:hidden;
 min-height:159px;min-width:0;padding:13px;border-radius:18px;
 border:1px solid #dfebe4;background:linear-gradient(145deg,#f5faf6,#e2f5e8);
 box-shadow:0 3px 0 #dce9e0,0 12px 23px #20402b11;cursor:pointer;
 transition:transform .22s ease,box-shadow .22s ease
}
body[data-view=choose] .ph-popular-card:nth-child(2){background:linear-gradient(145deg,#f9f0fb,#ede1f9);--ph-art:#9754c4}
body[data-view=choose] .ph-popular-card:nth-child(3){background:linear-gradient(145deg,#fff1e2,#ffe2c9);--ph-art:#ce8643}
body[data-view=choose] .ph-popular-card:nth-child(4){background:linear-gradient(145deg,#e9f1fb,#d7e6fc);--ph-art:#397bbb}
body[data-view=choose] .ph-popular-card:nth-child(5){background:linear-gradient(145deg,#e5f9f9,#d1eff0);--ph-art:#158b91}
body[data-view=choose] .ph-popular-card::before,
body[data-view=choose] .ph-popular-card::after{
 content:"";position:absolute;top:14px;right:37px;width:66px;height:72px;
 border-radius:11px;background:#fff9;border:2px solid #fff;
 box-shadow:0 7px 14px #21442c22;transform:rotate(13deg);z-index:0;
 transition:transform .22s ease;pointer-events:none
}
body[data-view=choose] .ph-popular-card::after{
 right:48px;top:19px;transform:rotate(-12deg);
 background:linear-gradient(150deg,#fff,var(--ph-art));opacity:.52
}
body[data-view=choose] .ph-popular-card>.visual-icon{
 position:relative;z-index:1;width:40px;height:40px;align-self:flex-end;
 margin:4px 23px 17px 0;padding:8px;color:var(--ph-art);
 background:#ffffffe6;border-radius:11px;box-shadow:0 5px 12px #28503922
}
body[data-view=choose] .ph-popular-card>span{position:relative;z-index:2;color:#1d4431;font-size:13px;font-weight:700}
@media(hover:hover) and (pointer:fine){
 body[data-view=choose] :is(.ph-feature-card,.visual-project-card,.ph-home-gallery .library-card,.ph-popular-card):hover{
  transform:translateY(-4px);box-shadow:0 5px 0 #d4e6dc,0 17px 29px #1b453123
 }
 body[data-view=choose] :is(.ph-feature-card:hover .visual-thumbnail,.visual-project-card:hover .visual-thumbnail,.ph-home-gallery .library-card:hover .library-preview){
  transform:perspective(700px) rotateX(0) translateY(-2px);box-shadow:3px 5px 0 #c4ddcf,0 12px 19px #244b3026
 }
 body[data-view=choose] .ph-home-categories .visual-categories button:hover{
  transform:translateY(-4px);box-shadow:0 5px 0 #22392e12,0 17px 30px #23433220
 }
 body[data-view=choose] .ph-home-categories .visual-categories button:hover::before{transform:rotate(17deg) translate(3px,-4px)}
 body[data-view=choose] .ph-home-categories .visual-categories button:hover::after{transform:rotate(-16deg) translate(-3px,-6px)}
 body[data-view=choose] .ph-home-categories .visual-categories button:hover>.visual-icon{transform:rotate(-3deg) translate(2px,-7px)}
 body[data-view=choose] .ph-popular-card:hover::before{transform:rotate(18deg) translateY(-5px)}
 body[data-view=choose] .ph-popular-card:hover::after{transform:rotate(-17deg) translateY(-6px)}
}
body[data-view=choose] :is(.ph-feature-open,.ph-popular-card,.ph-home-categories button):focus-visible{outline:3px solid #188358;outline-offset:3px}
@media(max-width:1150px){
 body[data-view=choose] .ph-home-categories .visual-categories{grid-template-columns:repeat(3,minmax(0,1fr))}
 body[data-view=choose] .ph-home-gallery .library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
 body[data-view=choose] :is(.ph-home-featured,.ph-home-categories,.ph-home-gallery,.ph-home-popular,.visual-recent){margin-bottom:27px}
 body[data-view=choose] .ph-home-categories .visual-categories{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 body[data-view=choose] .ph-home-categories .visual-categories button{min-height:105px;padding:12px 10px}
 body[data-view=choose] .ph-home-categories .visual-categories button>span:last-child{font-size:12px;max-width:55%}
 body[data-view=choose] .ph-home-categories .visual-categories button>.visual-icon{width:42px;height:42px;padding:9px;margin-right:2px}
 body[data-view=choose] .ph-home-categories .visual-categories button::before{width:43px;height:51px;right:10px}
 body[data-view=choose] .ph-home-categories .visual-categories button::after{width:45px;height:52px;right:18px}
 body[data-view=choose] :is(.ph-feature-track,.ph-popular-track){grid-auto-columns:minmax(195px,75%);gap:12px}
 body[data-view=choose] .ph-home-gallery .library-grid{grid-template-columns:minmax(0,1fr)}
 body[data-view=choose] .ph-home-featured .visual-section-heading button{font-size:11px;padding:6px 8px}
}
@media(prefers-reduced-motion:reduce){
 body[data-view=choose] :is(.ph-feature-card,.ph-feature-card .visual-thumbnail,.ph-popular-card,.ph-popular-card::before,.ph-popular-card::after,.visual-project-card,.visual-project-card .visual-thumbnail,.ph-home-gallery .library-card,.ph-home-gallery .library-preview,.ph-home-categories .visual-categories button,.ph-home-categories .visual-categories button::before,.ph-home-categories .visual-categories button::after,.ph-home-categories .visual-categories button>.visual-icon){transition:none!important;animation:none!important}
 body[data-view=choose] :is(.ph-feature-card,.ph-popular-card,.visual-project-card,.ph-home-gallery .library-card,.ph-home-categories .visual-categories button):hover{transform:none}
}


/* Studio home browsing iteration: compact real format shortcuts, two-row layered tiles,
   arrow navigation and preserved real templates. Scoped to choose view only. */
body[data-view=choose] .visual-welcome .welcome-switch{margin:0 auto 20px}
body[data-view=choose] .visual-welcome>.workspace-search{display:flex!important;visibility:visible!important;opacity:1!important;max-width:min(810px,100%);margin:20px auto 0;background:#fff}
body[data-view=choose] .visual-welcome .workspace-search-button{min-height:38px}
body[data-view=choose] .visual-welcome{height:auto;min-height:265px;padding:25px 24px 26px}
body[data-view=choose] .ph-home-quick-formats{margin:10px 0 24px;min-width:0}
body[data-view=choose] .ph-home-quick-formats .ph-category-scroll{display:flex;gap:7px;width:100%;min-width:0;align-items:center;position:relative}
body[data-view=choose] .ph-home-quick-formats .visual-categories{
 display:flex!important;flex-direction:row!important;justify-content:flex-start!important;
 flex:1!important;gap:10px!important;width:100%;margin:0!important;
 padding:7px 0 9px!important;overflow-x:auto!important;overflow-y:hidden!important;
 scrollbar-width:none!important;scroll-behavior:smooth;
}
body[data-view=choose] .ph-home-quick-formats .visual-categories::-webkit-scrollbar,
body[data-view=choose] :is(.ph-browse-track,.ph-popular-track)::-webkit-scrollbar{display:none!important;width:0;height:0}
body[data-view=choose] .ph-home-quick-formats .visual-categories button{
 width:82px!important;min-width:82px!important;flex:0 0 82px!important;min-height:84px!important;
 display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;
 padding:4px 2px!important;margin:0!important;border:0!important;background:transparent!important;
 box-shadow:none!important;color:#314339!important;border-radius:11px!important;
 gap:7px!important;white-space:normal!important;
}
body[data-view=choose] .ph-home-quick-formats .visual-categories button .visual-icon{
 width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;
 padding:12px!important;box-sizing:border-box!important;
 color:#fff!important;border:2px solid #ffffffb0!important;border-radius:50%!important;
 background:var(--category-colour,#277c9b)!important;
 box-shadow:inset 0 1px 1px #ffffff60,0 3px 9px #16462e22!important;
 transform:none!important;filter:none!important;
}
body[data-view=choose] .ph-home-quick-formats .visual-categories button>span:last-child{
 order:0!important;max-width:100%!important;font-size:10px!important;line-height:1.25!important;
 font-weight:600!important;text-align:center!important;white-space:normal!important;
 color:#34483e!important;
}
body[data-view=choose] .ph-home-quick-formats .visual-categories button::before,
body[data-view=choose] .ph-home-quick-formats .visual-categories button::after{display:none!important}
body[data-view=choose] .ph-home-quick-formats .ph-category-arrow{
 flex:none;width:31px;min-width:31px;height:40px;min-height:40px;border:1px solid #c9e4d5;
 border-radius:50%;background:#fff;color:#146848;font-size:23px;box-shadow:0 3px 12px #15432a14
}
body[data-view=choose] .ph-home-quick-formats .ph-create-hint{display:none}
body[data-view=choose] .visual-recent{margin:12px 0 27px}
body[data-view=choose] .ph-home-gallery{padding-top:0}
body[data-view=choose] .ph-home-categories{margin:0 0 24px!important}
body[data-view=choose] .ph-home-categories .visual-section-heading{margin:0 0 15px;display:flex;align-items:center;justify-content:space-between}
body[data-view=choose] .ph-home-categories .visual-section-heading h2{font-size:clamp(20px,2.2vw,27px)}
body[data-view=choose] .ph-browse-track{
 display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,minmax(82px,1fr));
 grid-auto-columns:calc((100% - 48px) / 4);column-gap:16px;row-gap:13px;
 overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-behavior:smooth;
 scrollbar-width:none;padding:5px 4px 14px;min-width:0
}
body[data-view=choose] .ph-browse-card{
 --ph-browse-bg:#e9e0fa;--ph-browse-ink:#8052bc;
 position:relative;isolation:isolate;min-width:0;min-height:83px;
 display:flex;align-items:center;justify-content:space-between;text-align:left;
 padding:12px 13px;overflow:hidden;border:1px solid #ffffffba;
 border-radius:16px;background:var(--ph-browse-bg);cursor:pointer;scroll-snap-align:start;
 box-shadow:0 3px 0 #d7e6da,0 8px 17px #1e402b10;
 transition:transform .22s ease,box-shadow .22s ease
}
body[data-view=choose] .ph-browse-card[data-tone=pink]{--ph-browse-bg:#f9ddea;--ph-browse-ink:#c13b88}
body[data-view=choose] .ph-browse-card[data-tone=peach]{--ph-browse-bg:#ffe3d4;--ph-browse-ink:#c96334}
body[data-view=choose] .ph-browse-card[data-tone=mint]{--ph-browse-bg:#d7f1e3;--ph-browse-ink:#168159}
body[data-view=choose] .ph-browse-card[data-tone=blue]{--ph-browse-bg:#ddecfb;--ph-browse-ink:#347abe}
body[data-view=choose] .ph-browse-card[data-tone=teal]{--ph-browse-bg:#cff2f3;--ph-browse-ink:#11898c}
body[data-view=choose] .ph-browse-card[data-tone=butter]{--ph-browse-bg:#fff1c7;--ph-browse-ink:#b98617}
body[data-view=choose] .ph-browse-card[data-tone=rose]{--ph-browse-bg:#ffe1eb;--ph-browse-ink:#bf4670}
body[data-view=choose] .ph-browse-card strong{
 z-index:3;position:relative;font-size:12px;line-height:1.33;color:#22382e;font-weight:700;
 max-width:56%;overflow-wrap:anywhere
}
body[data-view=choose] .ph-browse-art{position:relative;display:block;width:76px;height:63px;flex:none;margin-right:-3px;perspective:400px}
body[data-view=choose] .ph-browse-layer{
 position:absolute;display:grid;place-items:center;width:53px;height:56px;top:4px;right:6px;
 border:2px solid #fff;border-radius:9px;box-shadow:0 5px 9px #24452a25;
 transition:transform .22s ease,box-shadow .22s ease
}
body[data-view=choose] .ph-browse-back{background:#ffffff95;transform:rotate(15deg) translate(5px,3px);right:0}
body[data-view=choose] .ph-browse-front{background:linear-gradient(145deg,#fff,var(--ph-browse-bg));transform:rotate(-8deg);right:19px}
body[data-view=choose] .ph-browse-layer svg{width:27px;height:27px;color:var(--ph-browse-ink)}
body[data-view=choose] .ph-browse-back svg{width:18px;height:18px;opacity:.5}
body[data-view=choose] .ph-browse-card[aria-pressed=true]{outline:2px solid #188354;outline-offset:-2px}
body[data-view=choose] .ph-shelf-controls{display:flex;gap:7px;align-items:center;flex-shrink:0}
body[data-view=choose] .ph-shelf-controls[hidden]{display:none}
body[data-view=choose] .ph-shelf-arrow{
 display:grid;place-items:center;width:37px;height:37px;min-height:37px;
 background:#fff;border:1px solid #d2e7d8;border-radius:50%;
 color:#146848;font-size:26px;line-height:1;cursor:pointer;box-shadow:0 4px 12px #133a2c12
}
body[data-view=choose] .ph-shelf-arrow:disabled{opacity:.32;cursor:default}
body[data-view=choose] .ph-popular-track{
 grid-auto-columns:minmax(175px,22%);scrollbar-width:none;scroll-behavior:smooth;
}
body[data-view=choose] .ph-template-shortcuts{display:none;gap:10px;flex-wrap:wrap;margin:12px 0 20px}
body[data-view=choose] .ph-template-shortcuts button{
 color:#164c36;background:#edf8f0;border:1px solid #cbe8d4;border-radius:24px;
 padding:8px 13px;min-height:37px;font-size:12px;font-weight:650
}
body[data-view=choose][data-studio-home=templates] .ph-template-shortcuts{display:flex}
body[data-view=choose][data-studio-home=templates] :is(.ph-home-quick-formats,.ph-home-categories,.ph-home-popular){display:none}
body[data-view=choose][data-studio-home=home] .ph-home-quick-formats{display:block}
body[data-view=choose] .ph-home-featured{display:none!important}
body[data-view=choose] .ph-home-gallery .library-grid{gap:18px}
body[data-view=choose] .ph-browse-card:focus-visible,
body[data-view=choose] .ph-shelf-arrow:focus-visible{outline:3px solid #158958;outline-offset:2px}
@media(hover:hover) and (pointer:fine){
 body[data-view=choose] .ph-browse-card:hover{transform:translateY(-3px);box-shadow:0 5px 0 #d4e7da,0 13px 25px #1c47301c}
 body[data-view=choose] .ph-browse-card:hover .ph-browse-back{transform:rotate(18deg) translate(7px,-3px)}
 body[data-view=choose] .ph-browse-card:hover .ph-browse-front{transform:rotate(-12deg) translate(-3px,-5px)}
}
@media(max-width:900px){
 body[data-view=choose] .ph-browse-track{grid-auto-columns:calc((100% - 16px) / 2);column-gap:14px}
 body[data-view=choose] .ph-browse-card strong{font-size:11px}
}
@media(max-width:600px){
 body[data-view=choose] .ph-browse-track{grid-auto-columns:calc((100% - 12px) / 2);column-gap:10px;row-gap:10px}
 body[data-view=choose] .ph-browse-card{padding:10px 8px;min-height:84px}
 body[data-view=choose] .ph-browse-card strong{font-size:10px;max-width:56%}
 body[data-view=choose] .ph-browse-art{width:51px;height:53px}
 body[data-view=choose] .ph-browse-layer{width:35px;height:41px}
 body[data-view=choose] .ph-browse-front{right:10px}
 body[data-view=choose] .ph-browse-layer svg{width:20px;height:20px}
 body[data-view=choose] .ph-home-quick-formats .visual-categories button{width:72px!important;min-width:72px!important;flex-basis:72px!important}
 body[data-view=choose] .ph-home-quick-formats .visual-categories button .visual-icon{width:45px!important;height:45px!important;min-width:45px!important;min-height:45px!important}
 body[data-view=choose] .visual-welcome{padding:20px 14px}
}
@media(prefers-reduced-motion:reduce){
 body[data-view=choose] :is(.ph-browse-card,.ph-browse-layer,.ph-popular-track,.ph-browse-track){transition:none!important;scroll-behavior:auto!important}
 body[data-view=choose] .ph-browse-card:hover{transform:none}
}


/* 2026-10-13: Small original colourful layered filters for BOTH native
   Explore templates buttons and Templates-tab quick shortcuts.
   CSS masks survive dynamic filter-count textContent updates in onboarding.js. */
body[data-view=choose] :is(.ph-template-shortcuts,.library-filters) {
  align-items:center;flex-wrap:wrap;gap:9px;
  max-width:100%;overflow:visible!important;scrollbar-width:none;
}
body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button){
  --ph-filter-bg:#e7f3ed;--ph-filter-ink:#187955;--ph-filter-edge:#d1e9d9;
  box-sizing:border-box;position:relative;display:inline-flex;align-items:center;justify-content:center;
  gap:8px;min-height:39px!important;padding:7px 12px!important;margin:0;
  border:1px solid #ffffffc9!important;border-radius:15px!important;
  background:var(--ph-filter-bg)!important;color:#1b3a2d!important;
  box-shadow:0 3px 0 var(--ph-filter-edge),0 6px 11px #173b2d12!important;
  font-size:12px!important;font-weight:700!important;line-height:1.25!important;
  white-space:nowrap!important;cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease!important;
}
body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button)::before{
  content:"";display:block;flex:none;width:20px;height:20px;
  background:var(--ph-filter-ink);
  -webkit-mask-image:var(--ph-filter-icon);
  mask-image:var(--ph-filter-icon);
  -webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  filter:drop-shadow(1px 2px 1px #12392326);
  transform:rotate(-4deg);
  transition:transform .2s ease;
}
body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button)[aria-pressed=true]{
  outline:2px solid var(--ph-filter-ink);outline-offset:1px;
}
body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button):focus-visible{
  outline:3px solid #158654!important;outline-offset:3px;
}
@media (hover:hover) and (pointer:fine){
 body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button):hover{
  transform:translateY(-2px)!important;
  box-shadow:0 5px 0 var(--ph-filter-edge),0 9px 17px #173b2d1f!important;
 }
 body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button):hover::before{
  transform:rotate(4deg) scale(1.08);
 }
}
@media(max-width:760px){
 body[data-view=choose] :is(.ph-template-shortcuts,.library-filters){gap:8px!important}
 body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button){
  min-height:37px!important;padding:7px 9px!important;font-size:11px!important;
  border-radius:13px!important;gap:6px
 }
 body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button)::before{width:18px;height:18px}
}
@media(prefers-reduced-motion:reduce){
 body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button),
 body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button)::before{
  transition:none!important
 }
 body[data-view=choose] :is(.ph-template-shortcuts button,.library-filters button):hover{transform:none!important}
}
body[data-view=choose] .library-filters button[data-library-filter="all"],
body[data-view=choose] .ph-template-shortcuts button[data-library-shortcut="all"]{--ph-filter-bg:#e4e6ff;--ph-filter-ink:#6850bc;--ph-filter-edge:#cec9ed;--ph-filter-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l9%205-9%205-9-5%209-5z%20M3%2012l9%205%209-5%20M3%2016l9%205%209-5%22%2F%3E%3C%2Fsvg%3E")}
body[data-view=choose] .library-filters button[data-library-filter="business"],
body[data-view=choose] .ph-template-shortcuts button[data-library-shortcut="business"]{--ph-filter-bg:#d8f3e7;--ph-filter-ink:#13845c;--ph-filter-edge:#b5ddcc;--ph-filter-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%207h18v14H3z%20M8%207V3h8v4%20M3%2012h18%20M10%2012v3h4v-3%22%2F%3E%3C%2Fsvg%3E")}
body[data-view=choose] .library-filters button[data-library-filter="portfolio"],
body[data-view=choose] .ph-template-shortcuts button[data-library-shortcut="portfolio"]{--ph-filter-bg:#fce4ed;--ph-filter-ink:#c03c85;--ph-filter-edge:#eac3d6;--ph-filter-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%205h7l2%203h9v12H3z%20M3%2012h18%22%2F%3E%3C%2Fsvg%3E")}
body[data-view=choose] .library-filters button[data-library-filter="student"],
body[data-view=choose] .ph-template-shortcuts button[data-library-shortcut="student"]{--ph-filter-bg:#ddecff;--ph-filter-ink:#326dc3;--ph-filter-edge:#c4d6ee;--ph-filter-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%202h10l4%204v16H5z%20M15%202v5h4%20M8%2011h8%20M8%2015h8%20M8%2019h5%22%2F%3E%3C%2Fsvg%3E")}
body[data-view=choose] .library-filters button[data-library-filter="construction"],
body[data-view=choose] .ph-template-shortcuts button[data-library-shortcut="construction"]{--ph-filter-bg:#ffecdb;--ph-filter-ink:#bd7132;--ph-filter-edge:#ebd3bf;--ph-filter-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%203h18v5H3z%20M3%2011h10v10H3z%20M16%2011h5v10h-5z%22%2F%3E%3C%2Fsvg%3E")}
body[data-view=choose] .library-filters button[data-library-filter="tools"],
body[data-view=choose] .ph-template-shortcuts button[data-library-shortcut="tools"]{--ph-filter-bg:#e0f3ef;--ph-filter-ink:#138a89;--ph-filter-edge:#c0e1dc;--ph-filter-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l2.5%206.5L21%2012l-6.5%202.5L12%2021l-2.5-6.5L3%2012l6.5-2.5z%22%2F%3E%3C%2Fsvg%3E")}


/* PR #105: Fix duplicate Templates shortcuts and give the editor's existing
   Elements category buttons subtle layered depth. No editor/asset/gallery logic. */
body[data-view=choose] .ph-template-shortcuts button{
  gap:6px!important;
  padding-inline:10px!important;
}
body[data-view=choose] .ph-template-shortcuts button::after{
  content:none!important;display:none!important;
}
/* Mask replaces decorative more-dots; do not add any new inline control. */
body[data-view=choose] .ph-template-shortcuts button::before{
  content:""!important;letter-spacing:0!important;
  font-size:0!important;line-height:0!important;
  -webkit-mask-image:var(--ph-filter-icon)!important;
  mask-image:var(--ph-filter-icon)!important;
}
body .ph-office-panel-content .ph-element-categories button{
  position:relative!important;isolation:isolate;
  background:linear-gradient(150deg,
    color-mix(in srgb,var(--element-tint,#148c74) 85%,white),
    var(--element-tint,#148c74))!important;
  border:1px solid #ffffffb9!important;
  border-bottom:2px solid #063a3229!important;
  border-radius:14px!important;
  box-shadow:inset 0 1px 1px #ffffff8a,0 3px 0 #10362a27,0 9px 17px #10362a19!important;
  overflow:visible!important;
  color:#fff!important;
  font-weight:700!important;
  text-shadow:0 1px 2px #123a305a;
  transition:transform .22s ease,box-shadow .22s ease,filter .22s ease!important;
}
body .ph-office-panel-content .ph-element-categories button .ph-category-art{
  display:grid!important;place-items:center!important;isolation:isolate;
  position:relative!important;
  border:1px solid #ffffffb8!important;
  border-radius:13px!important;
  width:47px!important;height:47px!important;min-height:47px;
  padding:5px!important;box-sizing:border-box!important;
  background:linear-gradient(145deg,#ffffffed,#ffffffb8)!important;
  box-shadow:0 5px 10px #102f352a,inset 0 1px 2px #fff!important;
  transform:perspective(260px) rotateY(-5deg) rotateZ(-3deg);
  transition:transform .22s ease,box-shadow .22s ease!important;
}
body .ph-office-panel-content .ph-element-categories button .ph-category-art::before{
  content:"";position:absolute;inset:4px -3px -3px 6px;
  border:1px solid #ffffffc9;border-radius:9px;
  background:linear-gradient(145deg,#ffffffa8,#ffffff5c);
  transform:rotate(11deg) translate(1px,-3px);
  box-shadow:0 4px 8px #102f3523;z-index:-1;
}
body .ph-office-panel-content .ph-element-categories button .ph-category-art::after{
  content:"";position:absolute;inset:9px;z-index:2;
  background:#185d60;
  -webkit-mask-image:var(--ph-element-symbol);mask-image:var(--ph-element-symbol);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;
  filter:drop-shadow(0 2px 2px #17362c24);
}
body .ph-office-panel-content .ph-element-categories button .ph-category-art > svg,
body .ph-office-panel-content .ph-element-categories button .ph-category-art > img{
  opacity:.11!important;max-height:95%!important;max-width:95%!important;
  filter:none!important;pointer-events:none!important;
}
body .ph-office-panel-content .ph-element-categories button[aria-pressed=true]{
  box-shadow:0 0 0 2px #d3fbe5,0 0 0 4px #18966f,0 6px 17px #0e54304d!important;
}
body .ph-office-panel-content .ph-element-categories button:focus-visible{
  outline:3px solid #155baf!important;outline-offset:3px!important;
}
@media(hover:hover) and (pointer:fine){
 body .ph-office-panel-content .ph-element-categories button:hover{
  transform:translateY(-3px)!important;
  box-shadow:inset 0 1px 1px #ffffffb5,0 5px 0 #10362a24,0 15px 23px #10362a30!important;
 }
 body .ph-office-panel-content .ph-element-categories button:hover .ph-category-art{
  transform:perspective(260px) rotateY(2deg) rotateZ(2deg) translateY(-3px);
  box-shadow:0 9px 15px #102f3540,0 0 10px #ffffff9c!important;
 }
}
@media(max-width:760px){
 body .ph-office-panel-content .ph-element-categories button .ph-category-art{
  width:42px!important;height:42px!important;min-height:42px!important;
 }
}
@media(prefers-reduced-motion:reduce){
 body .ph-office-panel-content .ph-element-categories button,
 body .ph-office-panel-content .ph-element-categories button .ph-category-art{transition:none!important}
 body .ph-office-panel-content .ph-element-categories button:hover,
 body .ph-office-panel-content .ph-element-categories button:hover .ph-category-art{transform:none!important}
}
body .ph-office-panel-content .ph-element-categories button[data-category="Sections"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%204h16v5H4z%20M4%2012h7v8H4z%20M14%2012h6v8h-6z%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Shapes"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%204h8v8H3z%20M17%204l4%208h-8z%20M7%2016a4%204%200%201%200%200%208%204%204%200%201%200%200-8%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Graphics"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2020l6-6%204%204%207-9%20M4%206h5v5%20M13%204h7v7%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Icons"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%202l2.5%206.5L21%2011l-6.5%202.5L12%2020l-2.5-6.5L3%2011l6.5-2.5z%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Social"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%205h16v12H8l-4%204z%20M9%2010h6%20M9%2013h4%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Grids"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%203h8v8H3z%20M13%203h8v8h-8z%20M3%2013h8v8H3z%20M13%2013h8v8h-8z%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Tables"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%204h18v16H3z%20M3%2010h18%20M3%2015h18%20M9%204v16%20M15%204v16%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Infographics"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2020V4%20M3%2020h18%20M8%2017v-6%20M13%2017V7%20M18%2017v-9%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Templates"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%203h14v18H5z%20M8%207h8%20M8%2011h8%20M8%2016h5%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Document templates"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%202h9l5%205v15H6z%20M15%202v5h5%20M9%2012h8%20M9%2016h6%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Print layouts"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M7%203h10v5H7z%20M5%209h14v9H5z%20M8%2018v3h8v-3%20M8%2013h8%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Social templates"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%205h18v14H3z%20M7%209h10%20M7%2014h5%20M15%2012l3%203-3%202%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Motion presets"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2012a8%208%200%201%201%204%207%20M4%2017v-5h5%20M10%208l6%204-6%204z%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Business cards"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%206h18v12H3z%20M7%2010h5%20M7%2014h8%20M17%2011h2%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Letterheads"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%202h14v20H5z%20M8%206h8%20M8%2011h8%20M8%2015h6%20M8%2018h8%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Invoices"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%202h14v20l-3-2-3%202-3-2-3%202-2-2z%20M8%208h8%20M8%2012h8%20M8%2016h4%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Certificates"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%204h18v13H3z%20M7%208h10%20M7%2012h5%20M13%2017l-1%205%203-2%203%202-1-5%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Assignments"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%203h14v18H5z%20M9%207h7%20M9%2011h7%20M9%2015h4%20M8%2017l2%202%204-4%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Portfolio pages"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%205h7l2%203h9v12H3z%20M6%2012h12%20M6%2016h8%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Photos"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%204h18v16H3z%20M3%2017l6-6%204%204%203-3%205%205%20M16%209h.01%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Photo layouts"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%203h18v18H3z%20M3%2011h18%20M12%2011v10%20M9%207h.01%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="Uploads"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M7%2019H5a4%204%200%200%201-1-8%207%207%200%200%201%2014-1%205%205%200%200%201%200%209h-2%20M12%2021V11%20M8%2015l4-4%204%204%22%2F%3E%3C%2Fsvg%3E")}
body .ph-office-panel-content .ph-element-categories button[data-category="HTML"] .ph-category-art{--ph-element-symbol:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%208l-4%204%204%204%20M16%208l4%204-4%204%20M14%204l-4%2016%22%2F%3E%3C%2Fsvg%3E")}


/* Gentle Studio palette for Elements tiles. The old category artwork could
   contain miniature template text (notably "Sections"); hide it beneath the
   original clean CSS-mask icon without changing the button's click action. */
body .ph-office-panel-content .ph-element-categories button{
  --ph-tile-bg:#e1ede6;
  --ph-tile-ink:#2d6452;
  background:linear-gradient(145deg,
    color-mix(in srgb,var(--ph-tile-bg) 65%,white),
    var(--ph-tile-bg))!important;
  color:#243c35!important;
  text-shadow:none!important;
  border:1px solid color-mix(in srgb,var(--ph-tile-ink) 21%,white)!important;
  border-bottom:1px solid color-mix(in srgb,var(--ph-tile-ink) 21%,white)!important;
  box-shadow:inset 0 1px 0 #fff,0 3px 0 color-mix(in srgb,var(--ph-tile-ink) 16%,white),0 9px 16px #273e3414!important;
  font-weight:750!important;
}
body .ph-office-panel-content .ph-element-categories button .ph-category-art{
  font-size:0!important;color:transparent!important;
  background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--ph-tile-bg) 42%,white))!important;
  box-shadow:inset 0 1px 0 #fff,0 4px 10px #173b2d1e!important;
  border-color:#ffffffeb!important;
}
/* Covers old cached editor bundles too. Clean icons are pseudo-elements. */
body .ph-office-panel-content .ph-element-categories button .ph-category-art > *{
  display:none!important;
}
body .ph-office-panel-content .ph-element-categories button .ph-category-art::before,
body .ph-office-panel-content .ph-element-categories button .ph-category-art::after{
  visibility:visible!important;
}
body .ph-office-panel-content .ph-element-categories button .ph-category-art::after{
  background:var(--ph-tile-ink)!important;
}
body .ph-office-panel-content .ph-element-categories button[aria-pressed=true]{
  box-shadow:0 0 0 2px white,0 0 0 4px var(--ph-tile-ink),0 8px 15px #1d463329!important;
}
@media(hover:hover) and (pointer:fine){
  body .ph-office-panel-content .ph-element-categories button:hover{
    transform:translateY(-2px)!important;
    box-shadow:inset 0 1px 0 #fff,0 4px 0 color-mix(in srgb,var(--ph-tile-ink) 18%,white),0 12px 21px #273e3424!important;
  }
  body .ph-office-panel-content .ph-element-categories button:hover .ph-category-art{
    box-shadow:inset 0 1px 0 white,0 7px 12px #173b2d25!important;
  }
}
body .ph-office-panel-content .ph-element-categories button[data-category="Sections"]{--ph-tile-bg:#d9ede3;--ph-tile-ink:#255d49}
body .ph-office-panel-content .ph-element-categories button[data-category="Shapes"]{--ph-tile-bg:#dde7f6;--ph-tile-ink:#365a8c}
body .ph-office-panel-content .ph-element-categories button[data-category="Graphics"]{--ph-tile-bg:#f4dfe5;--ph-tile-ink:#94506b}
body .ph-office-panel-content .ph-element-categories button[data-category="Icons"]{--ph-tile-bg:#f3e8d5;--ph-tile-ink:#86622e}
body .ph-office-panel-content .ph-element-categories button[data-category="Social"]{--ph-tile-bg:#e7dff2;--ph-tile-ink:#69528c}
body .ph-office-panel-content .ph-element-categories button[data-category="Grids"]{--ph-tile-bg:#d9eaee;--ph-tile-ink:#306a75}
body .ph-office-panel-content .ph-element-categories button[data-category="Tables"]{--ph-tile-bg:#e2eadd;--ph-tile-ink:#4e7452}
body .ph-office-panel-content .ph-element-categories button[data-category="Infographics"]{--ph-tile-bg:#e8e3f0;--ph-tile-ink:#675a86}
body .ph-office-panel-content .ph-element-categories button[data-category="Templates"]{--ph-tile-bg:#efe6da;--ph-tile-ink:#7b644b}
body .ph-office-panel-content .ph-element-categories button[data-category="Document templates"]{--ph-tile-bg:#dce7ea;--ph-tile-ink:#486d7a}
body .ph-office-panel-content .ph-element-categories button[data-category="Print layouts"]{--ph-tile-bg:#ede0e7;--ph-tile-ink:#815b72}
body .ph-office-panel-content .ph-element-categories button[data-category="Social templates"]{--ph-tile-bg:#e3e9f5;--ph-tile-ink:#586f9a}
body .ph-office-panel-content .ph-element-categories button[data-category="Motion presets"]{--ph-tile-bg:#ede8d9;--ph-tile-ink:#82703e}
body .ph-office-panel-content .ph-element-categories button[data-category="Business cards"]{--ph-tile-bg:#dbebe5;--ph-tile-ink:#41796a}
body .ph-office-panel-content .ph-element-categories button[data-category="Letterheads"]{--ph-tile-bg:#e5e0f0;--ph-tile-ink:#6a5d8b}
body .ph-office-panel-content .ph-element-categories button[data-category="Invoices"]{--ph-tile-bg:#f4e5dc;--ph-tile-ink:#92644d}
body .ph-office-panel-content .ph-element-categories button[data-category="Certificates"]{--ph-tile-bg:#e8ecda;--ph-tile-ink:#697949}
body .ph-office-panel-content .ph-element-categories button[data-category="Assignments"]{--ph-tile-bg:#dce8f1;--ph-tile-ink:#4c708e}
body .ph-office-panel-content .ph-element-categories button[data-category="Portfolio pages"]{--ph-tile-bg:#eee0e9;--ph-tile-ink:#865e76}
body .ph-office-panel-content .ph-element-categories button[data-category="Photos"]{--ph-tile-bg:#ddecef;--ph-tile-ink:#407783}
body .ph-office-panel-content .ph-element-categories button[data-category="Photo layouts"]{--ph-tile-bg:#ede4da;--ph-tile-ink:#856f58}
body .ph-office-panel-content .ph-element-categories button[data-category="Uploads"]{--ph-tile-bg:#ddeadc;--ph-tile-ink:#527956}
body .ph-office-panel-content .ph-element-categories button[data-category="HTML"]{--ph-tile-bg:#e5e8f0;--ph-tile-ink:#5b6587}